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

:root{
  --sans:"Hiragino Sans","Zen Kaku Gothic New","Inter","Helvetica Neue",Helvetica,Arial,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1); --t-fast:.25s; --t-slow:.6s;
  --serif:"Instrument Serif","Shippori Mincho","Hiragino Mincho ProN","Yu Mincho","Iowan Old Style",Georgia,serif;
  --bg:#E9E7E1; --ink:#16161A; --ink-40:rgba(22,22,26,.64); --ink-25:rgba(22,22,26,.63); --rule:rgba(22,22,26,.3); --rule-soft:rgba(22,22,26,.12);
  --ph:#DBD8D0; --bar:#000000; --bar-ink:#FFFFFF; --bar-60:rgba(255,255,255,.6);
  --accent:#B8102E; --accent-ink:#FFFFFF; --accent-40:rgba(22,22,26,.55); --accent-rule:rgba(22,22,26,.25);
  --pill:#16161A; --pill-ink:#E9E7E1; --up:#A50F29;
  --ink-rgb:22,22,26; --bg-rgb:233,231,225;
  --board:#0B0B0C; --board-ink:#fff; --board-dim:rgba(255,255,255,.55); --board-rule:rgba(255,255,255,.14); --board-mq:#0B0B0C; --board-mq-ink:#fff; --board-mq-dim:rgba(255,255,255,.4);
 --accent-40:rgba(255,255,255,.62);
 --bar-accent:#FF4A5E;

}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --serif:"Instrument Serif","Shippori Mincho","Hiragino Mincho ProN","Yu Mincho","Iowan Old Style",Georgia,serif;
  --bg:#0B0B0C; --ink:#F2EFE9; --ink-40:rgba(242,239,233,.5); --ink-25:rgba(242,239,233,.5); --rule:rgba(242,239,233,.28); --rule-soft:rgba(242,239,233,.12);
  --ph:#1C1C1F; --bar:#000000; --bar-ink:#FFFFFF; --bar-60:rgba(255,255,255,.6);
  --accent:#D7263D; --accent-ink:#FFFFFF; --accent-40:rgba(255,255,255,.55); --accent-rule:rgba(255,255,255,.25);
  --pill:#F2EFE9; --pill-ink:#0B0B0C; --up:#FF4D5E;
  --ink-rgb:242,239,233; --bg-rgb:11,11,12;
  --board:#0B0B0C; --board-ink:#fff; --board-mq:#0B0B0C; --board-mq-ink:#fff;
 --bar-rule:rgba(255,255,255,.12);

}}
:root[data-theme="dark"]{
  --serif:"Instrument Serif","Shippori Mincho","Hiragino Mincho ProN","Yu Mincho","Iowan Old Style",Georgia,serif;
  --bg:#0B0B0C; --ink:#F2EFE9; --ink-40:rgba(242,239,233,.5); --ink-25:rgba(242,239,233,.5); --rule:rgba(242,239,233,.28); --rule-soft:rgba(242,239,233,.12);
  --ph:#1C1C1F; --bar:#000000; --bar-ink:#FFFFFF; --bar-60:rgba(255,255,255,.6);
  --accent:#D7263D; --accent-ink:#FFFFFF; --accent-40:rgba(255,255,255,.55); --accent-rule:rgba(255,255,255,.25);
  --pill:#F2EFE9; --pill-ink:#0B0B0C; --up:#FF4D5E;
  --ink-rgb:242,239,233; --bg-rgb:11,11,12;
  --board:#0B0B0C; --board-ink:#fff; --board-mq:#0B0B0C; --board-mq-ink:#fff;
 --bar-rule:rgba(255,255,255,.12);

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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


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


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

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

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

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

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

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

.head h1,.colhead > div span.l,.menu .ch,.tabs button span,.about-text h2,.post h2,.thumb h2,h1.story,.lead h2,.lead .note,.ev h2,.logo,.single h1,.dhead h1,.wire a,.subhead{font-family:var(--serif);font-weight:400;letter-spacing:-.005em}
.pill,.head .sub,.meta,.subhead .grey,.tabs,.bar,.menu,button{font-family:var(--sans)}
.logo .jp{font-family:var(--serif)}
.accent,#radar.accent{background:#141416;color:#F2EFE9}
.accent .pill.jpill,.board .pill.jpill{border-color:rgba(242,239,233,.7)}
/* Cinepuuulse Releases (releases.pen frames GaVc3 index, Lf4D5 page, olHpX and Ylsuw phone; approved by the owner 2026-10-12).
   Instrument Serif for heads, the site's sans for text, pill chips and buttons, a red dot on the tiles. */
.xr{--xr-disp:var(--serif);--xr-disp-w:400;--xr-disp-ls:-.012em;--xr-txt:var(--sans);--xr-lab:var(--sans);--xr-lab-fs:12.5px;--xr-lab-tt:none;--xr-lab-ls:0;--xr-r:999px;--xr-dot-r:50%}
/* ---------------------------------------------------------------- the shared layout (releases.pen: one layout, themed per magazine)
   Every rule sits under main.xpage-releases (the wrapper build.py gives the step's pages) and .xr (the engine's markup). The
   1440 px frame's values are used as written; the large type scales with vw below 1440; at 600 px and under the phone frames apply.
   Colours and fonts are the magazine's own variables (light and dark), never new ones: fonts are locked (owner, 2026-09-07). */
main.single.xpage-releases{display:block;max-width:none;width:auto;margin:0;padding:48px 0 0;color:var(--ink);background:var(--bg)}
.xr{--g:32px;--rail:336px;--xr-acc:var(--accent-text,var(--accent));overflow-x:clip;font-family:var(--xr-txt)}
.xr *{box-sizing:border-box}
.xr h1,.xr h2,.xr p,.xr ol,.xr dl,.xr dd,.xr figure{margin:0}
.xr ol{padding:0;list-style:none}
.xr a{color:inherit;text-decoration:none}
.xr i{font-style:normal}
.xr svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;display:block}
.xr .xr-k,main.xpage-releases .xr h2.xr-k{font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt)}
.xr .xr-n-p,.xr .xr-pm,.xr .xr-src-p,.xr .xr-go{display:none}
.xr .xr-q::before{content:"\201C"}.xr .xr-q::after{content:"\201D"}

/* crumb: News / Releases (/ Brand) */
.xr-crumb{display:flex;align-items:center;gap:10px;padding:0 var(--g);height:44px;border-bottom:1px solid var(--rule-soft);font:400 var(--xr-lab-fs)/1 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt)}
.xr-crumb .xr-back{display:none}
.xr-crumb .xr-cr-d{display:flex;gap:10px;align-items:center;color:var(--ink-40)}
.xr-crumb .xr-cr-d a:first-child{color:var(--xr-acc)}
.xr-crumb .xr-cr-d i{opacity:.7}
.xr-crumb .xr-cr-b{color:var(--ink)}
.xr-crumb a:hover{text-decoration:underline;text-underline-offset:3px}
.xr-index:has(.xr-crumb-i) .xr-kick{display:none}

/* the type tiles: one quiet block per maker, the magazine's dot top left, the maker below (no borrowed pictures) */
.xr-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;flex:none;width:160px;height:106px;padding:10px;background:var(--ph);color:var(--ink);overflow:hidden}
.xr-tile::before{content:"";position:absolute;left:12px;top:12px;width:7px;height:7px;border-radius:var(--xr-dot-r);background:var(--accent)}
.xr-tile small{display:none}
.xr-tile b{font:var(--xr-tile-w,400) 19px/1.08 var(--xr-disp);letter-spacing:var(--xr-disp-ls);overflow-wrap:anywhere}

/* ---------------------------------------------------------------- index: hero */
.xr-hero{display:flex;flex-wrap:wrap;align-items:stretch;justify-content:space-between;gap:40px;padding:44px var(--g) 36px}
.xr-hero-l{flex:0 1 760px;min-width:0;display:flex;flex-direction:column;justify-content:flex-end;gap:22px}
.xr .xr-h1{font:var(--xr-disp-w) clamp(76px,11.2vw,162px)/.86 var(--xr-disp);letter-spacing:calc(var(--xr-disp-ls) * 3);color:var(--ink);text-transform:none;margin:0}
.xr-intro{display:flex;flex-direction:column;gap:18px;max-width:660px}
.xr-kick{color:var(--xr-acc)}
.xr-lede{font:400 20px/1.4 var(--xr-txt);color:var(--ink-40)}
.xr .xr-count{color:var(--xr-acc)}
.xr-latest{position:relative;flex:0 1 516px;min-height:300px;display:flex;flex-direction:column;justify-content:flex-start;padding:22px 24px;background:var(--accent);color:var(--accent-ink)}
.xr-latest[class*="xr-h-"]{background:var(--accent);color:var(--accent-ink)}
.xr-latest-k{order:0;font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt)}
.xr-latest-top{order:2;display:flex;justify-content:space-between;gap:12px;margin-top:12px}
.xr-latest-top small{font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt)}
.xr-latest-top .xr-pill{display:none}
.xr-latest-b{order:1;display:flex;flex-direction:column;gap:10px;margin-top:auto}
.xr-latest-b>small{display:none}
.xr-latest-b>b{font:var(--xr-disp-w) 32px/1.08 var(--xr-disp);letter-spacing:var(--xr-disp-ls)}
.xr-latest-d{display:none}
.xr .xr-latest .xr-btn{position:absolute;inset:0;border-radius:0;background:none;padding:0;font-size:0;color:transparent}
.xr-latest .xr-btn svg{display:none}
.xr-latest:hover .xr-latest-b>b{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}

/* ---------------------------------------------------------------- index: filters and the makers strip */
.xr-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px var(--g);border-top:1px solid var(--rule-soft);border-bottom:1px solid var(--rule-soft)}
.xr-filters>.xr-k{display:none}
.xr-chips{display:flex;flex-wrap:wrap;gap:8px}
.xr-chip{appearance:none;background:transparent;color:var(--ink);border:1px solid var(--rule);border-radius:var(--xr-r);padding:7px 13px;font:400 var(--xr-lab-fs)/1.2 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);cursor:pointer;white-space:nowrap}
.xr-chip .xr-c{color:var(--xr-acc);margin-left:4px}
.xr-chip[aria-pressed="true"]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.xr-chip[aria-pressed="true"] .xr-c{color:inherit}
.xr-chip:not([aria-pressed="true"]):hover{border-color:var(--ink)}
.xr-sp{flex:1 1 0}
.xr-selects{display:flex;gap:10px}
.xr-sel{position:relative;display:flex;align-items:center;gap:8px;border:1px solid var(--rule);border-radius:var(--xr-r);padding:0 14px}
.xr-sel .xr-k{color:var(--ink-40)}
.xr-sel select{appearance:none;-webkit-appearance:none;background:transparent;border:0;color:var(--ink);font:400 var(--xr-lab-fs)/1.2 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);padding:8px 20px 8px 0;margin:0;cursor:pointer;max-width:220px}
.xr-sel select option{background:var(--bg);color:var(--ink)}
.xr-sel svg{position:absolute;right:12px;width:14px;height:14px;pointer-events:none}
.xr-makers{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;padding:14px var(--g);border-bottom:1px solid var(--rule-soft)}
.xr-makers .xr-k{color:var(--ink-40);margin-right:4px}
.xr-makers a{font:500 17px/1.3 var(--xr-txt)}
.xr-makers a:hover,.xr-makers a.on{color:var(--xr-acc)}
.xr-more-n{font:500 17px/1.3 var(--xr-txt)}

/* ---------------------------------------------------------------- index: the list and the rail */
.xr-body{display:flex;align-items:flex-start;gap:48px;padding:32px var(--g) 64px}
.xr-main{flex:1 1 0;min-width:0}
.xr-month{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:22px 0 10px;border-bottom:2px solid var(--ink)}
.xr-month:first-child{padding-top:0}
.xr-month h2{font:var(--xr-disp-w) 40px/1 var(--xr-disp);letter-spacing:var(--xr-disp-ls)}
.xr-month small{font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--ink-40)}
.xr-month.xr-dim{opacity:.45}
.xr-row{border-bottom:1px solid var(--rule-soft)}
.xr-row-a{display:grid;grid-template-columns:82px 160px minmax(0,1fr);gap:22px;padding:18px 0}
.xr-date{display:flex;gap:4px;font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--ink-40)}
.xr-date b{font-weight:400}
.xr-date small{display:inline-block;font:inherit;text-transform:var(--xr-mon-tt,lowercase)}.xr-date small::first-letter{text-transform:uppercase}
.xr-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.xr-meta{display:flex;flex-wrap:wrap;gap:12px;align-items:baseline}
.xr-meta .xr-pill{font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--xr-acc)}
.xr-meta .xr-feat{font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--ink)}
.xr-meta .xr-src{display:none}
.xr .xr-text .xr-src-p{display:block;font:400 calc(var(--xr-lab-fs) - 1px)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--ink-40)}
.xr-t{font:var(--xr-disp-w) 27px/1.15 var(--xr-disp);letter-spacing:var(--xr-disp-ls)}
.xr-line{font:400 16px/1.45 var(--xr-txt);color:var(--ink-40);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.xr-row-a:hover .xr-t{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.xr-empty{padding:24px 0;color:var(--ink-40)}
.xr-next{appearance:none;display:flex;align-items:center;justify-content:center;gap:6px;width:100%;margin-top:16px;padding:15px;background:transparent;color:var(--ink);border:2px solid var(--ink);border-radius:var(--xr-r);font:400 var(--xr-lab-fs)/1.2 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);cursor:pointer}
.xr-next svg{width:13px;height:13px}
.xr-next:hover{background:var(--ink);color:var(--bg)}
.xr-next[hidden]{display:none}
.xr-rail{flex:0 0 var(--rail);display:flex;flex-direction:column;gap:30px}
.xr-rb{border-top:2px solid var(--ink);padding-top:14px}
.xr-rb h2.xr-k{color:var(--ink-40);margin-bottom:6px}
.xr-rb ol li{border-bottom:1px solid var(--rule-soft)}
.xr-rb ol li a,.xr-rb ol li>span{display:grid;grid-template-columns:140px 1fr;align-items:center;gap:10px;padding:8px 0;font:500 15px/1.3 var(--xr-txt)}
.xr-rb ol li a small{display:flex;align-items:center;gap:10px;font:400 var(--xr-lab-fs)/1 var(--xr-lab)}
.xr-rb ol li a small i{display:block;height:5px;border-radius:var(--xr-r);background:var(--accent)}
.xr-rb ol li a:hover b{color:var(--xr-acc)}
.xr-bytype ol li>span{grid-template-columns:1fr auto}
.xr-bytype ol li>span small{font:400 var(--xr-lab-fs)/1 var(--xr-lab);color:var(--xr-acc)}
.xr-bytype .xr-bar{display:none}
.xr-rb p{font:400 15px/1.45 var(--xr-txt);color:var(--ink-40)}

/* ---------------------------------------------------------------- the release page */
.xr-main-p{display:grid;grid-template-columns:minmax(0,600px) minmax(0,1fr);gap:48px;align-items:start;padding:40px var(--g) 56px}
.xr-sleeve{position:relative;container-type:inline-size;aspect-ratio:600/560;display:flex;flex-direction:column;justify-content:space-between;padding:24px;background:var(--ph);color:var(--ink);overflow:hidden}
.xr-sleeve[class*="xr-h-"]{background:var(--ph);color:var(--ink)}
.xr-sleeve::before{content:"";position:absolute;left:24px;top:24px;width:14px;height:14px;border-radius:var(--xr-dot-r);background:var(--accent)}
.xr-sl-top{visibility:hidden}
.xr-big{display:flex;flex-direction:column;white-space:nowrap;font:var(--xr-disp-w) min(140px,calc(100cqw / (var(--n,5) * .6)))/.92 var(--xr-disp);letter-spacing:calc(var(--xr-disp-ls) * 2)}
.xr-sl-bot{display:flex;font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt)}
.xr-sl-bot small{font:inherit}
.xr-sl-sep,.xr-sl-bot small:last-child{display:none}
.xr-sleeve-img img{width:100%;height:auto;display:block}
.xr-sleeve-img figcaption{margin-top:8px;color:var(--ink-40)}
.xr-copy{display:flex;flex-direction:column;gap:20px;min-width:0}
.xr-tags{display:flex;flex-wrap:wrap;gap:0;font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--xr-acc)}
.xr-tags .xr-pill{font:inherit}
.xr-tags .xr-pill:nth-child(2){display:none}
.xr-tags .xr-pill-b::before{content:"\00a0·\00a0"}
.xr .xr-h1p{font:var(--xr-disp-w) clamp(38px,3.7vw,54px)/1.06 var(--xr-disp);letter-spacing:var(--xr-disp-ls);text-transform:none;margin:0}
.xr-brief{font:400 19px/1.5 var(--xr-txt)}
.xr-facts{border-top:2px solid var(--ink);padding-top:12px}
.xr-facts h2.xr-k{color:var(--ink-40);margin-bottom:2px}
.xr-fact{display:grid;grid-template-columns:150px 1fr;gap:8px;padding:10px 0;border-bottom:1px solid var(--rule-soft)}
.xr-fact dt{font:400 var(--xr-lab-fs)/1.5 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--ink-40)}
.xr-fact dd{font:500 17px/1.4 var(--xr-txt)}
.xr-links{display:flex;flex-direction:column;gap:10px}
.xr .xr-btn{display:flex;align-items:center;justify-content:space-between;gap:16px;border-radius:var(--xr-r);padding:14px 20px;font:600 17px/1.2 var(--xr-txt);transition:opacity .2s}
.xr-btn svg{flex:none;width:18px;height:18px}
.xr .xr-off{background:var(--accent);color:var(--accent-ink)}
.xr .xr-kit{border:1.5px solid var(--ink);color:var(--ink)}
.xr .xr-btn:hover{opacity:.86}
.xr-note{font:400 13px/1.5 var(--xr-txt);color:var(--ink-40)}
.xr-video{padding:0 var(--g) 56px}
.xr-sec-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:12px;border-bottom:2px solid var(--ink);margin-bottom:14px}
.xr-sec-h h2{font:var(--xr-disp-w) 40px/1 var(--xr-disp);letter-spacing:var(--xr-disp-ls)}
.xr-sec-h small{color:var(--ink-40)}
.xr-player{position:relative;aspect-ratio:16/7.2;background:#000;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:24px;text-align:center}
.xr-player.on{padding:0;aspect-ratio:16/9}
.xr-player iframe{width:100%;height:100%;border:0;display:block}
.xr-play{appearance:none;width:84px;height:84px;border:0;border-radius:var(--xr-dot-r);background:var(--accent);color:var(--accent-ink);padding:24px 22px 24px 26px;cursor:pointer}
.xr-play-l{font:600 20px/1.3 var(--xr-txt)}
.xr-legal{font:400 13px/1.5 var(--xr-txt);color:rgba(255,255,255,.62)}
.xr-legal a{text-decoration:underline;text-underline-offset:2px}
.xr-morefrom{background:var(--bar);color:#fff;padding:48px var(--g) 56px;--ink:#fff;--ink-40:rgba(255,255,255,.55);--rule-soft:rgba(255,255,255,.12)}
.xr-mf-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding-bottom:12px;border-bottom:2px solid #fff;margin-bottom:20px}
.xr-mf-h h2{font:var(--xr-disp-w) 44px/1.02 var(--xr-disp);letter-spacing:var(--xr-disp-ls)}
.xr-mf-h h2 .xr-n-d{display:none}.xr-mf-h h2 .xr-n-p{display:inline}
.xr-mf-h a.xr-k{color:var(--xr-acc);text-align:right}
.xr-more-note{font:400 16px/1.4 var(--xr-txt);color:var(--ink-40);margin-bottom:22px}
.xr-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.xr-card{display:flex;flex-direction:column;gap:10px;min-width:0}
.xr-card .xr-tile{width:100%;height:auto;aspect-ratio:390/176;background:#1C1C1F;color:#fff}
.xr-card .xr-tile::before{left:10px;top:10px;width:6px;height:6px}
.xr-card .xr-tile b{font-size:18px}
.xr-card .xr-k{order:1;color:var(--xr-acc)}
.xr-card-t{order:2;font:var(--xr-disp-w) 21px/1.2 var(--xr-disp);letter-spacing:var(--xr-disp-ls)}
.xr-card:hover .xr-card-t{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.menu a.xr-menu{display:block}

/* ---------------------------------------------------------------- narrower screens */
@media (max-width:1200px){
  .xr-body{gap:32px}.xr{--rail:280px}
  .xr-main-p{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px}
}
@media (max-width:960px){
  .xr{--g:24px}
  .xr-body{flex-direction:column}.xr-rail{flex:none;width:100%}
  .xr-latest{flex:1 1 100%;min-height:220px}
  .xr-main-p{grid-template-columns:1fr}
  .xr-sleeve{max-width:600px;width:100%}
  .xr-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
/* ---------------------------------------------------------------- phone frames (390) */
@media (max-width:600px){
  .xr{--g:16px}
  .xr-crumb{height:38px}
  .xr-hero{padding:24px var(--g) 22px;gap:22px}
  .xr .xr-h1{font-size:64px}
  .xr-lede{font-size:17px}
  .xr-latest{min-height:0;padding:16px;gap:28px}
  .xr-latest-b>b{font-size:24px}
  .xr-filters{padding:12px var(--g);gap:10px}
  .xr-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 calc(-1 * var(--g));padding:0 var(--g);width:calc(100% + 2 * var(--g))}
  .xr-chips::-webkit-scrollbar{display:none}
  .xr-sp{display:none}
  .xr-selects{width:100%}.xr-sel{flex:1 1 0;min-width:0}.xr-sel select{width:100%}
  .xr-makers{display:none}
  .xr-body{padding:22px var(--g) 40px}
  .xr-rail{display:none}
  .xr-month h2{font-size:30px}
  .xr-month .xr-n-d{display:none}.xr-month .xr-n-p{display:inline}
  .xr-row-a{grid-template-columns:96px minmax(0,1fr);gap:14px;padding:14px 0}
  .xr-date,.xr-meta,.xr-line,.xr .xr-text .xr-src-p{display:none}
  .xr .xr-pm{display:block;font:400 var(--xr-lab-fs)/1.4 var(--xr-lab);letter-spacing:var(--xr-lab-ls);text-transform:var(--xr-lab-tt);color:var(--xr-acc)}
  .xr-tile{width:96px;height:64px;padding:8px}
  .xr-tile::before{left:8px;top:8px;width:6px;height:6px}
  .xr-tile b{font-size:14px}
  .xr-t{font-size:20px}
  .xr-next .xr-n-d{display:none}.xr-next .xr-n-p{display:inline}
  .xr-main-p{padding:20px var(--g) 36px;gap:22px}
  .xr-sleeve{aspect-ratio:358/240;padding:16px}
  .xr-sleeve::before{left:16px;top:16px;width:10px;height:10px}
  .xr-big{font-size:min(80px,calc(100cqw / (var(--n,5) * .6)))}
  .xr-brief{font-size:17px}
  .xr-fact{grid-template-columns:110px 1fr}
  .xr-fact dd{font-size:16px}
  .xr-video{padding:0 var(--g) 36px}
  .xr-video .xr-sec-h{display:none}
  .xr-player{aspect-ratio:358/200}
  .xr-play{width:56px;height:56px;padding:16px 14px 16px 18px}
  .xr-play-l .xr-n-d,.xr-legal{display:none}.xr-play-l .xr-n-p{display:inline}.xr-play-l{font-size:14px;font-weight:400;opacity:.62}
  .xr-morefrom{padding:30px var(--g) 36px}
  .xr-mf-h{flex-direction:column;align-items:flex-start}
  .xr-mf-h h2{font-size:30px}
  .xr-more-note .xr-n-d{display:none}.xr-more-note .xr-n-p{display:inline}
  .xr-cards{grid-template-columns:1fr;gap:18px}
}

/* Cinepuuulse shell (stage 1 redesign, 2026-10-13): top bar, dropdown menu, footer. Numbers from cine.pen frames gh2Jh,
   MtSZP/Vf13H/RAPOi/Hfmhm, JELSj, Pjdf4, GiSZm, bwRan. Type below the site's 14.6px floor in the frame is raised to it
   (owner rule: sizes below the floor may be raised, never lowered). Families are the site's: var(--serif) = Instrument
   Serif, var(--sans), Shippori Mincho for the 銀幕 mark. */
:root{--cp-bar:64px;--cp-bg:#0B0B0C;--cp-ink:#F2EFE9;--cp-red:#D7263D;--cp-redt:#FF4A5E;--cp-dim:rgba(242,239,233,.6);--cp-faint:rgba(242,239,233,.3);--cp-rule:rgba(255,255,255,.12);--cp-panel:#141416}
@media(max-width:767px){:root{--cp-bar:56px}}
/* audit 2026-10-16: the engine sets data-theme by the hour in Tokyo (light from 06:00 to 22:00) and the bar's theme
   switch is hidden on this site, so by day every engine-styled bit on these always-dark pages took the light palette's
   graphite ink: unlinked source names, the note's like button, greys in the menu. The redesign has one theme; the
   engine's palette is pinned to the site's own dark values (config css_dark) whatever data-theme says. */
:root:not(#cp-pin){--bg:#0B0B0C;--ink:#F2EFE9;--ink-40:rgba(242,239,233,.5);--ink-25:rgba(242,239,233,.5);--rule:rgba(242,239,233,.28);--rule-soft:rgba(242,239,233,.12);--ph:#1C1C1F;--accent:#D7263D;--accent-ink:#FFFFFF;--accent-40:rgba(255,255,255,.55);--accent-rule:rgba(255,255,255,.25);--pill:#F2EFE9;--pill-ink:#0B0B0C;--up:#FF4D5E;--ink-rgb:242,239,233;--bg-rgb:11,11,12;color-scheme:dark}

/* ------------------------------------------------------------ top bar */
.cp-on .bar.cp-bar{height:var(--cp-bar);padding:0 32px;gap:20px;background:var(--cp-bg);border-bottom:1px solid var(--cp-rule);box-shadow:none;justify-content:space-between}
.cp-on .bar.cp-bar .logo{gap:14px;align-items:center;flex:none}
.cp-on .bar.cp-bar .logo .logo-img{height:28px;top:0}
.cp-on .bar.cp-bar .logo .jp{font-family:"Shippori Mincho",var(--serif);font-size:18px;color:var(--cp-red);line-height:1}
.cp-on .bar.cp-bar .tick,.cp-on .bar.cp-bar .theme,.cp-on .bar.cp-bar .topnav{display:none}
.cp-on .cp-right{display:flex;align-items:center;gap:28px;margin-left:auto;min-width:0}
/* audit 2026-10-16: the pill, the menu and the scrim are scoped (.cp-right, .cp-menu, body>.cp-dim); their bare class names
   are also used on the pages (.cp-new is the box office NEW, .cp-side/.cp-sig the pairs, .cp-sec every home section,
   .cp-dim a board with no numbers) and the shell rules were styling those too */
.cp-on .cp-right .cp-new{display:inline-flex;align-items:center;gap:10px;padding:7px 14px;border:1px solid rgba(215,38,61,.5);border-radius:999px;color:var(--cp-ink);white-space:nowrap;line-height:1}
.cp-on .cp-right .cp-new i{width:7px;height:7px;border-radius:50%;background:var(--cp-red);flex:none}
.cp-on .cp-right .cp-new b{font-family:var(--sans);font-size:14.6px;font-weight:600;color:var(--cp-redt)}
.cp-on .cp-right .cp-new em{font-family:var(--serif);font-style:italic;font-size:19px;line-height:1.1}
.cp-on .cp-right .cp-new:hover{border-color:var(--cp-red);background:rgba(215,38,61,.12)}
.cp-on .bar.cp-bar .lang{color:var(--cp-dim)}
.cp-on .bar.cp-bar .menu-btn{color:var(--cp-ink);font-weight:500;gap:10px}
.cp-on .bar.cp-bar :is(a,button):focus-visible{outline:2px solid var(--cp-redt);outline-offset:3px}
.cp-on .bar.cp-bar.cp-open-bar .menu-btn i:before{top:6px;transform:rotate(45deg);box-shadow:none}
.cp-on .bar.cp-bar.cp-open-bar .menu-btn i:after{top:6px;transform:rotate(-45deg)}
/* the engine's overlay menu, scrim and board footer stay in the page (search, subscribe dialog), unseen */
.cp-on #menu,.cp-on #scrim{display:none!important}
.cp-on #footer.cp-hidden{display:none}
/* the bar grew from 56 to 64px: everything that sat under it moves with it */
.cp-on .layout-marquee .marquee,.cp-on body.layout-marquee .marquee{padding-top:var(--cp-bar)}
.cp-on .single.boxoffice .bo-nav{top:var(--cp-bar)}
.cp-on{scroll-padding-top:calc(var(--cp-bar) + 12px)}

/* ------------------------------------------------------------ dropdown (≥768) */
body>.cp-dim{position:fixed;inset:var(--cp-bar) 0 0;z-index:54;background:rgba(11,11,12,.7);opacity:0;transition:opacity .18s ease}
body>.cp-dim.in{opacity:1}
.cp-menu{position:fixed;left:0;right:0;top:var(--cp-bar);z-index:56;height:400px;background:var(--cp-panel);color:var(--cp-ink);border-bottom:2px solid var(--cp-red);
  display:grid;grid-template-columns:340px minmax(0,1fr) 360px;opacity:0;transform:translateY(-8px);transition:opacity .18s ease,transform .18s ease}
.cp-menu.in{opacity:1;transform:none}
.cp-menu[hidden],body>.cp-dim[hidden]{display:none}
.cp-menu a{color:inherit;text-decoration:none}
.cp-menu:focus{outline:none}
.cp-menu :is(a,button,input):focus-visible{outline:2px solid var(--cp-redt);outline-offset:2px}
.cp-menu .cp-mtop,.cp-menu .cp-msearch,.cp-menu .cp-mnext,.cp-menu .cp-msmall,.cp-menu .cp-sx,.cp-menu .cp-sub,.cp-menu .cp-count{display:none}
.cp-menu .cp-k{font-family:var(--sans);font-size:14.6px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cp-dim);line-height:1.2}
.cp-menu .cp-k.red{color:var(--cp-redt)}
/* the red section column */
.cp-menu .cp-secs{background:var(--cp-red);padding:20px 0;overflow:hidden}
.cp-menu .cp-sec .cp-sl{display:flex;align-items:center;min-height:41px;padding:6px 28px;font-family:var(--serif);font-size:26px;line-height:1.1;color:var(--cp-bg)}
.cp-menu .cp-sec .cp-sl .it{font-style:italic}
.cp-menu .cp-sec .cp-chev{width:20px;height:20px;margin-left:auto;fill:none;stroke:var(--cp-redt);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:0}
.cp-menu .cp-sec.on .cp-sl{background:var(--cp-bg);color:#fff}
.cp-menu .cp-sec.on .cp-chev{opacity:1}
.cp-menu .cp-sec .cp-sl:focus-visible{outline:2px solid #fff;outline-offset:-4px}
/* the open section */
.cp-menu .cp-open{padding:28px 40px;display:flex;flex-direction:column;gap:18px;min-width:0;overflow:hidden}
.cp-menu .cp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.cp-menu .cp-head h2{font-family:var(--serif);font-weight:400;font-size:36px;line-height:1.3;margin:0;color:var(--cp-ink)}
.cp-menu .cp-head h2.it{font-style:italic}
.cp-menu .cp-hub{font-family:var(--sans);font-size:15px;font-weight:600;white-space:nowrap;padding-bottom:8px}
.cp-menu .cp-hub:hover{color:var(--cp-redt)}
.cp-menu .cp-cols{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:40px;min-height:0}
.cp-menu .cp-col{display:flex;flex-direction:column;min-width:0}
.cp-menu .cp-col.cp-a{gap:10px}
.cp-menu .cp-col.cp-a a{font-family:var(--serif);font-size:21px;line-height:1.3;width:fit-content}
.cp-menu .cp-col.cp-a a:hover,.cp-menu .cp-item:hover .t,.cp-menu .cp-chips a:hover{color:var(--cp-redt)}
.cp-menu .cp-item{display:flex;flex-direction:column;gap:3px;padding:10px 0;border-bottom:1px solid var(--cp-rule)}
.cp-menu .cp-item .t{font-family:var(--serif);font-size:19px;line-height:1.15;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cp-menu .cp-item .s{font-family:var(--sans);font-size:14.6px;font-weight:600;color:var(--cp-redt)}
.cp-menu .cp-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 24px;margin-top:10px}
.cp-menu .cp-chips a{font-family:var(--serif);font-size:19px;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cp-menu .cp-wait{font-family:var(--serif);font-style:italic;font-size:19px;color:var(--cp-dim);margin:10px 0 0}
/* the right column */
/* audit 2026-10-16: scoped to the menu; unscoped, it gave the home's Asia ⇄ World sides (also .cp-side) 28px padding and a rule */
.cp-menu .cp-side{padding:28px;display:flex;flex-direction:column;gap:16px;border-left:1px solid var(--cp-rule);min-width:0;overflow:hidden}
.cp-menu .cp-side #search-form,.cp-menu .cp-msearch #search-form{display:flex;align-items:center;gap:10px;margin:0;padding:6px 12px 6px 40px;border:1px solid var(--cp-rule);background:var(--cp-bg) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23F2EFE9' stroke-opacity='.6' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") no-repeat 12px 50%/18px}
.cp-menu .cp-side #search-form input,.cp-menu .cp-msearch #search-form input{flex:1;min-width:0;background:none;border:0;outline:none;font-family:var(--serif);font-style:italic;font-size:25.36px;letter-spacing:0;color:var(--cp-ink);padding:0}
.cp-menu .cp-side #search-form input::placeholder,.cp-menu .cp-msearch #search-form input::placeholder{color:var(--cp-dim)}
.cp-menu .cp-side #search-form button,.cp-menu .cp-msearch #search-form button{display:none}   /* the frame has no button: Enter submits, as in any one-field form */
.cp-menu .cp-side #search-form:focus-within,.cp-menu .cp-msearch #search-form:focus-within{border-color:var(--cp-redt)}
.cp-menu .cp-side #search-form input:focus-visible{outline:none}
.cp-menu .cp-cal{display:flex;flex-direction:column}
.cp-menu .cp-cal-row{display:grid;grid-template-columns:54px minmax(0,1fr);gap:12px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--cp-rule)}
.cp-menu .cp-cal-row .d{font-family:var(--sans);font-size:14.6px;font-weight:700;color:var(--cp-dim);white-space:nowrap}
.cp-menu .cp-cal-row .d.red{color:var(--cp-redt)}
.cp-menu .cp-cal-row .n{font-family:var(--serif);font-size:18px;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cp-menu .cp-cal-row.ai .n{font-style:italic}
.cp-menu .cp-cal-row:hover .n{color:var(--cp-redt)}
.cp-menu .cp-sig{display:flex;align-items:center;gap:10px}
.cp-menu .cp-chip{display:inline-block;background:var(--cp-red);color:#fff!important;font-family:var(--sans);font-size:14.6px;font-weight:600;padding:5px 12px;border-radius:999px;line-height:1.1}
.cp-menu .cp-chip:hover{background:#b81f33}
.cp-menu .cp-util{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:auto}
.cp-menu .cp-util a,.cp-menu .cp-util button{font-family:var(--sans);font-size:14.6px;color:var(--cp-dim);background:none;border:0;padding:0;cursor:pointer}
.cp-menu .cp-util a:hover,.cp-menu .cp-util button:hover{color:var(--cp-ink)}
/* fluid: the panel keeps its height; the columns give way below 1200 */
@media(max-width:1199px) and (min-width:768px){
  .cp-menu{grid-template-columns:280px minmax(0,1fr) 300px}
  .cp-menu .cp-sec .cp-sl{padding:6px 22px}
  .cp-menu .cp-open{padding:28px 28px}
  .cp-menu .cp-cols{grid-template-columns:minmax(0,200px) minmax(0,1fr);gap:28px}
  .cp-menu .cp-side{padding:24px}
}
@media(max-width:1023px) and (min-width:768px){
  .cp-menu{grid-template-columns:250px minmax(0,1fr) 270px}
  .cp-menu .cp-cols{grid-template-columns:minmax(0,1fr)}
  .cp-menu .cp-cols .cp-b{display:none}
  .cp-menu .cp-head{flex-direction:column;align-items:flex-start;gap:4px}
  .cp-menu .cp-hub{padding-bottom:0}
}

/* ------------------------------------------------------------ mobile: full-screen red (GiSZm) */
@media(max-width:767px){
  .cp-on .bar.cp-bar{padding:0 16px;gap:12px}
  .cp-on .bar.cp-bar .logo{gap:10px}
  .cp-on .bar.cp-bar .logo .logo-img{height:21px}
  .cp-on .cp-right{gap:16px}
  .cp-on .cp-right .cp-new{gap:6px;padding:5px 10px}
  .cp-on .cp-right .cp-new b{display:none}
  .cp-on .cp-right .cp-new em{font-size:16px;font-size:0}
  .cp-on .cp-right .cp-new em::before{content:"Latent";font-size:16px}
  .cp-on .bar.cp-bar .menu-btn span{display:none}
  .cp-on .bar.cp-bar .lang{display:none}
  .cp-menu{top:0;bottom:0;height:auto;z-index:70;display:flex;flex-direction:column;background:var(--cp-red);border-bottom:0;overflow-y:auto;overscroll-behavior:contain;padding-bottom:24px;transform:translateY(-12px)}
  .cp-menu .cp-open,.cp-menu .cp-side{display:none}
  .cp-menu .cp-mtop{display:flex;align-items:center;justify-content:space-between;height:56px;padding:0 16px;flex:none}
  .cp-menu .cp-mlogo{display:flex;align-items:center;gap:8px}
  .cp-menu .cp-mlogo img{height:21px;width:auto;display:block}
  .cp-menu .cp-mlogo .jp{font-family:"Shippori Mincho",var(--serif);font-size:18px;color:var(--cp-bg);line-height:1}
  .cp-menu .cp-mclose{width:44px;height:44px;margin-right:-8px;background:none;border:0;padding:8px;color:var(--cp-bg);cursor:pointer}
  .cp-menu .cp-mclose svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
  .cp-menu .cp-msearch{display:block;padding:0 16px;margin:55px 0 0;flex:none}
  .cp-menu .cp-msearch #search-form{border:0;padding:12px 14px 12px 44px;background-position:14px 50%;background-size:20px}
  .cp-menu .cp-msearch #search-form input::placeholder{color:var(--cp-dim)}
  .cp-menu .cp-secs{background:none;padding:0 16px;margin-top:55px;overflow:visible;flex:none}
  .cp-menu .cp-sec{position:relative;border-bottom:1px solid rgba(11,11,12,.2)}
  .cp-menu .cp-sec .cp-sl{min-height:54px;padding:6px 52px 6px 0;font-size:40px;color:var(--cp-bg);align-items:center}
  .cp-menu .cp-sec .cp-sl span:first-child{flex:none}
  .cp-menu .cp-sec .cp-chev{display:none}
  .cp-menu .cp-sec.on .cp-sl{background:none;color:var(--cp-bg)}
  .cp-menu .cp-sec.here .cp-sl{color:#fff}
  .cp-menu .cp-count{display:block;margin-left:auto;font-style:normal;font-family:var(--sans);font-size:14.6px;font-weight:700;color:#fff;align-self:flex-end;padding-bottom:6px;white-space:nowrap}
  .cp-menu .cp-sec .cp-sl:first-child .cp-count:empty{display:none}
  .cp-menu .cp-sx{display:flex;position:absolute;right:-8px;top:5px;width:44px;height:44px;align-items:center;justify-content:center;background:none;border:0;color:var(--cp-bg);cursor:pointer}
  .cp-sx svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .18s ease}
  .cp-menu .cp-sec.exp .cp-sx svg{transform:rotate(180deg)}
  .cp-menu .cp-sub:not([hidden]){display:block;padding:4px 0 18px;color:#fff}
  .cp-menu .cp-sub .cp-hub{display:inline-block;color:#fff;margin:0 0 12px}
  .cp-menu .cp-sub .cp-col{margin:0 0 14px;gap:6px}
  .cp-menu .cp-sub .cp-k{color:#fff}
  .cp-menu .cp-sub .cp-col.cp-a a,.cp-menu .cp-sub .cp-chips a{font-size:21px;color:#fff}
  .cp-menu .cp-sub .cp-item{border-bottom-color:rgba(255,255,255,.3)}
  .cp-menu .cp-sub .cp-item .s{color:#fff;font-weight:700}
  .cp-menu .cp-sub .cp-wait{color:#fff}
  .cp-menu .cp-sub .cp-chips{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 16px}
  .cp-menu .cp-mnext{display:block;padding:0 16px;margin-top:54px;flex:none}
  .cp-mnext a{display:flex;gap:12px;align-items:baseline;background:var(--cp-bg);padding:12px 14px;color:var(--cp-ink)}
  .cp-mnext b{font-family:var(--sans);font-size:14.6px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--cp-redt);flex:none}
  .cp-mnext span{font-family:var(--serif);font-size:17px;line-height:1.3}
  .cp-menu .cp-msmall{display:flex;flex-wrap:wrap;gap:8px 18px;padding:0 16px;margin-top:55px;flex:none}
  .cp-msmall a{font-family:var(--sans);font-size:14.6px;font-weight:600;color:#fff}   /* black on red is 3.97:1, below 4.5 for small text; white is 4.96:1 */
  .cp-menu-open,.cp-menu-open body{overflow:hidden}
  .cp-menu :is(a,button,input):focus-visible{outline-color:#fff}
}

/* ------------------------------------------------------------ footer (JELSj) */
.cp-foot{position:relative;z-index:5;background:var(--cp-bg);color:var(--cp-ink);border-top:1px solid var(--cp-rule);overflow:hidden}
.cp-foot a{color:inherit;text-decoration:none}
.cp-foot :is(a,button,input):focus-visible{outline:2px solid var(--cp-redt);outline-offset:2px}
.cp-foot .cp-k{font-family:var(--sans);font-size:14.6px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--cp-dim)}
.cp-foot .cp-k.red{color:var(--cp-redt)}
.cp-tick{display:flex;align-items:center;gap:28px;padding:14px 32px;background:var(--cp-red);color:#fff;white-space:nowrap;overflow-x:auto;scrollbar-width:none}
.cp-tick::-webkit-scrollbar{display:none}
.cp-tick a{font-family:var(--sans);font-size:14.6px;font-weight:700;letter-spacing:.06em;line-height:1.1;flex:none}
.cp-tick a b{font-weight:700;text-transform:uppercase}
.cp-tick a:hover{text-decoration:underline;text-underline-offset:3px}
.cp-tick i{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,.6);flex:none}
.cp-tick:empty{display:none}
.cp-fmain{position:relative;display:grid;grid-template-columns:minmax(300px,460px) minmax(0,1fr);gap:64px;padding:64px 32px 48px}
.cp-wm{position:absolute;right:-290px;top:10px;font-family:"Shippori Mincho",var(--serif);font-size:360px;line-height:1;color:rgba(215,38,61,.12);pointer-events:none;user-select:none;white-space:nowrap;z-index:0}
.cp-letter,.cp-fcols{position:relative;z-index:1}
.cp-letter{display:flex;flex-direction:column;gap:16px;min-width:0}
.cp-letter h2{font-family:var(--serif);font-weight:400;font-size:44px;line-height:1.02;margin:0;color:var(--cp-ink)}
.cp-letter .lead{font-family:var(--serif);font-size:19px;line-height:1.4;color:var(--cp-dim);margin:0}
.cp-field{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--cp-ink);padding:10px 0}
.cp-field input{flex:1;min-width:0;background:none;border:0;outline:none;font-family:var(--serif);font-size:22px;color:var(--cp-ink);padding:4px 0}
.cp-field input::placeholder{font-style:italic;color:var(--cp-dim)}
.cp-field button{flex:none;background:var(--cp-red);color:#fff;border:0;font-family:var(--sans);font-size:15px;font-weight:700;padding:10px 18px;cursor:pointer}
.cp-field button:hover{background:#b81f33}
.cp-field:focus-within{border-bottom-color:var(--cp-redt)}
.cp-consent{display:flex;gap:10px;align-items:flex-start;font-family:var(--sans);font-size:14.6px;line-height:1.45;color:var(--cp-dim);cursor:pointer}
.cp-consent input{margin:3px 0 0;width:18px;height:18px;accent-color:var(--cp-red);flex:none}
.cp-consent a{color:var(--cp-ink);text-decoration:underline;text-underline-offset:2px}
.cp-fine{font-family:var(--sans);font-size:14.6px;line-height:1.45;color:var(--cp-dim);margin:0}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cp-fcols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px;align-content:start}
.cp-fcol{display:flex;flex-direction:column;gap:12px;min-width:0}
.cp-fcol a{font-family:var(--serif);font-size:21px;line-height:1.3;width:fit-content}
.cp-fcol a:hover{color:var(--cp-redt)}
.cp-fbot{display:flex;align-items:center;justify-content:space-between;gap:16px 32px;flex-wrap:nowrap;padding:20px 32px;border-top:1px solid var(--cp-rule);position:relative;z-index:1;background:var(--cp-bg)}
.cp-fbrand{display:flex;align-items:center;gap:12px;min-width:0;flex:none}
@media(max-width:1599px){.cp-fbrand .tag{display:none}}
.cp-flogo img{width:110px;height:auto;display:block}
.cp-fbrand .jp{font-family:"Shippori Mincho",var(--serif);font-size:15px;color:var(--cp-red);line-height:1;white-space:nowrap}
.cp-fbrand .tag{font-family:var(--sans);font-size:14.6px;color:var(--cp-dim)}
.cp-flinks{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px 22px;margin-left:auto}
.cp-flinks a,.cp-flinks span{font-family:var(--sans);font-size:14.6px;color:var(--cp-dim)}
.cp-flinks a:hover{color:var(--cp-ink)}
.cp-made a{color:var(--cp-ink)!important}
@media(max-width:1199px){
  .cp-fmain{grid-template-columns:minmax(0,1fr);gap:48px}
  .cp-fcols{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:900px){.cp-fcols{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}}
@media(max-width:1023px){.cp-fbot{flex-direction:column;align-items:flex-start;gap:10px}.cp-flinks{justify-content:flex-start;margin-left:0}}
/* mobile footer (bwRan) */
@media(max-width:767px){
  .cp-tick{padding:12px 16px;gap:18px}
  .cp-fmain{padding:32px 16px 24px;gap:24px}
  .cp-wm{font-size:200px;right:-200px;top:0}
  .cp-letter h2{font-size:30px}
  .cp-field{padding:8px 0}
  .cp-field input{font-size:19.5px}
  .cp-field button{padding:8px 14px}
  .cp-fcols{gap:24px}
  .cp-fcols .cp-k{display:none}
  .cp-fcol{gap:8px}
  .cp-fcol a{font-size:19.5px}
  .cp-fbot{flex-direction:column;align-items:flex-start;gap:8px;padding:16px 16px 24px}
  .cp-flinks{justify-content:flex-start;margin-left:0}
  .cp-flogo img{width:96px}
  .cp-fbrand .tag{display:none}
  .cp-flinks{gap:6px 14px}
}
@media(prefers-reduced-motion:reduce){.cp-menu,body>.cp-dim,.cp-sx svg{transition:none!important}.cp-menu{transform:none!important}}

/* the independence line (owner 2026-10-24), its own row above the brand bar */
.cp-indie{margin:0;padding:14px clamp(16px,4vw,56px) 0;font-size:14.6px;line-height:1.45;color:inherit;opacity:.75;max-width:900px}

/* Cinepuuulse home, the 2026-10-13 redesign (slice B). Pencil file cine.pen, frames jO1H7 (1440) and x2XM0G (390).
   Everything here is scoped to #cp-home, which cp-home.js builds only on the real home page; nothing else changes.
   Numbers come from the frames. Two kinds of deliberate difference:
   - type the frames set under the site's own floor (13 px and 11 px labels) is set at the floor, 14.6 px, because no
     size on this site may go below it, and existing sizes on the home (post heads 24 px, festival names 28 px) are
     never lowered on the phone either;
   - the frames' "faint" ink (30 %) fails 4.5:1 on #0B0B0C, so text uses 55 % ink, which passes. Rules stay at 12 %.
   The page is fluid: grids add columns as the screen grows and nothing is capped in a centred column. */

html.cp-home-on #home > :not(#cp-home) { display: none !important; }
#cp-home {
  --cp-bg: #0B0B0C; --cp-ink: #F2EFE9; --cp-red: #D7263D; --cp-redt: #FF4A5E;
  --cp-dim: rgba(242, 239, 233, .6); --cp-faint: rgba(242, 239, 233, .55); --cp-rule: rgba(255, 255, 255, .12);
  --cp-card: #1E1E21; --cp-board: #141416; --cp-pad: 32px; --cp-floor: 14.6px;
  display: block; width: 100%; margin: 0; padding-top: var(--cp-bar, 0px); background: var(--cp-bg); color: var(--cp-ink);
  font-family: var(--sans); overflow-x: clip;
}
#cp-home *, #cp-home *::before, #cp-home *::after { box-sizing: border-box; }
#cp-home a { color: inherit; text-decoration: none; }
#cp-home h2, #cp-home h3, #cp-home p, #cp-home ol, #cp-home ul { margin: 0; }
#cp-home ul, #cp-home ol { list-style: none; padding: 0; }
#cp-home button { font-family: var(--sans); color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
#cp-home a:focus-visible, #cp-home button:focus-visible { outline: 2px solid var(--cp-redt); outline-offset: 3px; }
#cp-home .cp-ar { width: 18px; height: 18px; flex: none; }
#cp-home img { display: block; background: transparent; }

/* ------------------------------------------------------------ shared: sections, heads, links, chips */
#cp-home > .cp-sec { padding: 88px var(--cp-pad); border-top: 1px solid var(--cp-rule); margin: 0; max-width: none; width: auto; background: none; }
#cp-home .cp-head, #cp-home #sound > .head, #cp-home #boxoffice > .head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; margin: 0 0 36px; padding: 0; border: 0; }
#cp-home .cp-titles { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
#cp-home .cp-h, #cp-home #sound > .head h2.h1, #cp-home #boxoffice > .head h2.h1 { font: 400 64px/1 var(--serif); letter-spacing: -.005em; color: var(--cp-ink); margin: 0; text-transform: none; }
#cp-home .cp-sub, #cp-home #sound > .head .sub, #cp-home #boxoffice > .head .sub { font: italic 400 24px/1.25 var(--serif); color: var(--cp-dim); margin: 0; letter-spacing: 0; text-transform: none; }
#cp-home .cp-link, #cp-home #bo-all { display: inline-flex; align-items: center; gap: 8px; font: 600 15px/1.2 var(--sans); color: var(--cp-ink); white-space: nowrap; letter-spacing: 0; text-transform: none; border: 0; }
#cp-home .cp-link:hover, #cp-home #bo-all:hover { color: var(--cp-redt); }
#cp-home .cp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
#cp-home .cp-chips button { font: 500 15px/1.2 var(--sans); padding: 8px 16px; border-radius: 999px; border: 1px solid var(--cp-rule); color: var(--cp-dim); background: transparent; white-space: nowrap; }
#cp-home .cp-chips button:hover { color: var(--cp-ink); border-color: var(--cp-faint); }
#cp-home .cp-chips button[aria-pressed="true"] { background: var(--cp-ink); color: var(--cp-bg); border-color: var(--cp-ink); }
#cp-home .cp-more-wrap { display: flex; justify-content: center; }
#cp-home .cp-more-wrap[hidden] { display: none; }
#cp-home .cp-more { display: inline-flex; align-items: center; gap: 10px; font: 600 15px/1.2 var(--sans); padding: 16px 32px; border-radius: 999px; border: 1px solid var(--cp-rule); }
#cp-home .cp-more:hover { border-color: var(--cp-ink); }
#cp-home .pic.noimg, #cp-home .thumb.failed .pic { background: radial-gradient(70% 70% at 30% 30%, #2A2A2E, var(--cp-card)); }
#cp-home .pic.noimg > span:not(.cp-pill), #cp-home .pic .cp-fb { position: absolute; left: 16px; bottom: 14px; right: 16px; font: italic 400 26px/1.1 var(--serif); color: var(--cp-dim); }
#cp-home .pic .cp-fb { display: none; }
#cp-home .pic.noimg .cp-fb { display: block; }
#cp-home .pic.noimg img { visibility: hidden; }

/* ------------------------------------------------------------ 1 · signal ribbon */
#cp-home .cp-ribbon { display: flex; align-items: center; gap: 12px 28px; flex-wrap: wrap; padding: 18px var(--cp-pad); background: var(--cp-red); color: #fff; }
#cp-home .cp-rk { font: 700 var(--cp-floor)/1.2 var(--sans); letter-spacing: 3px; text-transform: uppercase; }
#cp-home .cp-rs { font: italic 400 40px/1 var(--serif); color: #fff; }
#cp-home .cp-rt { font: 400 24px/1.2 var(--serif); color: #fff; flex: 1 1 320px; }
#cp-home .cp-ra { display: inline-flex; align-items: center; gap: 8px; font: 600 15px/1.2 var(--sans); color: #fff; margin-left: auto; }
#cp-home .cp-ra:hover, #cp-home .cp-rs:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ------------------------------------------------------------ 2 · double feature: the engine's #lead */
#cp-home #lead { padding: 6px 0 0; margin: 0; border: 0; background: none; position: static; min-height: 0; height: auto; overflow: visible; }
#cp-home #lead > :not(.lead-thumbs) { display: none !important; }
#cp-home #lead .lead-thumbs { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 0; height: auto; background: none; overflow: visible; inset: auto; }
#cp-home #lead .lead-thumbs::after { display: none; }
#cp-home #lead .thumb { position: relative; display: flex; flex-direction: column; justify-content: flex-end; height: clamp(560px, 50vw, 1100px); overflow: hidden; background: #1A1A1C; border-radius: 0; }
#cp-home #lead .thumb:nth-child(n+3) { display: none; }
#cp-home #lead .thumb .pic { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; margin: 0; background: #1A1A1C; overflow: hidden; border: 0; }
#cp-home #lead .thumb .pic::before { display: none; }
#cp-home #lead .thumb .pic img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 30%; filter: none; transform: none; }
#cp-home #lead .thumb .pic::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,11,12,.10) 0%, rgba(11,11,12,.35) 30%, rgba(11,11,12,.82) 58%, rgba(11,11,12,.97) 100%); z-index: 2; pointer-events: none; }
#cp-home #lead .thumb .pic > span { display: none; }
#cp-home #lead .thumb.weak .pic img { opacity: 1; }
#cp-home .cp-copy { position: relative; z-index: 3; display: flex; flex-direction: column; gap: 14px; padding: 32px 40px 40px 32px; }
#cp-home .cp-kick { font: 600 15px/1.2 var(--sans); letter-spacing: 1px; color: var(--cp-redt); }
#cp-home #lead .cp-kick { text-shadow: 0 1px 6px rgba(0,0,0,.85), 0 0 2px rgba(0,0,0,.7); }
#cp-home #lead .cp-copy h2 { font: 400 clamp(38px, 4.2vw, 60px)/1.02 var(--serif); color: var(--cp-ink); max-width: 18ch; position: static; text-shadow: 0 1px 14px rgba(0,0,0,.75), 0 0 3px rgba(0,0,0,.6); }
#cp-home .cp-dek { font: 400 22px/29px var(--serif); color: rgba(242,239,233,.72); max-width: 46ch; }
/* audit 2026-10-16: a long headline (Japanese wraps at ~10 characters a line at 60 px) climbed over the whole still.
   The frame (y1uQQR) carries at most three headline lines and one dek line over the lower gradient; the size stays,
   the line count is held instead. */
#cp-home #lead .cp-copy h2 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; overflow: hidden; }
#cp-home #lead .cp-dek { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
#cp-home .cp-credit { font: 400 var(--cp-floor)/1.2 var(--sans); color: var(--cp-faint); }
#cp-home #lead .thumb:hover h2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }

/* ------------------------------------------------------------ 3 · Now showing */
#cp-home #latest { padding: 72px var(--cp-pad) 80px; display: flex; flex-direction: column; gap: 40px; border-top: 0; }
#cp-home #latest > .head, #cp-home #load-more { display: none !important; }
#cp-home #latest .cp-head { margin: 0; }
#cp-home #empty { font: italic 400 24px/1.3 var(--serif); color: var(--cp-dim); }
#cp-home #posts { display: flex; flex-direction: column; gap: 40px; margin: 0; padding: 0; columns: auto; grid-template-columns: none; }
#cp-home .cp-top { display: grid; grid-template-columns: minmax(0, 2.03fr) minmax(0, 1fr); gap: 32px; }
#cp-home .cp-stack { display: flex; flex-direction: column; gap: 28px; }
#cp-home .cp-rows { display: grid; grid-template-columns: repeat(var(--cp-n, 4), minmax(0, 1fr)); gap: 40px 32px; }
#cp-home a.cp-card { display: flex; flex-direction: column; gap: 14px; padding: 0; margin: 0; border: 0; background: none; min-width: 0; break-inside: auto; }
#cp-home a.cp-card .pic { position: relative; width: 100%; aspect-ratio: 3 / 2; height: auto; margin: 0; overflow: hidden; background: var(--cp-card); border: 0; border-radius: 0; }
#cp-home .cp-top a.cp-card .pic { aspect-ratio: 16 / 9; }
#cp-home a.cp-card .pic img { width: 100%; height: 100%; object-fit: cover; }
#cp-home .cp-pill { position: absolute; top: 12px; left: 12px; z-index: 1; font: 600 var(--cp-floor)/1.2 var(--sans); padding: 5px 11px; border-radius: 999px; background: rgba(11,11,12,.8); color: var(--cp-ink); }
#cp-home a.cp-card h3 { font: 400 26px/28px var(--serif); color: var(--cp-ink); }
#cp-home a.cp-card .cp-desc { font: 400 17px/24px var(--serif); color: var(--cp-dim); }
#cp-home .cp-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font: 400 var(--cp-floor)/1.3 var(--sans); color: var(--cp-faint); }
#cp-home .cp-src { font-weight: 600; color: var(--cp-redt); }
#cp-home a.cp-card.cp-lead h3 { font-size: 48px; line-height: 52px; }
#cp-home a.cp-card.cp-lead .cp-desc { font-size: 21px; line-height: 29px; }
#cp-home .cp-stack a.cp-card h3 { font-size: 28px; line-height: 30px; }
#cp-home .cp-stack a.cp-card .cp-desc { font-size: 18px; line-height: 25px; }
#cp-home a.cp-card:hover h3, #cp-home .cp-feat:hover h3, #cp-home .cp-revlist a:hover h3, #cp-home .cp-side:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
#cp-home #latest .cp-more-wrap { justify-content: flex-start; }

/* ------------------------------------------------------------ 4 · Reviews */
#cp-home #discover > :not(.cp-head):not(.cp-rev) { display: none !important; }
#cp-home .cp-rev { display: grid; grid-template-columns: minmax(0, 1.34fr) minmax(0, 1fr); gap: 48px; align-items: start; }
#cp-home .cp-feat { display: flex; flex-direction: column; gap: 20px; }
#cp-home .cp-feat .pic { position: relative; aspect-ratio: 760 / 428; overflow: hidden; background: var(--cp-card); margin: 0; }
#cp-home .cp-feat .pic img { width: 100%; height: 100%; object-fit: cover; }
#cp-home .cp-feat .cp-kick { font: 700 var(--cp-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; }
#cp-home .cp-feat h3 { font: 400 48px/50px var(--serif); }
#cp-home .cp-feat .cp-desc { display: none; font: 400 17px/24px var(--serif); color: var(--cp-dim); }
#cp-home .cp-revlist li a { display: flex; flex-direction: column; gap: 8px; padding: 20px 0; border-bottom: 1px solid var(--cp-rule); }
#cp-home .cp-revlist li:first-child a { padding-top: 0; }
#cp-home .cp-revlist h3 { font: 400 28px/31px var(--serif); }
#cp-home .cp-src2 { font: 500 var(--cp-floor)/1.3 var(--sans); color: var(--cp-faint); }

/* ------------------------------------------------------------ 5 · Asia ⇄ World */
#cp-home #pairs > :not(.cp-head):not(.cp-pairs) { display: none !important; }
#cp-home .cp-pairs { display: flex; flex-direction: column; gap: 36px; }
#cp-home .cp-pair { display: grid; grid-template-columns: minmax(0, 1fr) 260px minmax(0, 1fr); align-items: start; padding-bottom: 28px; border-bottom: 1px solid var(--cp-rule); }
#cp-home .cp-side { display: flex; flex-direction: column; gap: 10px; }
#cp-home .cp-asia { text-align: right; align-items: flex-end; }
#cp-home .cp-tag { font: 700 var(--cp-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--cp-dim); }
#cp-home .cp-asia .cp-tag { color: var(--cp-redt); }
#cp-home .cp-side h3 { font: 400 30px/33px var(--serif); }
#cp-home .cp-sig { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; padding: 0 16px; }
#cp-home .cp-x { font: 400 56px/56px var(--serif); color: var(--cp-red); }
#cp-home .cp-theme { font: italic 400 22px/1.2 var(--serif); }

/* ------------------------------------------------------------ 7 · Festivals: the engine's #japan keeps its anchor, shows ours */
#cp-home #japan { padding-bottom: 96px; }
#cp-home #japan > :not(.cp-fest) { display: none !important; }
#cp-home .cp-fest .cp-head { margin-bottom: 20px; }
#cp-home .cp-fest .cp-sub { display: flex; gap: 14px; align-items: baseline; flex-wrap: wrap; }
#cp-home .cp-jp { font: 400 24px/1.2 "Shippori Mincho", var(--serif); font-style: normal; color: var(--cp-redt); }
#cp-home .cp-fest .cp-chips { padding-bottom: 24px; }
#cp-home .cp-cal { display: flex; flex-direction: column; }
#cp-home .cp-ev { display: grid; grid-template-columns: 230px minmax(0, 1fr) auto 140px 170px; gap: 32px; align-items: center; padding: 22px 20px; border-top: 1px solid var(--cp-rule); }
#cp-home .cp-ev:nth-child(even) { background: rgba(255, 255, 255, .03); }
#cp-home .cp-ev:hover .cp-n { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
#cp-home .cp-d { font: 600 17px/1.2 var(--sans); }
#cp-home .cp-n { font: 400 34px/36px var(--serif); }
#cp-home .cp-c, #cp-home .cp-st { font: 400 15px/1.3 var(--sans); color: var(--cp-dim); }
#cp-home .cp-st { text-align: right; }
#cp-home .cp-tagai { font: 600 var(--cp-floor)/1.2 var(--sans); padding: 5px 12px; border-radius: 999px; background: var(--cp-red); color: #fff; white-space: nowrap; }
#cp-home .cp-tagai.cp-none { visibility: hidden; padding: 0; }
#cp-home .cp-ev.cp-ai { background: rgba(215, 38, 61, .08); outline: 1px solid var(--cp-red); outline-offset: -1px; }
#cp-home .cp-ev.cp-ai .cp-d { color: var(--cp-redt); }
#cp-home .cp-ev.cp-ai .cp-n { font-style: italic; }
#cp-home .cp-fest .cp-more-wrap { justify-content: flex-start; padding-top: 28px; }
#cp-home .cp-empty { font: italic 400 22px/1.3 var(--serif); color: var(--cp-dim); padding: 22px 0; border-top: 1px solid var(--cp-rule); }

/* ------------------------------------------------------------ 8 · Latent Image */
#cp-home .cp-latent { display: flex; flex-direction: column; gap: 48px; padding-bottom: 96px; border-top-color: rgba(215, 38, 61, .35);
  background: linear-gradient(180deg, #0B0B0C 0%, #1C0709 35%, #120506 80%, #0B0B0C 100%); }
#cp-home .cp-lhead { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 32px; flex-wrap: wrap; }
#cp-home .cp-lhead .cp-titles { gap: 12px; max-width: 900px; }
#cp-home .cp-tag2 { display: flex; align-items: center; gap: 10px; font: 700 var(--cp-floor)/1.2 var(--sans); letter-spacing: 2.5px; text-transform: uppercase; color: var(--cp-redt); }
#cp-home .cp-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cp-red); flex: none; }
#cp-home .cp-lt { font: italic 400 112px/106px var(--serif); letter-spacing: -2px; color: var(--cp-ink); }
#cp-home .cp-ld { font: 400 28px/35px var(--serif); color: var(--cp-dim); }
#cp-home .cp-wall { display: grid; grid-template-columns: minmax(0, 2fr) repeat(3, minmax(0, 1fr)); gap: 24px; }
#cp-home .cp-poster { position: relative; display: flex; flex-direction: column; justify-content: space-between; aspect-ratio: 261 / 380; padding: 16px 16px 22px; overflow: hidden; color: #fff; isolation: isolate;
  background: radial-gradient(110% 75% at 50% 32%, #E0324A 0%, #B3182E 38%, #5C0F1B 72%, #2A0C10 100%); }
#cp-home .cp-poster::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .22; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
#cp-home .cp-poster::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(11,11,12,.6) 0%, rgba(11,11,12,0) 25%, rgba(11,11,12,0) 50%, rgba(11,11,12,.94) 100%); }
#cp-home .cp-poster.cp-big { grid-row: span 2; aspect-ratio: auto; padding: 30px 32px 38px; }
#cp-home .cp-ptop { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
#cp-home .cp-laurel { font: 700 var(--cp-floor)/18px var(--sans); letter-spacing: 1.2px; text-transform: uppercase; }
#cp-home .cp-run { font: 400 20px/20px var(--serif); white-space: nowrap; }
#cp-home .cp-bill { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
#cp-home .cp-pt { font: italic 400 34px/32px var(--serif); letter-spacing: -.5px; }
#cp-home .cp-by { font: 600 var(--cp-floor)/1.3 var(--sans); letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,.92); }
#cp-home .cp-rule { width: 32px; height: 1px; background: rgba(255,255,255,.5); }
#cp-home .cp-with { font: 400 var(--cp-floor)/1.3 var(--sans); color: rgba(255,255,255,.9); }
#cp-home .cp-big .cp-laurel { letter-spacing: 2.5px; }
#cp-home .cp-big .cp-run { font-size: 30px; line-height: 30px; }
#cp-home .cp-big .cp-bill { gap: 14px; }
#cp-home .cp-big .cp-pt { font-size: clamp(56px, 5.3vw, 104px); line-height: .95; letter-spacing: -1.5px; }
#cp-home .cp-big .cp-by { letter-spacing: 3px; }
#cp-home .cp-big .cp-rule { width: 60px; }
#cp-home .cp-poster:hover .cp-pt { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
#cp-home .cp-pager { display: none; }
#cp-home .cp-lower { display: grid; grid-template-columns: minmax(300px, 420px) minmax(0, 1fr) minmax(0, 1fr); gap: 56px; align-items: start; }
#cp-home .cp-next { display: flex; flex-direction: column; gap: 14px; padding: 28px; background: rgba(215, 38, 61, .08); outline: 1px solid rgba(215, 38, 61, .45); outline-offset: -1px; }
#cp-home .cp-lab { font: 700 var(--cp-floor)/1.2 var(--sans); letter-spacing: 2.5px; text-transform: uppercase; color: var(--cp-dim); }
#cp-home .cp-count { font: 400 72px/72px var(--serif); color: var(--cp-redt); }
#cp-home .cp-fest-n { font: 400 30px/1.15 var(--serif); }
#cp-home .cp-where { font: 400 15px/1.4 var(--sans); color: var(--cp-dim); }
#cp-home .cp-ch { font: 400 32px/32px var(--serif); padding-bottom: 14px; border-bottom: 1px solid var(--cp-red); }
#cp-home .cp-wi { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 18px; padding: 16px 0; border-bottom: 1px solid var(--cp-rule); }
#cp-home .cp-wi time { font: 600 var(--cp-floor)/1.5 var(--sans); color: var(--cp-redt); }
#cp-home .cp-wi span { display: flex; flex-direction: column; gap: 4px; }
#cp-home .cp-wi b { font: 400 21px/25px var(--serif); }
#cp-home .cp-wi small { font: 400 var(--cp-floor)/1.3 var(--sans); color: var(--cp-faint); }
#cp-home .cp-wi:hover b, #cp-home .cp-ru:hover .cp-rw { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
#cp-home .cp-ru { display: flex; flex-direction: column; gap: 6px; padding: 16px 0; border-bottom: 1px solid var(--cp-rule); }
#cp-home .cp-rl { display: flex; gap: 12px; align-items: baseline; flex-wrap: wrap; }
#cp-home .cp-rl time { font: 600 var(--cp-floor)/1.3 var(--sans); color: var(--cp-redt); }
#cp-home .cp-rl b { font: 600 15px/1.3 var(--sans); }
#cp-home .cp-rw { font: 400 20px/25px var(--serif); color: var(--cp-dim); }
#cp-home .cp-open { display: none; }

/* ------------------------------------------------------------ 9 · Screening room: record sleeves (the engine's buttons inside) */
#cp-home #sound { display: block; max-width: none; margin: 0; padding: 88px var(--cp-pad) !important; }
#cp-home #sound > .head { flex-direction: column; align-items: flex-start; gap: 10px; }
#cp-home #sound > .head .sub { font-style: italic; }
#cp-home #sound #band-now:empty { display: none; }
#cp-home #sound .moods { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; margin: 0; padding: 0; }
#cp-home #sound .mood-card { display: flex; flex-direction: column; gap: 16px; padding: 0; margin: 0; border: 0; background: none; min-width: 0; }
#cp-home .cp-sleeve { position: relative; aspect-ratio: 1; display: flex; flex-direction: column; justify-content: space-between; padding: 18px; overflow: hidden; color: #fff;
  background: linear-gradient(160deg, var(--g1, #3B1218) 11%, var(--g2, #0F0809) 89%); }
#cp-home .cp-sleeve::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.38) 0%, rgba(0,0,0,0) 38%, rgba(0,0,0,0) 52%, rgba(0,0,0,.5) 100%); pointer-events: none; }
#cp-home .cp-sidea { position: relative; display: flex; justify-content: space-between; font: 700 var(--cp-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; }
#cp-home .cp-play { position: absolute; top: 16px; right: 16px; width: 22px; height: 22px; }
#cp-home .cp-play svg { width: 100%; height: 100%; }
#cp-home .cp-mood { position: relative; font: italic 400 40px/38px var(--serif); }
#cp-home .cp-sleeve .embed-load { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; opacity: 1; cursor: pointer; }
#cp-home .cp-sleeve .embed-load > * { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#cp-home .cp-sleeve .embed-load:hover { background: rgba(255,255,255,.06); }
#cp-home .cp-sleeve .embed-load:focus-visible { outline: 2px solid #fff; outline-offset: -4px; }
#cp-home .cp-sleeve iframe { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; border: 0; background: #000; }
#cp-home .cp-sbody { display: flex; flex-direction: column; gap: 10px; }
#cp-home .cp-sbody h3 { font: 600 15px/1.3 var(--sans); }
#cp-home .cp-sbody p { font: 400 19px/25px var(--serif); color: var(--cp-dim); }
#cp-home .cp-sbody .one-open { font: 500 var(--cp-floor)/1.3 var(--sans); color: var(--cp-faint); }
#cp-home .cp-sbody .one-open:hover { color: var(--cp-ink); }
#cp-home .cp-consent { margin-top: 36px; font: 400 var(--cp-floor)/1.4 var(--sans); color: var(--cp-faint); }
#cp-home .cp-consent a { text-decoration: underline; text-underline-offset: 3px; }

/* ------------------------------------------------------------ 10 · Box office: five boards, equal height, places on shared rows */
#cp-home #boxoffice { display: block; max-width: none; margin: 0; }
#cp-home #boxoffice #bo-grid { display: none !important; }
#cp-home .cp-boards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; align-items: stretch; }
#cp-home .cp-bd { display: flex; flex-direction: column; gap: 14px; padding: 26px 24px 28px; background: var(--cp-board); border-top: 2px solid var(--cp-red); min-width: 0; }
#cp-home .cp-bd .cp-where { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
#cp-home .cp-reg { font: 700 var(--cp-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--cp-redt); }
#cp-home .cp-per { font: 400 var(--cp-floor)/1.2 var(--sans); color: var(--cp-faint); white-space: nowrap; }
#cp-home .cp-no1 { font: italic 400 22px/1.1 var(--serif); color: var(--cp-dim); }
#cp-home .cp-t1 { font: 400 34px/35px var(--serif); height: 70px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#cp-home .cp-t1.cp-dim { font-size: 22px; line-height: 1.3; color: var(--cp-dim); }
#cp-home .cp-g1 { font: 400 44px/44px var(--serif); color: var(--cp-redt); min-height: 44px; }
#cp-home .cp-chg { font: 700 var(--cp-floor)/1.2 var(--sans); color: var(--cp-faint); min-height: 18px; margin-top: -8px; }
#cp-home .cp-new { color: var(--cp-redt); text-transform: uppercase; }
#cp-home .cp-places { display: flex; flex-direction: column; margin-top: auto; }
#cp-home .cp-places li { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 10px; align-items: start; height: 56px; padding-top: 10px; border-top: 1px solid var(--cp-rule); }
#cp-home .cp-pn { font: 700 var(--cp-floor)/19px var(--sans); color: var(--cp-faint); }
#cp-home .cp-pt2 { font: 400 15px/19px var(--sans); overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
#cp-home .cp-pg { font: 400 15px/19px var(--sans); color: var(--cp-dim); white-space: nowrap; }
#cp-home .cp-nc .cp-pt2 { color: var(--cp-faint); }
#cp-home .cp-bd:hover .cp-t1 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
#cp-home #boxoffice .bo-note { margin-top: 36px; font: 400 var(--cp-floor)/1.4 var(--sans); color: var(--cp-faint); }

/* ------------------------------------------------------------ sources: kept on the home, as a quiet list at the end */
#cp-home #sources > .head h2.h1 { font: 400 40px/1.1 var(--serif); }
#cp-home #sources > .head .sub { font: italic 400 19.5px/1.3 var(--serif); color: var(--cp-dim); margin-top: 8px; }
#cp-home #sources > .head { margin-bottom: 24px; }
#cp-home #sources .sources { display: flex; flex-wrap: wrap; gap: 6px 18px; font: 400 15px/1.5 var(--sans); color: var(--cp-dim); columns: auto; }
#cp-home #sources .sources a:hover { color: var(--cp-ink); }
#cp-home #sources .sources .grey { color: var(--cp-faint); }
/* audit 2026-10-16: unlinked names took the engine's --ink-40, which is near-black in the light palette, so on this
   always-dark page they vanished and only their counts showed. */
#cp-home #sources .sources .nolink { color: var(--cp-faint); }

/* ------------------------------------------------------------ motion: only when the reader allows it */
@media (prefers-reduced-motion: no-preference) {
  #cp-home a.cp-card .pic img, #cp-home .cp-feat .pic img, #cp-home #lead .thumb .pic img { transition: transform .9s cubic-bezier(.2, .7, .2, 1); }
  #cp-home a.cp-card:hover .pic img, #cp-home .cp-feat:hover .pic img, #cp-home #lead .thumb:hover .pic img { transform: scale(1.035); }
  #cp-home .cp-poster, #cp-home .cp-sleeve { transition: transform .5s cubic-bezier(.2, .7, .2, 1); }
  #cp-home .cp-poster:hover, #cp-home .mood-card:hover .cp-sleeve { transform: translateY(-4px); }
}

/* ------------------------------------------------------------ wide screens: more room, not bigger margins */
@media (min-width: 1840px) {
  #cp-home { --cp-pad: 48px; }
  #cp-home .cp-lower { grid-template-columns: minmax(300px, 480px) minmax(0, 1fr) minmax(0, 1fr); }
}

/* ------------------------------------------------------------ up to 1199: rows that no longer fit swipe in place */
@media (max-width: 1199px) {
  #cp-home .cp-ev { grid-template-columns: 170px minmax(0, 1fr) auto 120px 150px; gap: 20px; }
  #cp-home .cp-boards { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(-1 * var(--cp-pad)); padding: 0 var(--cp-pad) 6px; scroll-padding: 0 var(--cp-pad); }
  #cp-home .cp-bd { flex: 0 0 280px; scroll-snap-align: start; }
  #cp-home #sound .moods { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(-1 * var(--cp-pad)); padding: 0 var(--cp-pad) 6px; scroll-padding: 0 var(--cp-pad); }
  #cp-home #sound .mood-card { flex: 0 0 220px; scroll-snap-align: start; }
  #cp-home .cp-wall { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 16px; margin: 0 calc(-1 * var(--cp-pad)); padding: 0 var(--cp-pad) 6px; scroll-padding: 0 var(--cp-pad); }
  #cp-home .cp-poster, #cp-home .cp-poster.cp-big { flex: 0 0 260px; aspect-ratio: 2 / 3; padding: 16px 16px 22px; scroll-snap-align: start; }
  #cp-home .cp-big .cp-pt { font-size: 34px; line-height: 32px; letter-spacing: -.5px; }
  #cp-home .cp-big .cp-run { font-size: 20px; line-height: 20px; }
  #cp-home .cp-big .cp-laurel { letter-spacing: 1.2px; }
  #cp-home .cp-big .cp-by { letter-spacing: 1.5px; }
  #cp-home .cp-big .cp-rule { width: 32px; }
  #cp-home .cp-pager { display: flex; gap: 6px; }
  #cp-home .cp-pager i { width: 6px; height: 6px; border-radius: 3px; background: var(--cp-faint); transition: width .2s; }
  #cp-home .cp-pager i.on { width: 18px; background: var(--cp-red); }
  #cp-home .cp-lower { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #cp-home .cp-next { grid-column: 1 / -1; }
}
@media (max-width: 1099px) {
  #cp-home .cp-rev { grid-template-columns: minmax(0, 1fr); }
  #cp-home .cp-pair { grid-template-columns: minmax(0, 1fr) 160px minmax(0, 1fr); }
  #cp-home .cp-top { grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); }
  #cp-home a.cp-card.cp-lead h3 { font-size: 40px; line-height: 44px; }
}
@media (max-width: 899px) {
  #cp-home .cp-ev { grid-template-columns: 150px minmax(0, 1fr) 130px; gap: 6px 20px; }
  #cp-home .cp-ev .cp-tagai.cp-none { display: none; }
  #cp-home .cp-ev .cp-c { display: none; }
  #cp-home .cp-ev.cp-ai { grid-template-columns: 150px minmax(0, 1fr) auto 130px; }
}

/* ------------------------------------------------------------ phones (frame x2XM0G, 390): one column; posters, sleeves and boards swipe */
@media (max-width: 767px) {
  #cp-home { --cp-pad: 16px; }
  #cp-home > .cp-sec { padding: 48px var(--cp-pad); }
  #cp-home .cp-head, #cp-home #sound > .head, #cp-home #boxoffice > .head { margin-bottom: 20px; gap: 12px; }
  #cp-home .cp-titles { gap: 6px; }
  #cp-home .cp-h, #cp-home #sound > .head h2.h1, #cp-home #boxoffice > .head h2.h1 { font-size: 44px; }
  #cp-home .cp-sub, #cp-home #sound > .head .sub, #cp-home #boxoffice > .head .sub { font-size: 18px; }
  #cp-home .cp-chips { flex-wrap: nowrap; overflow-x: auto; margin: 0 -16px; padding: 0 16px 2px; scrollbar-width: none; }
  #cp-home .cp-chips::-webkit-scrollbar { display: none; }
  #cp-home .cp-chips button { font-size: var(--cp-floor); padding: 8px 14px; }
  #cp-home .cp-more-wrap, #cp-home #latest .cp-more-wrap { justify-content: stretch; }
  #cp-home .cp-more { width: 100%; justify-content: center; padding: 14px 0; }

  #cp-home .cp-ribbon { flex-direction: column; align-items: flex-start; gap: 4px; padding: 14px 16px; }
  #cp-home .cp-rk { letter-spacing: 2.5px; }
  #cp-home .cp-rs { font-size: 32px; line-height: 32px; }
  #cp-home .cp-rt { font-size: 18px; flex: none; }
  #cp-home .cp-ra { margin: 6px 0 0; }

  #cp-home #lead { padding: 0; }
  #cp-home #lead .lead-thumbs { grid-template-columns: minmax(0, 1fr); gap: 3px; }
  #cp-home #lead .thumb { height: 440px; }
  #cp-home .cp-copy { gap: 10px; padding: 0 16px 22px; }
  #cp-home .cp-kick { font-size: var(--cp-floor); letter-spacing: 0; }
  #cp-home #lead .cp-copy h2 { font-size: 36px; line-height: 37px; }
  #cp-home #lead .cp-dek { display: none; }

  #cp-home #latest { padding: 48px var(--cp-pad); gap: 20px; border-top: 1px solid var(--cp-rule); }
  #cp-home #latest .cp-head { flex-direction: column; align-items: stretch; }
  #cp-home #posts { gap: 22px; }
  #cp-home .cp-top, #cp-home .cp-stack, #cp-home .cp-rows { display: flex; flex-direction: column; gap: 22px; }
  #cp-home a.cp-card { gap: 10px; padding-bottom: 22px; border-bottom: 1px solid var(--cp-rule); }
  #cp-home a.cp-card .pic, #cp-home .cp-top a.cp-card .pic { aspect-ratio: auto; height: 200px; }
  #cp-home a.cp-card.cp-lead .pic { height: 240px; }
  #cp-home .cp-pill { top: 10px; left: 10px; padding: 4px 10px; }
  #cp-home a.cp-card h3, #cp-home .cp-stack a.cp-card h3 { font-size: 24px; line-height: 26px; }
  #cp-home a.cp-card.cp-lead h3 { font-size: 30px; line-height: 32px; }
  #cp-home a.cp-card .cp-desc, #cp-home a.cp-card.cp-lead .cp-desc, #cp-home .cp-stack a.cp-card .cp-desc { font-size: 17px; line-height: 24px; }

  #cp-home .cp-rev { gap: 0; }
  #cp-home .cp-feat { gap: 10px; padding-bottom: 22px; border-bottom: 1px solid var(--cp-rule); }
  #cp-home .cp-feat .pic { aspect-ratio: auto; height: 240px; }
  #cp-home .cp-feat .cp-kick { letter-spacing: 1px; text-transform: none; font-weight: 600; }
  #cp-home .cp-feat h3 { font-size: 30px; line-height: 32px; }
  #cp-home .cp-feat .cp-desc { display: block; }
  #cp-home .cp-revlist li a, #cp-home .cp-revlist li:first-child a { padding: 16px 0; gap: 6px; }
  #cp-home .cp-revlist h3 { font-size: 24px; line-height: 26px; }

  #cp-home .cp-pairs { gap: 18px; }
  #cp-home .cp-pair { display: flex; flex-direction: column; gap: 10px; padding-bottom: 18px; }
  #cp-home .cp-sig { order: -1; flex-direction: row; align-items: baseline; gap: 8px; padding: 0; text-align: left; }
  #cp-home .cp-x { font-size: 26px; line-height: 1; }
  #cp-home .cp-theme { font-size: 20px; }
  #cp-home .cp-side, #cp-home .cp-asia { display: grid; grid-template-columns: 58px minmax(0, 1fr); gap: 2px 12px; text-align: left; align-items: baseline; }
  #cp-home .cp-side .cp-tag { grid-row: span 2; letter-spacing: 1.5px; }
  #cp-home .cp-side h3 { font-size: 24px; line-height: 27px; }

  #cp-home #japan { padding-bottom: 48px; }
  #cp-home .cp-fest .cp-sub { gap: 8px; }
  #cp-home .cp-jp { font-size: 18px; }
  #cp-home .cp-ev, #cp-home .cp-ev.cp-ai { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; padding: 16px 0; border-top: 0; border-bottom: 1px solid var(--cp-rule); }
  #cp-home .cp-ev:nth-child(even) { background: none; }
  #cp-home .cp-ev.cp-ai { padding: 14px; border-bottom: 0; background: rgba(215, 38, 61, .1); }
  #cp-home .cp-ev .cp-d { grid-row: 1; grid-column: 1; font-size: var(--cp-floor); }
  #cp-home .cp-ev .cp-st { grid-row: 1; grid-column: 2; font-size: var(--cp-floor); }
  #cp-home .cp-ev .cp-n { grid-row: 2; grid-column: 1 / -1; font-size: 28px; line-height: 29px; }
  #cp-home .cp-ev .cp-tagai, #cp-home .cp-ev .cp-c { display: none; }

  #cp-home .cp-latent { gap: 24px; padding: 48px 0; }
  #cp-home .cp-lhead, #cp-home .cp-lower, #cp-home .cp-pager, #cp-home .cp-open { margin: 0 16px; }
  #cp-home .cp-lhead .cp-link { display: none; }
  #cp-home .cp-tag2 { gap: 8px; }
  #cp-home .cp-dot { width: 7px; height: 7px; }
  #cp-home .cp-lt { font-size: 60px; line-height: 57px; letter-spacing: -1px; }
  #cp-home .cp-ld { font-size: 19px; line-height: 26px; }
  #cp-home .cp-wall { gap: 12px; margin: 0; padding: 0 16px 4px; scroll-padding: 0 16px; }
  #cp-home .cp-poster, #cp-home .cp-poster.cp-big { flex: 0 0 240px; aspect-ratio: auto; height: 360px; padding: 14px 14px 18px; }
  #cp-home .cp-lower { display: flex; flex-direction: column; gap: 24px; }
  #cp-home .cp-next { padding: 20px; gap: 8px; }
  #cp-home .cp-count { font-size: 48px; line-height: 48px; }
  #cp-home .cp-fest-n { font-size: 20px; }
  #cp-home .cp-ch { font-size: 28px; line-height: 28px; padding-bottom: 10px; }
  #cp-home .cp-wi { grid-template-columns: 52px minmax(0, 1fr); gap: 12px; padding: 14px 0; }
  #cp-home .cp-wi b { font-size: 20px; line-height: 24px; }
  #cp-home .cp-wi:nth-of-type(n+4) { display: none; }
  #cp-home .cp-rules { display: none; }
  #cp-home .cp-open { display: flex; justify-content: center; align-items: center; gap: 8px; padding: 16px 0; background: var(--cp-red); color: #fff; font: 600 15px/1.2 var(--sans); }

  #cp-home #sound { padding: 48px 0 !important; }
  #cp-home #sound > .head, #cp-home #sound .cp-consent { margin-left: 16px; margin-right: 16px; }
  #cp-home #sound .moods { margin: 0; padding: 0 16px 4px; gap: 12px; scroll-padding: 0 16px; }
  #cp-home #sound .mood-card { flex: 0 0 200px; gap: 10px; }
  #cp-home .cp-sleeve { padding: 16px; }
  #cp-home .cp-mood { font-size: 34px; line-height: 34px; }
  #cp-home .cp-sbody p { font-size: 17px; line-height: 23px; }
  #cp-home .cp-consent { margin-top: 18px; }

  #cp-home #boxoffice { padding: 48px 0; }
  #cp-home #boxoffice > .head, #cp-home #boxoffice .bo-note { margin-left: 16px; margin-right: 16px; }
  #cp-home #boxoffice > .head { flex-direction: column; align-items: flex-start; }
  #cp-home #boxoffice > .head > div { order: 0; }
  #cp-home .cp-boards { margin: 0; padding: 0 16px 4px; scroll-padding: 0 16px; }
  #cp-home .cp-bd { flex: 0 0 300px; padding: 20px; gap: 10px; }
  #cp-home .cp-no1 { font-size: 19.5px; }
  #cp-home .cp-t1 { font-size: 30px; line-height: 32px; height: 64px; }
  #cp-home .cp-g1 { font-size: 38px; line-height: 40px; min-height: 40px; }
  #cp-home .cp-chg { margin-top: -4px; }
  #cp-home #boxoffice .bo-note { margin-top: 18px; }

  #cp-home #sources { padding: 48px 16px; }
}

/* Cinepuuulse inner pages, slice C of the 2026-10-13 redesign: story, signal / source / week lists, archive, and the
   About, Legal and Support text pages. Pencil file cine.pen: etLso (story 1440), EpIqA (story 390), m5wxJr (lists),
   Y4YDt (archive), Y7SBuw (text pages). Loaded after cp-shell.css and cp-home.css; everything is scoped to a class that
   cp-pages-c.js puts on <html> only on the page type it rebuilt (html.cp-c-story, -list, -week, -archive, -text).
   Two kinds of deliberate difference from the frames, the same as slice B:
   - no size goes under the site's 14.6 px floor, and no size the engine already used on these pages is lowered
     (story head 64 px, excerpt 28 px, byline and crumbs 16.5 px, the source button 19.5 px, archive dates 19.5 px);
   - the frames' 30 % "faint" ink fails 4.5:1 on #0B0B0C, so text uses 55 % ink. Rules stay at 12 %.
   Fluid throughout: grids add columns as the screen grows and nothing is capped in a centred column. */

html.cp-c-on {
  --cpc-bg: #0B0B0C; --cpc-ink: #F2EFE9; --cpc-red: #D7263D; --cpc-redt: #FF4A5E;
  --cpc-dim: rgba(242, 239, 233, .6); --cpc-faint: rgba(242, 239, 233, .55); --cpc-rule: rgba(255, 255, 255, .12);
  --cpc-card: #1E1E21; --cpc-pad: 32px; --cpc-floor: 14.6px;
}
html.cp-c-on body { background: var(--cpc-bg); color: var(--cpc-ink); }
.cpc, .cpc *, .cpc *::before, .cpc *::after { box-sizing: border-box; }
.cpc { display: block; width: 100%; max-width: none; margin: 0; padding: var(--cp-bar, 64px) 0 0; background: var(--cpc-bg); color: var(--cpc-ink); font-family: var(--sans); text-align: left; overflow-x: clip; }
.cpc a { color: inherit; text-decoration: none; }
.cpc h1, .cpc h2, .cpc h3, .cpc p, .cpc figure, .cpc ul, .cpc ol { margin: 0; }
.cpc ul, .cpc ol { list-style: none; padding: 0; }
.cpc button { font-family: var(--sans); color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
.cpc :is(a, button):focus-visible { outline: 2px solid var(--cpc-redt); outline-offset: 3px; }
.cpc img { display: block; }
.cpc .cp-ar { width: 18px; height: 18px; flex: none; }
html.cp-c-on .cpc .cp-k { margin: 0; font: 700 var(--cpc-floor)/1.2 var(--sans); letter-spacing: 2.5px; text-transform: uppercase; color: var(--cpc-dim); }
/* the engine's own page box: the rebuilt page brings its own padding */
html.cp-c-on main.single#single.cp-c-main { max-width: none; width: 100%; margin: 0; padding: 0; background: var(--cpc-bg); }

/* ------------------------------------------------------------ cards: the home's picture-and-description card */
.cpc .cp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 40px 32px; }
.cpc a.cp-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.cpc a.cp-card .pic { position: relative; width: 100%; aspect-ratio: 3 / 2; overflow: hidden; background: var(--cpc-card); }
.cpc a.cp-card .pic img { width: 100%; height: 100%; object-fit: cover; }
.cpc .pic.noimg { background: radial-gradient(70% 70% at 30% 30%, #2A2A2E, var(--cpc-card)); }
.cpc .pic.noimg img { visibility: hidden; }
html.cp-c-on .cpc .pic .cp-fb { padding: 0; text-align: left; display: none; position: absolute; left: 16px; right: 16px; bottom: 14px; font: italic 400 26px/1.1 var(--serif); color: var(--cpc-dim); }
html.cp-c-on .cpc .pic.noimg .cp-fb { display: block; }
html.cp-c-on .cpc .pic .cp-pill { text-align: left; position: absolute; top: 14px; left: 14px; z-index: 1; font: 600 var(--cpc-floor)/1.2 var(--sans); padding: 5px 11px; border-radius: 999px; background: rgba(11, 11, 12, .8); color: var(--cpc-ink); }
.cpc a.cp-card h3 { font: 400 26px/1.08 var(--serif); color: var(--cpc-ink); overflow-wrap: anywhere; }
.cpc a.cp-card .cp-desc { font: 400 17px/1.4 var(--serif); color: var(--cpc-dim); overflow-wrap: anywhere; }
.cpc .cp-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font: 400 var(--cpc-floor)/1.3 var(--sans); color: var(--cpc-faint); }
.cpc .cp-src { font-weight: 600; color: var(--cpc-redt); }
.cpc a.cp-card:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
@media (prefers-reduced-motion: no-preference) {
  .cpc a.cp-card .pic img { transition: transform .9s cubic-bezier(.2, .7, .2, 1); }
  .cpc a.cp-card:hover .pic img { transform: scale(1.035); }
}

/* ------------------------------------------------------------ story (etLso, EpIqA) */
.cpc-story .cp-st-head { display: flex; flex-direction: column; gap: 24px; padding: 56px var(--cpc-pad) 40px; }
.cpc-story .cp-crumbs { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font: 400 16.5px/1.2 var(--sans); color: var(--cpc-dim); }
.cpc-story .cp-crumbs i { font-style: normal; color: var(--cpc-faint); }
.cpc-story .cp-crumbs a:hover { color: var(--cpc-ink); }
.cpc-story .cp-crumbs .red { color: var(--cpc-redt); font-weight: 600; }
.cpc-story .cp-crumbs .red:hover { color: var(--cpc-redt); text-decoration: underline; text-underline-offset: 3px; }
.cpc-story h1.cp-st-h { font: 400 clamp(64px, calc(18px + 4.3vw), 80px)/1 var(--serif); letter-spacing: -.005em; color: var(--cpc-ink); max-width: 1180px; overflow-wrap: anywhere; }
.cpc-story .cp-by { display: flex; flex-wrap: wrap; gap: 6px 16px; font: 400 16.5px/1.2 var(--sans); color: var(--cpc-dim); }
.cpc-story .cp-by .cp-bysrc { font-weight: 700; color: var(--cpc-redt); }
.cpc-story .cp-by a.cp-bysrc:hover { text-decoration: underline; text-underline-offset: 3px; }
.cpc-story .cp-by .lg { color: var(--cpc-faint); }
.cpc-story .cp-st-pic { padding: 0 var(--cpc-pad); display: flex; flex-direction: column; gap: 10px; }
.cpc-story .cp-st-pic .pic { position: relative; width: 100%; aspect-ratio: 1376 / 720; max-height: 82vh; overflow: hidden; background: var(--cpc-card); }
.cpc-story .cp-st-pic .pic img { width: 100%; height: 100%; object-fit: cover; }
.cpc-story .cp-st-pic figcaption { font: 400 var(--cpc-floor)/1.2 var(--sans); color: var(--cpc-faint); }
.cpc-story .cp-st-pic.cp-gone { display: none; }
.cpc-story .cp-st-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(280px, 380px); gap: 80px; padding: 56px var(--cpc-pad) 80px; }
.cpc-story .cp-st-main { display: flex; flex-direction: column; gap: 28px; min-width: 0; }
.cpc-story .cp-st-ex { font: 400 30px/1.35 var(--serif); color: var(--cpc-ink); overflow-wrap: anywhere; max-width: 36em; }
.cpc-story .cp-st-ex.cp-fallback { color: var(--cpc-dim); }
.cpc-story .cp-st-note { font: 400 15px/1.4 var(--sans); color: var(--cpc-faint); }
.cpc-story .cp-st-main .ja-orig { margin: 0; font: 400 19.5px/1.4 var(--serif); color: var(--cpc-dim); }
.cpc-story .cp-st-main .ja-orig .grey { font-family: var(--sans); font-size: var(--cpc-floor); color: var(--cpc-faint); }
.cpc-story .cp-st-main .also { margin: 0; font: 400 15px/1.5 var(--sans); color: var(--cpc-faint); }
.cpc-story .cp-st-main .also a { color: var(--cpc-ink); text-decoration: underline; text-underline-offset: 2px; text-decoration-color: var(--cpc-rule); }
.cpc-story .cp-go { align-self: flex-start; display: inline-flex; align-items: center; gap: 0; white-space: pre-wrap; padding: 18px 28px; background: var(--cpc-red); color: #fff; font: 600 19.5px/1.2 var(--sans); }
.cpc-story .cp-go svg { margin-left: 12px; width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cpc-story .cp-go:hover { background: #b81f33; }
.cpc-story .cp-go:focus-visible { outline-color: #fff; outline-offset: -5px; }
.cpc-story .cp-share { display: flex; align-items: center; gap: 20px; padding-top: 20px; border-top: 1px solid var(--cpc-rule); font: 400 15px/1.2 var(--sans); color: var(--cpc-dim); }
.cpc-story .cp-share :is(a, button) { display: inline-flex; width: 28px; height: 28px; align-items: center; justify-content: center; color: var(--cpc-dim); }
.cpc-story .cp-share :is(a, button):hover { color: var(--cpc-ink); }
.cpc-story .cp-share svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.cpc-story .cp-share .cp-said { font-size: var(--cpc-floor); color: var(--cpc-ink); }
.cpc-story .cp-st-side { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.cpc-story .cp-st-side section { display: flex; flex-direction: column; gap: 14px; padding-bottom: 24px; border-bottom: 1px solid var(--cpc-rule); }
.cpc-story .cp-pills { display: flex; flex-wrap: wrap; gap: 8px; }
.cpc-story .cp-pills a { font: 500 var(--cpc-floor)/1.2 var(--sans); padding: 6px 12px; border: 1px solid var(--cpc-rule); border-radius: 999px; color: var(--cpc-ink); }
.cpc-story .cp-pills a.tag { color: var(--cpc-dim); }
.cpc-story .cp-pills a:hover { border-color: var(--cpc-ink); }
.cpc-story .cp-reg { font: 400 28px/1.25 var(--serif); color: var(--cpc-ink); }
.cpc-story .cp-from { display: flex; flex-direction: column; gap: 14px; }
.cpc-story .cp-from a { font: 400 22px/1.15 var(--serif); color: var(--cpc-ink); overflow-wrap: anywhere; }
.cpc-story .cp-from a:hover { color: var(--cpc-redt); }
.cpc-story .cp-all { display: inline-flex; align-items: center; gap: 8px; font: 600 15px/1.2 var(--sans); color: var(--cpc-ink); white-space: nowrap; }
.cpc-story .cp-all:hover { color: var(--cpc-redt); }
.cpc-story .cp-st-more { padding: 72px var(--cpc-pad) 88px; border-top: 1px solid var(--cpc-rule); display: flex; flex-direction: column; gap: 28px; }
.cpc-story .cp-st-mh { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px 32px; flex-wrap: wrap; }
.cpc-story .cp-st-mh h2 { font: 400 56px/1.1 var(--serif); color: var(--cpc-ink); }
.cpc-story .cp-st-more a.cp-card h3 { font-size: 26px; }   /* the engine's related heads were 24 px: never smaller */

/* ------------------------------------------------------------ lists: signal, source, week (m5wxJr) */
html.cp-c-list #home > :not(#cp-list) { display: none !important; }
html.cp-c-list #home { padding: 0; margin: 0; max-width: none; }
.cpc-list .cp-lh { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px 56px; flex-wrap: wrap; padding: 56px var(--cpc-pad) 40px; background: var(--cpc-red); color: #fff; }
.cpc-list .cp-lt { display: flex; flex-direction: column; gap: 14px; min-width: 0; flex: 1 1 560px; }
.cpc-list .cp-lk { font: 700 var(--cpc-floor)/1.2 var(--sans); letter-spacing: 3px; text-transform: uppercase; color: #fff; }
.cpc-list h1.cp-ln { font: italic 400 clamp(72px, calc(24px + 8.4vw), 144px)/.95 var(--serif); letter-spacing: -2px; color: #fff; overflow-wrap: anywhere; padding-bottom: .06em; }
.cpc-list .cp-ld { font: 400 26px/1.3 var(--serif); color: rgba(255, 255, 255, .9); max-width: 700px; }
.cpc-list .cp-ld .by { font-style: italic; }
.cpc-list .cp-stats { display: flex; gap: 48px; flex: none; }
.cpc-list .cp-stat { display: flex; flex-direction: column; gap: 4px; }
.cpc-list .cp-stat b { font: 400 96px/.9 var(--serif); color: #fff; }
.cpc-list .cp-stat span { font: 700 var(--cpc-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: #fff; }
.cpc-list .cp-lf { display: flex; justify-content: space-between; align-items: center; gap: 12px 32px; flex-wrap: wrap; padding: 14px var(--cpc-pad); border-bottom: 1px solid var(--cpc-rule); }
.cpc-list .cp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.cpc-list .cp-chips button { font: 500 15px/1.2 var(--sans); padding: 8px 16px; border-radius: 999px; border: 1px solid var(--cpc-rule); color: var(--cpc-dim); white-space: nowrap; }
.cpc-list .cp-chips button:hover { color: var(--cpc-ink); border-color: var(--cpc-faint); }
.cpc-list .cp-chips button[aria-pressed="true"] { background: var(--cpc-ink); border-color: var(--cpc-ink); color: var(--cpc-bg); }
.cpc-list .cp-other { font: 400 15px/1.5 var(--sans); color: var(--cpc-dim); }
.cpc-list .cp-other a:hover { color: var(--cpc-ink); text-decoration: underline; text-underline-offset: 3px; }
.cpc-list .cp-lb { display: flex; flex-direction: column; gap: 40px; padding: 40px var(--cpc-pad) 80px; }
.cpc-list .cp-more-wrap { display: flex; justify-content: center; }
.cpc-list .cp-more-wrap[hidden] { display: none; }
.cpc-list .cp-more { font: 600 15px/1.2 var(--sans); padding: 16px 32px; border-radius: 999px; border: 1px solid var(--cpc-ink); }
.cpc-list .cp-more:hover { background: var(--cpc-ink); color: var(--cpc-bg); }
.cpc-list .cp-empty { font: italic 400 24px/1.3 var(--serif); color: var(--cpc-dim); }
/* week extras: the frozen radar and the poster, kept from the engine's week page */
.cpc-list .cp-wsec { display: flex; flex-direction: column; gap: 20px; padding-top: 48px; border-top: 1px solid var(--cpc-rule); }
.cpc-list .cp-wsec h2 { font: 400 40px/1.1 var(--serif); color: var(--cpc-ink); }
.cpc-list .cp-wsec h2 .grey { font: 400 var(--cpc-floor)/1 var(--sans); color: var(--cpc-faint); margin-left: 8px; }
.cpc-list .cp-radar { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 0 40px; }
.cpc-list .cp-radar a { display: grid; grid-template-columns: minmax(0, 1fr) 120px 72px; align-items: center; gap: 14px; padding: 12px 0; border-bottom: 1px solid var(--cpc-rule); }
.cpc-list .cp-radar .n { font: 400 22px/1.2 var(--serif); color: var(--cpc-ink); overflow-wrap: anywhere; }
.cpc-list .cp-radar a:hover .n { color: var(--cpc-redt); }
.cpc-list .cp-radar .v { font: 600 15px/1.2 var(--sans); color: var(--cpc-dim); text-align: right; white-space: nowrap; }
.cpc-list .cp-poster { display: flex; gap: 32px; align-items: flex-start; flex-wrap: wrap; }
.cpc-list .cp-poster img { width: 180px; height: auto; border: 1px solid var(--cpc-rule); }
.cpc-list .cp-poster p { font: 400 19.5px/1.45 var(--serif); color: var(--cpc-dim); max-width: 42em; margin: 0 0 16px; }
.cpc-list .cp-poster .cp-dl { display: inline-flex; gap: 10px; align-items: center; font: 600 15px/1.2 var(--sans); padding: 14px 24px; border: 1px solid var(--cpc-ink); border-radius: 999px; }
.cpc-list .cp-poster .cp-dl:hover { background: var(--cpc-ink); color: var(--cpc-bg); }

/* bars, shared by the archive and the week's radar */
.cpc .cp-track { position: relative; height: 16px; background: rgba(242, 239, 233, .05); }
.cpc .cp-track i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--cpc-red); }

/* ------------------------------------------------------------ archive (Y4YDt) */
.cpc-archive .cp-ah { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 64px; flex-wrap: wrap; padding: 56px var(--cpc-pad) 40px; border-bottom: 1px solid var(--cpc-rule); }
.cpc-archive h1.cp-an { font: 400 clamp(72px, calc(24px + 7vw), 128px)/.92 var(--serif); letter-spacing: -2px; color: var(--cpc-ink); }
.cpc-archive .cp-ad { font: 400 24px/1.3 var(--serif); color: var(--cpc-dim); max-width: 520px; }
.cpc-archive .cp-weeks { padding: 8px var(--cpc-pad) 80px; }
.cpc-archive a.cp-wk { display: grid; grid-template-columns: minmax(200px, 260px) minmax(0, 1fr) minmax(220px, 360px) 24px; align-items: center; gap: 40px; padding: 26px 0; border-bottom: 1px solid var(--cpc-rule); }
.cpc-archive .cp-when { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cpc-archive .cp-when b { font: 400 40px/1 var(--serif); color: var(--cpc-ink); }
.cpc-archive .cp-when span { font: 400 19.5px/1.2 var(--serif); color: var(--cpc-dim); }
.cpc-archive .cp-when span.now { color: var(--cpc-redt); }
.cpc-archive .cp-sig { display: flex; flex-direction: column; align-items: flex-start; text-align: left; gap: 6px; min-width: 0; }
.cpc-archive .cp-sig em { font: italic 400 34px/1.2 var(--serif); color: var(--cpc-ink); overflow-wrap: anywhere; }
.cpc-archive .cp-sig .cp-note { font: 400 19.5px/1.4 var(--serif); color: var(--cpc-dim); }
.cpc-archive .cp-men { display: grid; grid-template-columns: minmax(80px, 240px) auto; align-items: center; gap: 14px; }
.cpc-archive .cp-men span { font: 600 15px/1.2 var(--sans); color: var(--cpc-dim); white-space: nowrap; }
.cpc-archive .cp-go-i { width: 24px; height: 24px; color: var(--cpc-dim); }
.cpc-archive a.cp-wk:hover .cp-sig em, .cpc-archive a.cp-wk:hover .cp-when b { color: var(--cpc-redt); }
.cpc-archive a.cp-wk:hover .cp-go-i { color: var(--cpc-ink); }
@media (prefers-reduced-motion: no-preference) { .cpc-archive a.cp-wk .cp-go-i { transition: transform .2s ease; } .cpc-archive a.cp-wk:hover .cp-go-i { transform: translateX(4px); } }
/* the engine's hanko wall stays, under the weeks */
.cpc-archive #hanko { margin: 0; padding: 48px var(--cpc-pad) 80px; border-top: 1px solid var(--cpc-rule); }
.cpc-archive #hanko h2.t { font: 400 40px/1.1 var(--serif); color: var(--cpc-ink); margin: 0 0 20px; }
.cpc-archive #hanko .hanko-wall .h { color: var(--cpc-dim); font-family: var(--sans); }
.cpc-archive #hanko h2.t .grey { font: 400 var(--cpc-floor)/1 var(--sans); color: var(--cpc-faint); }

/* ------------------------------------------------------------ text pages: About, Legal & credits, Support (Y7SBuw) */
.cpc-text { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 96px; padding: calc(var(--cp-bar, 64px) + 72px) var(--cpc-pad) 96px; }
.cpc-text .cp-tnav { position: sticky; top: calc(var(--cp-bar, 64px) + 32px); align-self: start; display: flex; flex-direction: column; gap: 16px; }
.cpc-text .cp-tnav a { font: 400 28px/1.3 var(--serif); color: var(--cpc-dim); width: fit-content; }
.cpc-text .cp-tnav a:hover { color: var(--cpc-ink); }
.cpc-text .cp-tnav a[aria-current="page"] { font-style: italic; color: var(--cpc-ink); }
.cpc-text .cp-tbody { min-width: 0; display: flex; flex-direction: column; gap: 30px; }
.cpc-text .cp-tbody > * { margin: 0; }
.cpc-text h1.story { font: 400 104px/.95 var(--serif) !important; letter-spacing: -1.5px; color: var(--cpc-ink); margin: 0 !important; overflow-wrap: anywhere; }
.cpc-text :is(.summary, .about-text > h2:first-child) { font: 400 32px/1.35 var(--serif) !important; color: var(--cpc-ink); max-width: 36em; margin: 0 !important; letter-spacing: 0; }
.cpc-text .about-text h2:first-child em { font-style: italic; }
.cpc-text :is(.about-text, .legal-text) { display: flex; flex-direction: column; gap: 30px; max-width: none; columns: auto; }
.cpc-text :is(.about-text, .legal-text) > *, .cpc-text .lsec > * { margin: 0; }
.cpc-text :is(.about-text, .legal-text, .lsec) p { font: 400 24px/1.55 var(--serif); color: var(--cpc-dim); max-width: 42em; margin: 0; }
.cpc-text :is(.about-text, .legal-text, .lsec) p b { font-weight: 400; color: var(--cpc-ink); }
.cpc-text :is(.about-text, .legal-text, .lsec) p a { color: var(--cpc-ink); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; text-decoration-color: rgba(242, 239, 233, .4); }
.cpc-text :is(.about-text, .legal-text, .lsec) p a:hover { color: var(--cpc-redt); text-decoration-color: currentColor; }
.cpc-text .about-text p.cp-sign { font: italic 400 26px/1.3 var(--serif); color: var(--cpc-redt); }
.cpc-text .about-text h2#contact, .cpc-text .about-text h2:not(:first-child) { font: 700 var(--cpc-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--cpc-dim); padding-top: 28px; border-top: 1px solid var(--cpc-rule); margin-bottom: -18px; }
/* Sending us news? (the engine's .about-partners, after the contact): a ruled block like Contact, the link in red */
.cpc-text .about-text .about-partners { display: flex; flex-direction: column; gap: 14px; padding-top: 28px; border-top: 1px solid var(--cpc-rule); }
.cpc-text .about-text .about-partners h2 { margin: 0; font: 700 var(--cpc-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--cpc-dim); }
.cpc-text .about-text .about-partners .about-partners-go a { color: var(--cpc-redt); text-decoration-color: currentColor; }
.cpc-text .about-text .about-partners .about-partners-go a:hover { color: var(--cpc-ink); }
.cpc-text .about-text .about-partners a:focus-visible { outline: 2px solid var(--cpc-redt); outline-offset: 3px; }
.cpc-text .legal-grid { display: block; }
.cpc-text .legal-art:empty, .cpc-text .legal-art:not(:has(img)) { display: none; }
.cpc-text .lsec { display: flex; flex-direction: column; gap: 18px; padding-top: 28px; border-top: 1px solid var(--cpc-rule); scroll-margin-top: calc(var(--cp-bar, 64px) + 24px); }
.cpc-text .lsec h2 { font: 400 34px/1.15 var(--serif); color: var(--cpc-ink); }
.cpc-text .lsec p.grey { color: var(--cpc-faint); }
.cpc-text .sup-addr { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.cpc-text .sup-addr code { font-family: var(--mono, ui-monospace, monospace); font-size: 16.5px; word-break: break-all; padding: 10px 14px; border: 1px solid var(--cpc-rule); background: #141416; color: var(--cpc-ink); }
.cpc-text .sup-addr button { text-transform: none; letter-spacing: 0; font: 600 15px/1.2 var(--sans); padding: 12px 22px; border: 0; border-radius: 0; background: var(--cpc-red); color: #fff; cursor: pointer; }
.cpc-text .sup-addr button:hover { background: #b81f33; }
.cpc-text .sup-addr button:focus-visible { outline: 2px solid var(--cpc-redt); outline-offset: 3px; }
.cpc-text .sup-qr { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.cpc-text .sup-qr img { background: #fff; padding: 10px; width: 180px; height: auto; }
.cpc-text .sup-qr p { font-size: 19.5px !important; }

/* ------------------------------------------------------------ fluid steps */
@media (max-width: 1199px) {
  .cpc-story .cp-st-body { gap: 56px; grid-template-columns: minmax(0, 1fr) minmax(260px, 320px); }
  .cpc-archive a.cp-wk { grid-template-columns: minmax(170px, 210px) minmax(0, 1fr) minmax(180px, 260px) 24px; gap: 28px; }
  .cpc-text { grid-template-columns: 220px minmax(0, 1fr); gap: 56px; }
  .cpc-text h1.story { font-size: 88px !important; }
}
@media (max-width: 1023px) {
  .cpc-story .cp-st-body { grid-template-columns: minmax(0, 1fr); gap: 48px; }
  .cpc-story .cp-st-side { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px 40px; }
  .cpc-list .cp-stats { gap: 36px; }
  .cpc-list .cp-stat b { font-size: 80px; }
  .cpc-archive a.cp-wk { grid-template-columns: minmax(150px, 190px) minmax(0, 1fr) 24px; }
  .cpc-archive .cp-men { grid-column: 2; grid-row: 2; }
  .cpc-archive .cp-go-i { grid-column: 3; grid-row: 1 / span 2; }
}
@media (max-width: 960px) {
  .cpc-story .cp-st-ex { font-size: 26px; }   /* the engine's excerpt was 22 px here */
}
@media (max-width: 899px) {
  .cpc-text { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .cpc-text .cp-tnav { position: static; flex-direction: row; flex-wrap: wrap; gap: 6px 22px; }
  .cpc-text .cp-tnav .cp-k { width: 100%; }
  .cpc-text .cp-tnav a { font-size: 24px; }
  .cpc-text h1.story { font-size: 72px !important; }
}

/* ------------------------------------------------------------ phone (EpIqA and the same rhythm elsewhere) */
@media (max-width: 767px) {
  html.cp-c-on { --cpc-pad: 16px; }
  .cpc-story .cp-st-head { gap: 14px; padding: 28px var(--cpc-pad) 20px; }
  .cpc-story .cp-crumbs { font-weight: 600; color: var(--cpc-redt); gap: 4px 6px; }
  .cpc-story .cp-crumbs .cp-c-now, .cpc-story .cp-crumbs .cp-c-now + i { display: none; }
  .cpc-story .cp-crumbs i { color: var(--cpc-redt); }
  .cpc-story .cp-crumbs a:hover { color: var(--cpc-ink); }
  .cpc-story .cp-by { gap: 4px 10px; }
  .cpc-story .cp-by .lg { display: none; }
  .cpc-story .cp-st-pic { padding: 0; }
  .cpc-story .cp-st-pic .pic { aspect-ratio: 3 / 2; max-height: none; }
  .cpc-story .cp-st-pic figcaption { padding: 0 var(--cpc-pad); }
  .cpc-story .cp-st-body { padding: 24px var(--cpc-pad) 32px; gap: 20px; }
  .cpc-story .cp-st-main { gap: 20px; }
  .cpc-story .cp-st-ex { font-size: 22px; line-height: 1.4; }
  .cpc-story .cp-st-note { display: none; }
  .cpc-story .cp-go .cp-long { display: none; }
  .cpc-story .cp-go { align-self: stretch; justify-content: center; padding: 16px 20px; }
  .cpc-story .cp-st-side { display: flex; gap: 20px; }
  .cpc-story .cp-st-side section { padding-bottom: 0; border: 0; }
  .cpc-story .cp-st-side .cp-k { display: none; }
  .cpc-story .cp-st-side .cp-s-reg, .cpc-story .cp-st-side .cp-s-from { display: none; }
  .cpc-story .cp-st-more { padding: 32px var(--cpc-pad) 40px; gap: 16px; }
  .cpc-story .cp-st-mh h2 { font-size: 32px; }
  .cpc-story .cp-st-more .cp-grid { display: flex; flex-direction: column; gap: 16px; }
  .cpc-story .cp-st-more a.cp-card { display: grid; grid-template-columns: 110px minmax(0, 1fr); grid-template-rows: auto 1fr; gap: 6px 14px; padding-bottom: 16px; border-bottom: 1px solid var(--cpc-rule); }
  .cpc-story .cp-st-more a.cp-card .pic { grid-row: 1 / span 2; aspect-ratio: auto; height: 80px; }
  .cpc-story .cp-st-more a.cp-card .cp-pill, .cpc-story .cp-st-more a.cp-card .cp-desc, .cpc-story .cp-st-more a.cp-card .cp-fb, .cpc-story .cp-st-more a.cp-card time { display: none; }
  .cpc-story .cp-st-more a.cp-card h3 { font-size: 24px; line-height: 1.12; }   /* the frame sets 19 px; the engine's related heads were 24 */
  .cpc-story .cp-st-more a.cp-card .cp-meta { align-self: start; }

  .cpc-list .cp-lh { padding: 32px var(--cpc-pad) 28px; gap: 24px; }
  .cpc-list .cp-lt { flex-basis: 100%; }
  .cpc-list h1.cp-ln { font-size: 72px; letter-spacing: -1px; }
  .cpc-list .cp-ld { font-size: 20px; }
  .cpc-list .cp-stats { gap: 24px; flex: 1 1 100%; }
  .cpc-list .cp-stat { flex: 1 1 0; min-width: 0; }
  .cpc-list .cp-stat b { font-size: 64px; }
  .cpc-list .cp-lf { padding: 12px 0 12px var(--cpc-pad); }
  .cpc-list .cp-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-right: var(--cpc-pad); max-width: 100%; }
  .cpc-list .cp-chips::-webkit-scrollbar { display: none; }
  .cpc-list .cp-other { padding-right: var(--cpc-pad); }
  .cpc-list .cp-lb { padding: 24px var(--cpc-pad) 48px; gap: 32px; }
  .cpc-list .cp-grid { gap: 28px; }
  .cpc-list a.cp-card { gap: 10px; padding-bottom: 22px; border-bottom: 1px solid var(--cpc-rule); }
  .cpc-list a.cp-card .pic { aspect-ratio: auto; height: 200px; }
  .cpc-list a.cp-card h3 { font-size: 24px; }
  .cpc-list .cp-wsec h2 { font-size: 32px; }
  .cpc-list .cp-radar a { grid-template-columns: minmax(0, 1fr) 80px 64px; }

  .cpc-archive .cp-ah { padding: 32px var(--cpc-pad) 24px; gap: 16px; }
  .cpc-archive h1.cp-an { font-size: 72px; }
  .cpc-archive .cp-ad { font-size: 20px; }
  .cpc-archive .cp-weeks { padding: 0 var(--cpc-pad) 48px; }
  .cpc-archive a.cp-wk { grid-template-columns: minmax(0, 1fr) 24px; gap: 12px 16px; padding: 20px 0; }
  .cpc-archive .cp-when, .cpc-archive .cp-sig, .cpc-archive .cp-men { grid-column: 1; grid-row: auto; }
  .cpc-archive .cp-go-i { grid-column: 2; grid-row: 1 / span 3; }
  .cpc-archive .cp-when b { font-size: 32px; }
  .cpc-archive .cp-sig em { font-size: 30px; }
  .cpc-archive #hanko { padding: 32px var(--cpc-pad) 48px; }

  .cpc-text { padding: calc(var(--cp-bar, 56px) + 32px) var(--cpc-pad) 56px; gap: 28px; }
  .cpc-text .cp-tnav a { font-size: 21px; }
  .cpc-text .cp-tbody { gap: 24px; }
  .cpc-text h1.story { font-size: 64px !important; letter-spacing: -1px; }   /* the engine's 64 px holds above 600 */
  .cpc-text :is(.summary, .about-text > h2:first-child) { font-size: 24px !important; }
  .cpc-text :is(.about-text, .legal-text, .lsec) p { font-size: 20px; }
  .cpc-text .lsec h2 { font-size: 30px; }
}
@media (max-width: 600px) {
  .cpc-story h1.cp-st-h { font-size: 38px; line-height: 1.02; }
  .cpc-text h1.story { font-size: 56px !important; }
}

/* Cinepuuulse redesign, stage 2, slice D (2026-10-13): editor's note + notes index, festival board (/departures/),
   box office (/boxoffice/), releases index + release page. Pencil file cine.pen, frames MsgfM / ljfjJ (note), CEi8A
   (notes index), TSg7R / Bqwp0 (festival board), AL9fq / LWSiy (box office), wn5Hh / O3kVpk / KU4dx (releases).
   Every rule is scoped to a page class cp-pages-d.js sets on <html> (cpd-note, cpd-notes, cpd-dep, cpd-bo, cpd-rel,
   cpd-relp), so no other page changes. x-releases.* is not edited: the releases rules below load after it and win.
   Deliberate differences from the frames, all owner rules:
   - nothing is set under the 14.6 px floor (the frames' 12/13/14 px labels are set at 14.6);
   - no text is set smaller than the size the engine already gave the same text on that page (note date 16.5, note
     links 17.5, departures dates and cities 19.5, box office figures 17.5, ranks 25.36, release headline clamp);
   - the frames' 30 % "faint" ink fails 4.5:1 on #0B0B0C, so text uses 55 % ink (as slice B did); rules stay at 12 %;
   - the page is fluid: grids add columns as the screen grows, nothing sits in a centred column. Running text keeps a
     reading measure (the paragraph, not the page). */

html.cpd {
  --cpd-bg: #0B0B0C; --cpd-ink: #F2EFE9; --cpd-red: #D7263D; --cpd-redt: #FF4A5E;
  --cpd-dim: rgba(242, 239, 233, .6); --cpd-faint: rgba(242, 239, 233, .55); --cpd-rule: rgba(255, 255, 255, .12);
  --cpd-panel: #141416; --cpd-card: #1E1E21; --cpd-pad: 32px; --cpd-floor: 14.6px;
}
@media (max-width: 767px) { html.cpd #single { --cpd-pad: 16px; } }

/* ------------------------------------------------------------ shared */
html.cpd main#single.cpd-main { max-width: none; width: auto; margin: 0; padding: var(--cp-bar, 64px) 0 0; background: var(--cpd-bg); color: var(--cpd-ink); font-family: var(--sans); overflow-x: clip; }
html.cpd main#single.cpd-main *, html.cpd main#single.cpd-main *::before, html.cpd main#single.cpd-main *::after { box-sizing: border-box; }
html.cpd main#single.cpd-main > .crumb { display: none; }
html.cpd #single .cpd-main a:focus-visible, html.cpd #single .cpd-main button:focus-visible, html.cpd #single .cpd-main select:focus-visible { outline: 2px solid var(--cpd-redt); outline-offset: 3px; }
html.cpd #single .cpd-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 48px; flex-wrap: wrap; padding: 56px var(--cpd-pad) 32px; border-bottom: 1px solid var(--cpd-rule); }
html.cpd #single .cpd-h1 { font: 400 clamp(56px, 7.8vw, 150px)/.95 var(--serif); letter-spacing: -.005em; color: var(--cpd-ink); margin: 0; }
html.cpd #single .cpd-dek { font: 400 24px/1.3 var(--serif); color: var(--cpd-dim); margin: 0; max-width: 520px; flex: 0 1 520px; }
html.cpd #single .cpd-chips { display: flex; flex-wrap: wrap; gap: 8px 10px; }
html.cpd #single .cpd-chips button, html.cpd #single .cpd-chips a { font: 500 15px/1.2 var(--sans); padding: 8px 16px; border-radius: 999px; border: 1px solid var(--cpd-rule); color: var(--cpd-dim); background: transparent; white-space: nowrap; cursor: pointer; text-decoration: none; }
html.cpd #single .cpd-chips :is(button, a):hover { color: var(--cpd-ink); border-color: var(--cpd-faint); }
html.cpd #single .cpd-chips :is(button[aria-pressed="true"], a.on) { background: var(--cpd-ink); color: var(--cpd-bg); border-color: var(--cpd-ink); }
html.cpd #single .cpd-chips button.cpd-ai { color: var(--cpd-redt); border-color: var(--cpd-red); }
html.cpd #single .cpd-chips button.cpd-ai[aria-pressed="true"] { background: var(--cpd-red); color: #fff; border-color: var(--cpd-red); }
html.cpd #single .cpd-more { display: flex; justify-content: center; padding-top: 32px; }
html.cpd #single .cpd-more[hidden] { display: none; }
html.cpd #single .cpd-more button, html.cpd #single .cpd-btn { display: inline-flex; align-items: center; gap: 10px; font: 600 15px/1.2 var(--sans); padding: 16px 32px; border-radius: 999px; border: 1px solid var(--cpd-ink); color: var(--cpd-ink); background: none; cursor: pointer; }
html.cpd #single .cpd-more button:hover, html.cpd #single .cpd-btn:hover { background: var(--cpd-ink); color: var(--cpd-bg); }
html.cpd #single .cpd-k { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cpd-dim); }
html.cpd #single .cpd-pill { display: inline-block; font: 600 var(--cpd-floor)/1.1 var(--sans); padding: 6px 14px; border-radius: 999px; background: var(--cpd-red); color: #fff; width: fit-content; }
html.cpd #single .cpd-ar { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* ============================================================ notes index (CEi8A) */
html.cpd-notes #single .cpd-notes-h .cpd-h1 { font-size: clamp(64px, 8.9vw, 170px); line-height: .92; letter-spacing: -2px; }
html.cpd-notes #single .cpd-by { display: flex; flex-direction: column; gap: 6px; flex: 0 1 420px; }
html.cpd-notes #single .cpd-by .summary { font: italic 400 28px/1.2 var(--serif); color: var(--cpd-dim); margin: 0; }
html.cpd-notes #single .cpd-by a { font: 600 15px/1.2 var(--sans); color: var(--cpd-redt); text-decoration: none; width: fit-content; }
html.cpd-notes #single .cpd-by a:hover { text-decoration: underline; text-underline-offset: 3px; }
html.cpd-notes main#single > h1.story, html.cpd-notes main#single > p.summary { display: none; }
html.cpd-notes #single .note-list { display: block; padding: 8px var(--cpd-pad) 80px; margin: 0; max-width: none; columns: auto; }
html.cpd-notes #single .note-list > a { display: grid; grid-template-columns: 200px minmax(0, 1fr) auto 24px; align-items: center; column-gap: 40px; padding: 26px 0; border-bottom: 1px solid var(--cpd-rule); color: var(--cpd-ink); text-decoration: none; margin: 0; }
html.cpd-notes #single .note-list > a .d { grid-column: 1; grid-row: 1; font: 400 16.5px/1.2 var(--sans); color: var(--cpd-dim); margin: 0; }
html.cpd-notes #single .note-list > a h2 { grid-column: 2; grid-row: 1; font: 400 44px/1.04 var(--serif); color: var(--cpd-ink); margin: 0; }
html.cpd-notes #single .note-list > a .pill { grid-column: 3; grid-row: 1; font: 600 var(--cpd-floor)/1.1 var(--sans); color: var(--cpd-redt); border: 1px solid var(--cpd-red); background: none; border-radius: 999px; padding: 6px 12px; margin: 0; }
html.cpd-notes #single .note-list > a .cpd-ar { grid-column: 4; grid-row: 1; color: var(--cpd-dim); }
html.cpd-notes #single .note-list > a:hover h2 { color: var(--cpd-redt); }
html.cpd-notes #single .note-list > a:hover .cpd-ar { color: var(--cpd-ink); transform: translateX(3px); }
@media (prefers-reduced-motion: no-preference) { html.cpd-notes #single .note-list > a .cpd-ar { transition: transform .15s ease, color .15s ease; } }
@media (max-width: 1023px) { html.cpd-notes #single .note-list > a { grid-template-columns: 160px minmax(0, 1fr) auto 24px; column-gap: 24px; } html.cpd-notes #single .note-list > a h2 { font-size: 36px; } }
@media (max-width: 767px) {
  html.cpd-notes #single .cpd-notes-h { padding: 28px var(--cpd-pad) 24px; }
  html.cpd-notes #single .cpd-notes-h .cpd-h1 { letter-spacing: -1px; }
  html.cpd-notes #single .cpd-by .summary { font-size: 22px; }
  html.cpd-notes #single .note-list > a { grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; column-gap: 12px; padding: 20px 0; }
  html.cpd-notes #single .note-list > a .d { grid-column: 1; grid-row: 1; }
  html.cpd-notes #single .note-list > a .pill { grid-column: 2; grid-row: 1; justify-self: end; }
  html.cpd-notes #single .note-list > a h2 { grid-column: 1 / -1; grid-row: 2; font-size: 31px; }
  html.cpd-notes #single .note-list > a .cpd-ar { display: none; }
}

/* the editor page (/editor/): the same head and rows; the bio sits where the index's dek sits */
html.cpd-ed #single .cpd-ed-h { align-items: flex-end; }
html.cpd-ed #single .cpd-ed-l { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
html.cpd-ed #single .cpd-ed-l .pill { display: inline-block; width: fit-content; font: 600 var(--cpd-floor)/1.1 var(--sans); padding: 6px 14px; border-radius: 999px; background: var(--cpd-red); color: #fff; border: 0; margin: 0; letter-spacing: 0; text-transform: none; }
html.cpd-ed #single .cpd-ed-l h1.story { margin: 0; max-width: none; }
html.cpd-ed #single .cpd-ed-h .cpd-by { flex: 0 1 640px; gap: 14px; }
html.cpd-ed #single .cpd-ed-h .cpd-by .summary { font: 400 28px/1.3 var(--serif); color: var(--cpd-dim); }
html.cpd-ed #single .cpd-ed-h .editor-contact { margin: 0; font: 600 17px/1.2 var(--sans); }
html.cpd-ed #single .cpd-ed-h .editor-contact a { color: var(--cpd-redt); text-decoration: none; }
html.cpd-ed #single .cpd-ed-h .editor-contact a:hover { text-decoration: underline; text-underline-offset: 3px; }
html.cpd-ed #single > h2.editor-h { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--cpd-dim); margin: 0; padding: 48px var(--cpd-pad) 0; }
html.cpd-ed #single > .note-list { padding-bottom: 24px; }
html.cpd-ed #single > .note-list:last-of-type { padding-bottom: 80px; }
@media (max-width: 767px) { html.cpd-ed #single .cpd-ed-h .cpd-by .summary { font-size: 22px; } html.cpd-ed #single > h2.editor-h { padding-top: 32px; } }

/* ============================================================ editor's note (MsgfM / ljfjJ) */
html.cpd-note main#single.single.note { padding: var(--cp-bar, 64px) 0 0; }
html.cpd-note #single .note-page { display: grid; grid-template-columns: minmax(240px, 340px) minmax(0, 1fr); gap: 96px; padding: 72px var(--cpd-pad) 96px; max-width: none; margin: 0; }
html.cpd-note #single .note-side { display: flex; flex-direction: column; gap: 20px; position: static; align-self: start; margin: 0; padding: 0; border: 0; }
html.cpd-note #single .note-side .pill { display: inline-block; width: fit-content; font: 600 var(--cpd-floor)/1.1 var(--sans); padding: 6px 14px; border-radius: 999px; background: var(--cpd-red); color: #fff; border: 0; margin: 0; letter-spacing: 0; text-transform: none; }
html.cpd-note #single .note-side .note-author { font: 400 40px/1.15 var(--serif); margin: 0; }
html.cpd-note #single .note-side .note-author a { color: var(--cpd-ink); text-decoration: none; }
html.cpd-note #single .note-side .note-author a:hover { color: var(--cpd-redt); }
html.cpd-note #single .note-side .note-date { font: 400 16.5px/1.2 var(--sans); letter-spacing: 0; text-transform: none; color: var(--cpd-dim); margin: 0; }
html.cpd-note #single .note-side .note-bio { font: 400 19px/1.45 var(--serif); color: var(--cpd-dim); margin: 0; max-width: 34ch; }
html.cpd-note #single .note-side .note-more { font: 600 17.5px/1.2 var(--sans); color: var(--cpd-ink); margin: 0; text-decoration: none; width: fit-content; }
html.cpd-note #single .note-side .note-more:hover { color: var(--cpd-redt); }
html.cpd-note #single .note-main { min-width: 0; display: flex; flex-direction: column; gap: 36px; }
html.cpd-note #single .note-main h1.story { font: 400 clamp(44px, 6.1vw, 120px)/.98 var(--serif); letter-spacing: -1px; color: var(--cpd-ink); margin: 0; max-width: 22ch; }
html.cpd-note #single .note-body { display: flex; flex-direction: column; gap: 0; }
html.cpd-note #single .note-body p { font: 400 24px/1.55 var(--serif); color: var(--cpd-dim); margin: 0 0 26px; max-width: 46em; }
html.cpd-note #single .note-body p.lead { font-size: 32px; line-height: 1.35; color: var(--cpd-ink); margin-bottom: 36px; max-width: 34em; }
html.cpd-note #single .note-body p a { color: var(--cpd-ink); text-decoration: underline; text-decoration-color: var(--cpd-red); text-underline-offset: 4px; text-decoration-thickness: 1px; }
html.cpd-note #single .note-body p a:hover { color: var(--cpd-redt); }
html.cpd-note #single .note-body blockquote { margin: 10px 0 36px; padding: 8px 0 8px 32px; border-left: 2px solid var(--cpd-red); }
html.cpd-note #single .note-body blockquote, html.cpd-note #single .note-body blockquote p { font: italic 400 40px/1.15 var(--serif); color: var(--cpd-ink); }
html.cpd-note #single .note-body h2 { font: 400 32px/1.2 var(--serif); color: var(--cpd-ink); margin: 16px 0 18px; }
html.cpd-note #single .note-refs { margin: 10px 0 0; padding: 24px 0 0; border-top: 1px solid var(--cpd-rule); max-width: 46em; }
html.cpd-note #single .note-refs h2 { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--cpd-dim); margin: 0 0 10px; }
html.cpd-note #single .note-refs ol { margin: 0; padding: 0 0 0 1.2em; }
html.cpd-note #single .note-refs li { font: 400 18px/1.45 var(--sans); color: var(--cpd-faint); margin: 0 0 8px; }
html.cpd-note #single .note-refs li a { color: var(--cpd-dim); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--cpd-rule); }
html.cpd-note #single .note-refs li a:hover { color: var(--cpd-ink); }
html.cpd-note #single .note-refs li .grey { font-size: 15px; color: var(--cpd-faint); }
html.cpd-note #single .note-like { margin: 0; font-size: 15px; color: var(--cpd-dim); }
/* "next notes" (the frame's three cards under the note) */
html.cpd-note #single .cpd-next { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 32px; padding: 56px var(--cpd-pad) 80px; border-top: 1px solid var(--cpd-rule); }
html.cpd-note #single .cpd-next a { display: flex; flex-direction: column; gap: 10px; padding-top: 20px; border-top: 1px solid var(--cpd-ink); color: var(--cpd-ink); text-decoration: none; }
html.cpd-note #single .cpd-next .d { font: 700 var(--cpd-floor)/1.2 var(--sans); color: var(--cpd-redt); }
html.cpd-note #single .cpd-next h2 { font: 400 34px/1.08 var(--serif); margin: 0; color: var(--cpd-ink); }
html.cpd-note #single .cpd-next a:hover h2 { color: var(--cpd-redt); }
@media (max-width: 1099px) { html.cpd-note #single .note-page { gap: 56px; grid-template-columns: minmax(220px, 280px) minmax(0, 1fr); } }
@media (max-width: 767px) {
  /* ljfjJ: pill, headline, «author · date», the note, then the links; the column becomes one flow */
  html.cpd-note #single .note-page { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: 20px 0; padding: 28px var(--cpd-pad) 36px; }
  html.cpd-note #single .note-side, html.cpd-note #single .note-main { display: contents; }
  html.cpd-note #single .note-side > *, html.cpd-note #single .note-main > * { grid-column: 1 / -1; min-width: 0; }
  html.cpd-note #single .note-side .pill { order: 1; justify-self: start; }
  html.cpd-note #single .note-main h1.story { order: 2; font-size: 44px; line-height: 1; letter-spacing: -.5px; }
  html.cpd-note #single .note-side .note-author { order: 3; grid-column: 1; font: 400 16.5px/1.3 var(--sans); }
  html.cpd-note #single .note-side .note-author a { color: var(--cpd-dim); }
  html.cpd-note #single .note-side .note-date { order: 4; grid-column: 2; }
  html.cpd-note #single .note-side .note-date::before { content: "\00a0·\00a0"; }
  html.cpd-note #single .note-main .note-body { order: 5; }
  html.cpd-note #single .note-main .note-like { order: 6; }
  html.cpd-note #single .note-side .note-more { order: 7; }
  html.cpd-note #single .note-side .note-bio { order: 8; max-width: none; padding-top: 16px; border-top: 1px solid var(--cpd-rule); }
  html.cpd-note #single .note-body p { font-size: 22px; }
  html.cpd-note #single .note-body p.lead { font-size: 25.36px; line-height: 1.4; }
  html.cpd-note #single .note-body blockquote, html.cpd-note #single .note-body blockquote p { font-size: 26px; }
  html.cpd-note #single .note-body blockquote { padding-left: 16px; }
  html.cpd-note #single .cpd-next { padding: 32px var(--cpd-pad) 48px; gap: 24px; }
  html.cpd-note #single .cpd-next h2 { font-size: 28px; }
}

/* ============================================================ festival board (TSg7R / Bqwp0) */
html.cpd-dep #dep { display: none !important; }
html.cpd-dep main#single.cpd-main[hidden] { display: block !important; }   /* the engine hides #single on this page each minute; the board lives in it */
html.cpd-dep main#single.cpd-main > :not(.cpd-wrap) { display: none !important; }
html.cpd-dep #single .cpd-kick { display: flex; align-items: baseline; gap: 12px; margin-bottom: 10px; }
html.cpd-dep #single .cpd-kick .jp { font: 500 26px/1.4 "Shippori Mincho", var(--serif); color: var(--cpd-redt); }
html.cpd-dep #single .cpd-kick .cpd-k { letter-spacing: 3px; }
html.cpd-dep #single .cpd-dep-h { border-bottom: 0; padding-bottom: 28px; }
html.cpd-dep #single .cpd-filters { display: flex; align-items: center; justify-content: space-between; gap: 12px 32px; flex-wrap: wrap; padding: 14px var(--cpd-pad); border-top: 1px solid var(--cpd-rule); border-bottom: 1px solid var(--cpd-rule); }
html.cpd-dep #single .cpd-months { display: flex; flex-wrap: wrap; gap: 4px 6px; }
html.cpd-dep #single .cpd-months button { font: 400 15px/1.2 var(--sans); color: var(--cpd-faint); background: none; border: 0; padding: 6px 7px; cursor: pointer; }
html.cpd-dep #single .cpd-months button:hover { color: var(--cpd-ink); }
html.cpd-dep #single .cpd-months button[aria-pressed="true"] { color: var(--cpd-ink); font-weight: 700; }
html.cpd-dep #single .cpd-board { padding: 24px var(--cpd-pad) 80px; }
html.cpd-dep #single table.cpd-t { width: 100%; border-collapse: collapse; table-layout: auto; }
html.cpd-dep #single .cpd-t thead th, html.cpd-dep #single .cpd-t thead th.c-c, html.cpd-dep #single .cpd-t thead th.c-r { background: var(--cpd-panel); font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: 2.5px; text-transform: uppercase; color: var(--cpd-dim); text-align: left; padding: 12px 24px 12px 0; white-space: nowrap; }
html.cpd-dep #single .cpd-t thead th:first-child { padding-left: 24px; }
html.cpd-dep #single .cpd-t td { padding: 20px 24px 20px 0; vertical-align: middle; border: 0; }
html.cpd-dep #single .cpd-t td:first-child { padding-left: 24px; }
html.cpd-dep #single .cpd-t tbody tr:nth-child(even) { background: rgba(255, 255, 255, .02); }
html.cpd-dep #single .cpd-t .c-d { width: 210px; font: 600 19.5px/1.2 var(--sans); color: var(--cpd-ink); white-space: nowrap; font-variant-numeric: tabular-nums; }
html.cpd-dep #single .cpd-t .c-n a { font: 400 30px/1.05 var(--serif); color: var(--cpd-ink); text-decoration: none; }
html.cpd-dep #single .cpd-t .c-n a:hover { color: var(--cpd-redt); }
html.cpd-dep #single .cpd-t .c-n .ed { font: 600 var(--cpd-floor)/1 var(--sans); color: var(--cpd-faint); margin-left: 12px; white-space: nowrap; vertical-align: 6px; }
html.cpd-dep #single .cpd-t .c-c { width: 200px; font: 400 19.5px/1.2 var(--sans); color: var(--cpd-dim); }
html.cpd-dep #single .cpd-t .c-r { width: 180px; font: 400 19.5px/1.2 var(--sans); color: var(--cpd-dim); }
html.cpd-dep #single .cpd-t .c-s { width: 190px; font: 600 16.5px/1.2 var(--sans); color: var(--cpd-dim); }
html.cpd-dep #single .cpd-t .c-s .st { display: inline-flex; align-items: baseline; gap: 8px; }
html.cpd-dep #single .cpd-t .c-s.live { color: var(--cpd-ink); }
html.cpd-dep #single .cpd-t .c-s.live .st::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--cpd-red); flex: none; transform: translateY(-1px); }
html.cpd-dep #single .cpd-t .c-s .unc { display: block; font-weight: 400; color: var(--cpd-faint); }
html.cpd-dep #single .cpd-t tr.ai { background: rgba(215, 38, 61, .1) !important; outline: 1px solid rgba(215, 38, 61, .4); outline-offset: -1px; }
html.cpd-dep #single .cpd-t tr.ai .c-d, html.cpd-dep #single .cpd-t tr.ai .c-r { color: var(--cpd-redt); }
html.cpd-dep #single .cpd-t tr.ai .c-n a { font-style: italic; }
html.cpd-dep #single .cpd-empty { font: italic 400 24px/1.3 var(--serif); color: var(--cpd-dim); padding: 32px 24px; margin: 0; }
html.cpd-dep #single .cpd-src { font: 400 var(--cpd-floor)/1.45 var(--sans); color: var(--cpd-faint); margin: 24px 0 0; }
@media (max-width: 1199px) { html.cpd-dep #single .cpd-t .c-r { display: none; } html.cpd-dep #single .cpd-t .c-d { width: 180px; } html.cpd-dep #single .cpd-t .c-c { width: 160px; } }
@media (max-width: 899px) { html.cpd-dep #single .cpd-t .c-c { display: none; } html.cpd-dep #single .cpd-t .c-n a { font-size: 26px; } }
@media (max-width: 767px) {
  /* Bqwp0: each festival is a two-line card, dates and status on top, the name under them */
  html.cpd-dep #single .cpd-dep-h { padding: 28px var(--cpd-pad) 20px; }
  html.cpd-dep #single .cpd-kick { margin-bottom: 4px; }
  html.cpd-dep #single .cpd-kick .jp { font-size: 19.5px; }
  html.cpd-dep #single .cpd-dek { font-size: 19.5px; }
  html.cpd-dep #single .cpd-filters { border: 0; padding: 0 var(--cpd-pad) 16px; flex-direction: column; align-items: stretch; gap: 10px; }
  html.cpd-dep #single .cpd-filters .cpd-chips, html.cpd-dep #single .cpd-months { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--cpd-pad)); padding: 0 var(--cpd-pad); }
  html.cpd-dep #single .cpd-filters .cpd-chips::-webkit-scrollbar, html.cpd-dep #single .cpd-months::-webkit-scrollbar { display: none; }
  html.cpd-dep #single .cpd-filters .cpd-chips button { font-size: var(--cpd-floor); padding: 7px 13px; }
  html.cpd-dep #single .cpd-board { padding: 0 var(--cpd-pad) 32px; }
  html.cpd-dep #single table.cpd-t, html.cpd-dep #single .cpd-t tbody { display: block; }
  html.cpd-dep #single .cpd-t thead { display: none; }
  html.cpd-dep #single .cpd-t tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 12px; padding: 14px 0; border-bottom: 1px solid var(--cpd-rule); }
  html.cpd-dep #single .cpd-t tbody tr:nth-child(even) { background: none; }
  html.cpd-dep #single .cpd-t tr.ai { padding: 14px 12px; }
  html.cpd-dep #single .cpd-t td, html.cpd-dep #single .cpd-t td:first-child { display: block; width: auto; padding: 0; }
  html.cpd-dep #single .cpd-t .c-d { grid-column: 1; grid-row: 1; font-size: 16.5px; }
  html.cpd-dep #single .cpd-t .c-s { grid-column: 2; grid-row: 1; text-align: right; font-size: var(--cpd-floor); font-weight: 400; }
  html.cpd-dep #single .cpd-t .c-s .st { gap: 6px; }
  html.cpd-dep #single .cpd-t .c-s.live .st::before { width: 7px; height: 7px; }
  html.cpd-dep #single .cpd-t .c-n { grid-column: 1 / -1; grid-row: 2; }
  html.cpd-dep #single .cpd-t .c-n a { font-size: 24px; }
  html.cpd-dep #single .cpd-t .c-c, html.cpd-dep #single .cpd-t .c-r { display: none; }
  /* audit 2026-10-16: Bqwp0 keeps «Busan · Korea» under the name; the phone row had dropped both. Three columns so the city
     and the region sit on one line under the name, at the floor size */
  html.cpd-dep #single .cpd-t tr { grid-template-columns: auto minmax(0, 1fr) auto; }
  html.cpd-dep #single .cpd-t .c-d { grid-column: 1 / 3; }
  html.cpd-dep #single .cpd-t .c-s { grid-column: 3; }
  html.cpd-dep #single .cpd-t .c-n { grid-column: 1 / -1; }
  html.cpd-dep #single .cpd-t .c-c, html.cpd-dep #single .cpd-t .c-r { display: block; grid-row: 3; font-size: var(--cpd-floor); line-height: 1.3; width: auto; }
  html.cpd-dep #single .cpd-t .c-c { grid-column: 1; }
  html.cpd-dep #single .cpd-t .c-r { grid-column: 2 / -1; margin-left: -8px; }
  html.cpd-dep #single .cpd-t .c-c:empty, html.cpd-dep #single .cpd-t .c-r:empty { display: none; }
  html.cpd-dep #single .cpd-t .c-c:not(:empty) + .c-r:not(:empty)::before { content: "· "; }
}

/* ============================================================ box office (AL9fq / LWSiy) */
html.cpd-bo main#single.cpd-main > :not(.cpd-wrap) { display: none !important; }
html.cpd-bo #single .cpd-bo-h .summary { font: 400 28px/1.3 var(--serif); color: var(--cpd-dim); margin: 0; max-width: 560px; flex: 0 1 560px; }
html.cpd-bo #single .cpd-bonav { position: sticky; top: var(--cp-bar, 64px); z-index: 20; display: flex; flex-wrap: wrap; gap: 10px; padding: 14px var(--cpd-pad); background: rgba(11, 11, 12, .95); border-bottom: 1px solid var(--cpd-rule); }
html.cpd-bo #single .cpd-feat { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; padding: 40px var(--cpd-pad) 56px; align-items: stretch; }
html.cpd-bo #single .cpd-fb { display: flex; flex-direction: column; background: var(--cpd-panel); border-top: 2px solid var(--cpd-red); padding: 26px 28px; min-width: 0; }
html.cpd-bo #single .cpd-where { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding-bottom: 16px; }
html.cpd-bo #single .cpd-where .cpd-k { color: var(--cpd-redt); letter-spacing: 2px; }
html.cpd-bo #single .cpd-where .cpd-k a { color: inherit; text-decoration: none; }
/* integrator: the engine set market names at 32px; owner rule says type never shrinks */
html.cpd-bo #single .cpd-where .cpd-k { font: 400 32px/1.05 var(--serif); letter-spacing: 0; text-transform: none; }
html.cpd-bo #single .cpd-where .cpd-k a:hover { text-decoration: underline; text-underline-offset: 3px; }
html.cpd-bo #single .cpd-where .per { font: 400 var(--cpd-floor)/1.2 var(--sans); color: var(--cpd-faint); white-space: nowrap; }
html.cpd-bo #single .cpd-fb ol { list-style: none; margin: 0; padding: 0; }
html.cpd-bo #single .cpd-fb li { display: grid; grid-template-columns: 40px 48px minmax(0, 1fr) auto auto; align-items: center; gap: 16px; padding: 10px 0; border-bottom: 1px solid var(--cpd-rule); }
html.cpd-bo #single .cpd-fb .rk { font: 400 26px/1 var(--serif); color: var(--cpd-dim); }
html.cpd-bo #single .cpd-fb .mv { font: 700 var(--cpd-floor)/1 var(--sans); color: var(--cpd-faint); white-space: nowrap; }
html.cpd-bo #single .cpd-fb .mv.new, html.cpd-bo #single .cpd-fb .mv.up { color: var(--cpd-redt); }
html.cpd-bo #single .cpd-fb .tt { font: 400 24px/1.1 var(--serif); color: var(--cpd-ink); min-width: 0; overflow-wrap: anywhere; }
html.cpd-bo #single .cpd-fb .wk { font: 400 var(--cpd-floor)/1 var(--sans); color: var(--cpd-faint); white-space: nowrap; }
html.cpd-bo #single .cpd-fb .gr { font: 400 24px/1 var(--serif); color: var(--cpd-ink); white-space: nowrap; font-variant-numeric: tabular-nums; text-align: right; }
html.cpd-bo #single .cpd-fb li.top { grid-template-columns: 60px 48px minmax(0, 1fr) auto auto; padding: 8px 0 18px; }
html.cpd-bo #single .cpd-fb li.top .rk { font-size: 56px; color: var(--cpd-redt); }
html.cpd-bo #single .cpd-fb li.top .tt { font-size: 40px; line-height: 1.05; }
html.cpd-bo #single .cpd-fb li.top .gr { font-size: 40px; color: var(--cpd-redt); }
html.cpd-bo #single .cpd-fb.ytd li { grid-template-columns: 40px minmax(0, 1fr) auto; }
html.cpd-bo #single .cpd-fb.ytd li.top { grid-template-columns: 60px minmax(0, 1fr) auto; }
html.cpd-bo #single .cpd-fb.ytd .mv, html.cpd-bo #single .cpd-fb.ytd .wk { display: none; }
html.cpd-bo #single .cpd-chap { padding: 56px var(--cpd-pad) 64px; border-top: 1px solid var(--cpd-rule); scroll-margin-top: calc(var(--cp-bar, 64px) + 62px); }
html.cpd-bo #single .cpd-feat { scroll-margin-top: calc(var(--cp-bar, 64px) + 62px); }
html.cpd-bo #single .cpd-chap > h2 { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; font: 400 64px/1 var(--serif); color: var(--cpd-ink); margin: 0 0 24px; }
html.cpd-bo #single .cpd-chap > h2 small { font: italic 400 24px/1.2 var(--serif); color: var(--cpd-dim); }
html.cpd-bo #single .cpd-mk { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; align-items: stretch; }
html.cpd-bo #single .cpd-m { display: flex; flex-direction: column; gap: 10px; background: var(--cpd-panel); border-top: 1px solid var(--cpd-rule); padding: 22px; min-width: 0; }
html.cpd-bo #single .cpd-m .cpd-where { padding-bottom: 0; }
html.cpd-bo #single .cpd-m ol { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
html.cpd-bo #single .cpd-m li { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: baseline; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--cpd-rule); }
html.cpd-bo #single .cpd-m .rk { font: 400 25.36px/1 var(--serif); color: var(--cpd-faint); }
html.cpd-bo #single .cpd-m .tt { font: 400 22px/1.1 var(--serif); color: var(--cpd-ink); min-width: 0; overflow-wrap: anywhere; }
html.cpd-bo #single .cpd-m .gr { font: 600 17.5px/1 var(--sans); color: var(--cpd-dim); white-space: nowrap; font-variant-numeric: tabular-nums; }
html.cpd-bo #single .cpd-m li.top .rk { font-size: 28px; color: var(--cpd-redt); }
html.cpd-bo #single .cpd-m li.top .tt { font-size: 24px; }
html.cpd-bo #single .cpd-m li.top .gr { color: var(--cpd-redt); }
html.cpd-bo #single .cpd-m li.nc .tt { color: var(--cpd-faint); }
html.cpd-bo #single .cpd-top10 { display: none; }
@media (max-width: 767px) {   /* audit 2026-10-16: LWSiy, places 1–5 then «Top 10 →» */
  html.cpd-bo #single .cpd-fb:not(.cpd-all) ol > li:nth-child(n+6) { display: none; }
  html.cpd-bo #single .cpd-top10 { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; margin-top: 14px; padding: 6px 0; background: none; border: 0; color: var(--cpd-ink); font: 600 15px/1.2 var(--sans); cursor: pointer; }
  html.cpd-bo #single .cpd-top10:focus-visible { outline: 2px solid var(--cpd-redt); outline-offset: 3px; }
}
html.cpd-bo #single .cpd-note { font: 400 var(--cpd-floor)/1.45 var(--sans); color: var(--cpd-faint); margin: 0; padding: 0 var(--cpd-pad) 80px; max-width: 120ch; }
@media (max-width: 1023px) { html.cpd-bo #single .cpd-feat { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 767px) {
  html.cpd-bo #single .cpd-bo-h { padding: 28px var(--cpd-pad) 16px; border: 0; }
  html.cpd-bo #single .cpd-bo-h .summary { font-size: 22px; }
  html.cpd-bo #single .cpd-bonav { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; gap: 8px; padding: 0 var(--cpd-pad) 16px; position: static; background: none; border: 0; }
  html.cpd-bo #single .cpd-bonav::-webkit-scrollbar { display: none; }
  html.cpd-bo #single .cpd-bonav a { font-size: var(--cpd-floor); padding: 7px 13px; }
  html.cpd-bo #single .cpd-feat { padding: 0 var(--cpd-pad) 24px; gap: 16px; }
  html.cpd-bo #single .cpd-fb { padding: 18px; }
  html.cpd-bo #single .cpd-fb li, html.cpd-bo #single .cpd-fb li.top { grid-template-columns: 34px minmax(0, 1fr) auto; gap: 4px 12px; }
  html.cpd-bo #single .cpd-fb li .mv, html.cpd-bo #single .cpd-fb li .wk { display: none; }
  html.cpd-bo #single .cpd-fb li.top .rk { font-size: 34px; }
  html.cpd-bo #single .cpd-fb li.top .tt { font-size: 26px; }
  html.cpd-bo #single .cpd-fb li.top .gr { font-size: 26px; }
  html.cpd-bo #single .cpd-fb .tt, html.cpd-bo #single .cpd-fb .gr { font-size: 22px; }
  html.cpd-bo #single .cpd-chap { padding: 32px var(--cpd-pad) 40px; }
  html.cpd-bo #single .cpd-chap > h2 { font-size: 40px; }
  /* market cards swipe in their own row; the page itself never scrolls sideways */
  html.cpd-bo #single .cpd-mk { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 calc(-1 * var(--cpd-pad)); padding: 0 var(--cpd-pad); }
  html.cpd-bo #single .cpd-mk::-webkit-scrollbar { display: none; }
  html.cpd-bo #single .cpd-m { flex: 0 0 82%; scroll-snap-align: start; }
}

/* ============================================================ releases index (wn5Hh / KU4dx), over x-releases.css */
html.cpd-rel main#single.xpage-releases { padding-top: var(--cp-bar, 64px); }
html.cpd-rel #single .xr.xr-index { padding: 0; max-width: none; margin: 0; }
html.cpd-rel #single .xr-index .xr-hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 560px); gap: 56px; align-items: end; padding: 56px var(--cpd-pad) 48px; margin: 0; border: 0; min-height: 0; }
html.cpd-rel #single .xr-index .xr-crumb-i { display: flex; gap: 10px; padding: 0; font: 400 15px/1.2 var(--sans); margin: 0 0 18px; color: var(--cpd-dim); }
html.cpd-rel #single .xr-index .xr-crumb-i a { color: var(--cpd-redt); text-decoration: none; }
html.cpd-rel #single .xr-index .xr-crumb-i .xr-cr-b { color: var(--cpd-dim); }
html.cpd-rel #single .xr-index .xr-crumb-i i { font-style: normal; color: var(--cpd-faint); margin: 0; }
html.cpd-rel #single .xr-index .xr-crumb-i > span { display: inline-flex; gap: 10px; padding: 0; margin: 0; }
html.cpd-rel #single .xr-index .xr-hero-l { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
html.cpd-rel #single .xr-index .xr .xr-h1, html.cpd-rel #single .xr-index .xr-h1 { font: 400 clamp(64px, 11.2vw, 190px)/.9 var(--serif); letter-spacing: -2px; color: var(--cpd-ink); margin: 0; }
html.cpd-rel #single .xr-index .xr-kick { display: none; }
html.cpd-rel #single .xr-index .xr-intro { display: flex; flex-direction: column; gap: 10px; max-width: 640px; margin: 0; }
html.cpd-rel #single .xr-index .xr-lede { font: 400 26px/1.3 var(--serif); color: var(--cpd-dim); margin: 0; }
html.cpd-rel #single .xr-index .xr-count { font: 400 15px/1.3 var(--sans); letter-spacing: 0; text-transform: none; color: var(--cpd-faint); margin: 0; }
/* the Latest panel: the frame's dark-red still panel. There is no still in the data, so the panel is the gradient alone. */
html.cpd-rel #single .xr-index .xr-latest { position: relative; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; min-height: 340px; padding: 28px; border-radius: 0; color: var(--cpd-ink);
  background: radial-gradient(120% 90% at 85% 10%, rgba(215, 38, 61, .35), transparent 60%), linear-gradient(180deg, #2A0C10 0%, #160709 100%) !important; border: 0; box-shadow: none; overflow: hidden; }
html.cpd-rel #single .xr-index .xr-latest * { color: inherit; }
html.cpd-rel #single .xr-index .xr-latest .xr-latest-top { display: none; }
html.cpd-rel #single .xr-index .xr-latest .cpr-lk { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--cpd-redt); }
html.cpd-rel #single .xr-index .xr-latest .xr-latest-b { display: flex; flex-direction: column; gap: 10px; }
html.cpd-rel #single .xr-index .xr-latest .xr-latest-b > small { display: none; }
html.cpd-rel #single .xr-index .xr-latest .xr-latest-b > b { font: 400 36px/1.05 var(--serif); color: var(--cpd-ink); }
html.cpd-rel #single .xr-index .xr-latest .xr-latest-d { display: none; }
html.cpd-rel #single .xr-index .xr-latest .cpr-ld { font: 400 15px/1.2 var(--sans); color: var(--cpd-dim); }
html.cpd-rel #single .xr-index .xr-latest .xr-btn { position: absolute; inset: 0; z-index: 2; font-size: 0; color: transparent; background: none; padding: 0; border: 0; border-radius: 0; }
html.cpd-rel #single .xr-index .xr-latest:hover .xr-latest-b > b { text-decoration: underline; text-underline-offset: 5px; text-decoration-thickness: 1px; }
html.cpd-rel #single .xr-index .xr-latest .xr-btn:focus-visible { outline: 2px solid #fff; outline-offset: -4px; }
html.cpd-rel #single .xr-index .xr-latest .xr-btn svg { display: none; }
html.cpd-rel #single .xr-index .xr-latest-k, html.cpd-rel #single .xr-index .xr-latest-dt { display: none; }
/* filters */
html.cpd-rel #single .xr-index .xr-filters { display: flex; align-items: center; gap: 10px 24px; flex-wrap: wrap; padding: 14px var(--cpd-pad); margin: 0; border-top: 1px solid var(--cpd-rule); border-bottom: 1px solid var(--cpd-rule); background: none; position: static; }
html.cpd-rel #single .xr-index .xr-filters > .xr-k { display: none; }
html.cpd-rel #single .xr-index .xr-chips { display: flex; flex-wrap: wrap; gap: 8px; }
html.cpd-rel #single .xr-index .xr-chip { font: 500 15px/1.2 var(--sans); padding: 8px 16px; border-radius: 999px; border: 1px solid var(--cpd-rule); color: var(--cpd-dim); background: transparent; box-shadow: none; text-transform: none; letter-spacing: 0; }
html.cpd-rel #single .xr-index .xr-chip:hover { color: var(--cpd-ink); border-color: var(--cpd-faint); }
html.cpd-rel #single .xr-index .xr-chip[aria-pressed="true"] { background: var(--cpd-ink); color: var(--cpd-bg); border-color: var(--cpd-ink); }
html.cpd-rel #single .xr-index .xr-chip .xr-c { font-size: var(--cpd-floor); opacity: .7; margin-left: 2px; }
html.cpd-rel #single .xr-index .xr-sel { color: var(--cpd-dim); }
html.cpd-rel #single .xr-index .xr-sel .xr-k { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: .12em; color: var(--cpd-faint); }
html.cpd-rel #single .xr-index .xr-sel select { font: 500 15px/1.2 var(--sans); color: var(--cpd-ink); background: transparent; border: 1px solid var(--cpd-rule); border-radius: 999px; padding: 8px 34px 8px 14px; }
html.cpd-rel #single .xr-index .xr-sel select option { background: var(--cpd-panel); color: var(--cpd-ink); }
html.cpd-rel #single .xr-index .xr-makers, html.cpd-rel #single .xr-index .xr-rail { display: none; }
/* the list becomes the frame's card grid; the type tile from x-releases is the picture (no maker picture in the data) */
html.cpd-rel #single .xr-index .xr-body { display: block; padding: 40px var(--cpd-pad) 80px; margin: 0; }
html.cpd-rel #single .xr-index .xr-main { max-width: none; }
html.cpd-rel #single .xr-index ol.xr-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 40px 32px; margin: 0; padding: 0; list-style: none; border: 0; }
html.cpd-rel #single .xr-index .xr-month { grid-column: 1 / -1; display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 0 0 12px; margin: 0; border: 0; border-bottom: 1px solid var(--cpd-ink); background: none; position: static; }
html.cpd-rel #single .xr-index .xr-month:not(:first-child) { margin-top: 16px; }
html.cpd-rel #single .xr-index .xr-month h2 { font: 400 48px/1.1 var(--serif); color: var(--cpd-ink); margin: 0; text-transform: none; letter-spacing: 0; }
html.cpd-rel #single .xr-index .xr-month small { font: 400 15px/1.2 var(--sans); color: var(--cpd-faint); text-transform: none; letter-spacing: 0; }
html.cpd-rel #single .xr-index .xr-month small .xr-n-p { display: none; }
html.cpd-rel #single .xr-index .xr-month.xr-dim { opacity: .55; }
html.cpd-rel #single .xr-index .xr-row { margin: 0; padding: 0; border: 0; background: none; min-width: 0; }
html.cpd-rel #single .xr-index .xr-row-a { display: flex; flex-direction: column; gap: 14px; height: 100%; padding: 0; border: 0; background: none; color: var(--cpd-ink); text-decoration: none; }
html.cpd-rel #single .xr-index .xr-row-a > .xr-date, html.cpd-rel #single .xr-index .xr-row-a > .xr-go,
html.cpd-rel #single .xr-index .xr-row .xr-meta, html.cpd-rel #single .xr-index .xr-row .xr-pm, html.cpd-rel #single .xr-index .xr-row .xr-src-p { display: none; }
html.cpd-rel #single .xr-index .xr-row .xr-tile { display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; width: 100%; height: auto; aspect-ratio: 437 / 260; padding: 18px 20px; margin: 0; border-radius: 0; }
html.cpd-rel #single .xr-index .xr-row .xr-tile small { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; opacity: .85; }
html.cpd-rel #single .xr-index .xr-row .xr-tile b { font: 400 clamp(30px, 2.6vw, 44px)/1 var(--serif); }
/* the picture slot: no maker picture in the data, so the tile x-releases draws, set dark as the frame's stills sit */
html.cpd-rel #single .xr-row .xr-tile, html.cpd-relp #single .xr-card .xr-tile { background: radial-gradient(90% 120% at 100% 0%, rgba(215, 38, 61, .28), transparent 60%), linear-gradient(160deg, #26262A, #161618) !important; color: var(--cpd-ink) !important; }
html.cpd-rel #single .xr-row .xr-tile small, html.cpd-relp #single .xr-card .xr-tile small { display: block; color: var(--cpd-redt); }
html.cpd-rel #single .xr-row .xr-tile::before, html.cpd-relp #single .xr-card .xr-tile::before { background: var(--cpd-red); left: 20px; top: 18px; }
html.cpd-rel #single .xr-index .xr-row .xr-text { display: flex; flex-direction: column; gap: 14px; min-width: 0; padding: 0; }
html.cpd-rel #single .xr-index .xr-row .cpr-kind { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
html.cpd-rel #single .xr-index .xr-row .cpr-kind i { font: 700 var(--cpd-floor)/1.2 var(--sans); font-style: normal; letter-spacing: 2px; text-transform: uppercase; color: var(--cpd-redt); }
html.cpd-rel #single .xr-index .xr-row .cpr-kind b { font: 600 15px/1.2 var(--sans); color: var(--cpd-dim); }
html.cpd-rel #single .xr-index .xr-row .cpr-kind small { font: 400 15px/1.2 var(--sans); color: var(--cpd-faint); }
html.cpd-rel #single .xr-index .xr-row .cpr-kind .cpr-feat { color: var(--cpd-ink); font-weight: 600; letter-spacing: 0; text-transform: none; }
html.cpd-rel #single .xr-index .xr-row .xr-t { font: 400 30px/1.06 var(--serif); letter-spacing: 0; color: var(--cpd-ink); }
html.cpd-rel #single .xr-index .xr-row .xr-line { font: 400 19px/1.4 var(--serif); color: var(--cpd-dim); -webkit-line-clamp: 3; }
html.cpd-rel #single .xr-index .xr-row .xr-line.xr-q::before, html.cpd-rel #single .xr-index .xr-row .xr-line.xr-q::after { content: none; }
html.cpd-rel #single .xr-index .xr-row-a:hover .xr-t { color: var(--cpd-redt); }
html.cpd-rel #single .xr-index .xr-row-a:focus-visible { outline: 2px solid var(--cpd-redt); outline-offset: 6px; }
html.cpd-rel #single .xr-index .xr-empty { grid-column: 1 / -1; font: italic 400 24px/1.3 var(--serif); color: var(--cpd-dim); }
html.cpd-rel #single .xr-index .xr-next, html.cpd-rel #single .xr-index #xr-next { display: flex; margin: 40px auto 0; font: 600 15px/1.2 var(--sans); padding: 16px 32px; border-radius: 999px; border: 1px solid var(--cpd-ink); color: var(--cpd-ink); background: none; }
html.cpd-rel #single .xr-index .xr-next[hidden], html.cpd-rel #single .xr-index #xr-next[hidden] { display: none; }
@media (max-width: 1023px) { html.cpd-rel #single .xr-index .xr-hero { grid-template-columns: minmax(0, 1fr); gap: 32px; } html.cpd-rel #single .xr-index .xr-latest { min-height: 260px; } }
@media (max-width: 767px) {
  html.cpd-rel #single .xr-index .xr-hero { padding: 28px var(--cpd-pad) 20px; gap: 24px; }
  html.cpd-rel #single .xr-index .xr-lede { font-size: 19.5px; }
  html.cpd-rel #single .xr-index .xr-latest { min-height: 0; padding: 20px; }
  html.cpd-rel #single .xr-index .xr-latest .xr-latest-b > b { font-size: 28px; }
  html.cpd-rel #single .xr-index .xr-filters { border: 0; padding: 0 var(--cpd-pad) 16px; }
  html.cpd-rel #single .xr-index .xr-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 calc(-1 * var(--cpd-pad)); padding: 0 var(--cpd-pad); width: calc(100% + 2 * var(--cpd-pad)); }
  html.cpd-rel #single .xr-index .xr-chips::-webkit-scrollbar { display: none; }
  html.cpd-rel #single .xr-index .xr-chip { font-size: var(--cpd-floor); padding: 7px 13px; white-space: nowrap; }
  html.cpd-rel #single .xr-index .xr-body { padding: 8px var(--cpd-pad) 40px; }
  html.cpd-rel #single .xr-index ol.xr-list { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  html.cpd-rel #single .xr-index .xr-month h2 { font-size: 36px; }
  html.cpd-rel #single .xr-index .xr-row .xr-tile { aspect-ratio: 358 / 210; }
  html.cpd-rel #single .xr-index .xr-row .xr-t { font-size: 27px; }
}

/* ============================================================ release page (O3kVpk), over x-releases.css */
html.cpd-relp main#single.xpage-releases { padding-top: var(--cp-bar, 64px); }
html.cpd-relp #single .xr.xr-page { padding: 0; margin: 0; max-width: none; }
html.cpd-relp #single .xr-page > .xr-crumb { margin-bottom: 12px !important; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 48px var(--cpd-pad) 0; margin: 0; font: 400 15px/1.2 var(--sans); }
html.cpd-relp #single .xr-page > .xr-crumb .xr-back { display: none; }
html.cpd-relp #single .xr-page > .xr-crumb a { color: var(--cpd-redt); text-decoration: none; }
html.cpd-relp #single .xr-page > .xr-crumb a:hover { text-decoration: underline; text-underline-offset: 3px; }
html.cpd-relp #single .xr-page > .xr-crumb .xr-cr-d { display: inline-flex; gap: 10px; }
html.cpd-relp #single .xr-page > .xr-crumb i { font-style: normal; color: var(--cpd-faint); }
html.cpd-relp #single .xr-page > .xr-crumb .xr-cr-b { color: var(--cpd-dim); }
html.cpd-relp #single .cpr-head { display: flex; flex-direction: column; gap: 20px; padding: 20px var(--cpd-pad) 36px; }
html.cpd-relp #single .cpr-kick { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
html.cpd-relp #single .cpr-kick b { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: 2.5px; text-transform: uppercase; color: var(--cpd-redt); }
html.cpd-relp #single .cpr-kick span { font: 400 15px/1.2 var(--sans); color: var(--cpd-dim); }
html.cpd-relp #single .xr .xr-h1p, html.cpd-relp #single .xr-h1p { font: 400 clamp(44px, 6.1vw, 120px)/.98 var(--serif); letter-spacing: -1px; color: var(--cpd-ink); margin: 0; max-width: 24ch; }
html.cpd-relp #single .xr-page .xr-tags { display: none; }
html.cpd-relp #single .xr-page .xr-main-p { display: contents; }
html.cpd-relp #single .xr-page.cpr-has-video .xr-sleeve { display: none; }
html.cpd-relp #single .xr-page .xr-sleeve { margin: 0 var(--cpd-pad) 40px; }
/* the player: full width, 16:9, nothing from YouTube until the click */
html.cpd-relp #single .xr-page .xr-video { padding: 0 var(--cpd-pad); margin: 0; border: 0; }
html.cpd-relp #single .xr-page .xr-video .xr-sec-h { display: none; }
html.cpd-relp #single .xr-page .xr-player { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; aspect-ratio: 16 / 9; width: 100%; max-height: calc(100vh - var(--cp-bar, 64px) - 40px); margin: 0; padding: 24px; border-radius: 0; text-align: center;
  background: radial-gradient(80% 80% at 50% 45%, #232327, #121214 70%); border: 0; }
html.cpd-relp #single .xr-page .xr-player .xr-play { width: 96px; height: 96px; border-radius: 50%; background: var(--cpd-red); color: #fff; border: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; padding: 0; }
html.cpd-relp #single .xr-page .xr-player .xr-play:hover { background: #b81f33; }
html.cpd-relp #single .xr-page .xr-player .xr-play svg { width: 40px; height: 40px; fill: #fff; stroke: none; margin-left: 4px; }
html.cpd-relp #single .xr-page .xr-player .xr-play-l { font: 600 17.5px/1.2 var(--sans); color: var(--cpd-ink); }
html.cpd-relp #single .xr-page .xr-player .xr-play-l .xr-n-p { display: none; }
html.cpd-relp #single .xr-page .xr-player .xr-legal { font: 400 15px/1.45 var(--sans); color: var(--cpd-dim); max-width: 60ch; }
html.cpd-relp #single .xr-page .xr-player .xr-legal a { color: var(--cpd-ink); text-decoration: underline; text-underline-offset: 2px; }
html.cpd-relp #single .xr-page .xr-player.on { padding: 0; background: #000; }
html.cpd-relp #single .xr-page .xr-player.on iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
html.cpd-relp #single .xr-page .xr-player .xr-play:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
/* brief and facts */
html.cpd-relp #single .cpr-body { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 520px); gap: 80px; padding: 56px var(--cpd-pad) 80px; }
html.cpd-relp #single .cpr-brief { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
html.cpd-relp #single .xr-page .xr-brief { font: 400 30px/1.35 var(--serif); color: var(--cpd-ink); margin: 0; max-width: 34em; }
html.cpd-relp #single .xr-page .xr-links { display: flex; flex-direction: row; align-items: flex-start; flex-wrap: wrap; gap: 12px; margin: 0; }   /* audit 2026-10-16: x-releases sets a column, which stretched the button across the brief; O3kVpk sizes it to its label */
html.cpd-relp #single .xr-page .xr-links .xr-btn { flex: none; width: auto; display: inline-flex; align-items: center; gap: 10px; padding: 16px 26px; font: 600 17.5px/1.2 var(--sans); background: var(--cpd-red); color: #fff; border: 0; border-radius: 0; text-decoration: none; }
html.cpd-relp #single .xr-page .xr-links .xr-btn:hover { background: #b81f33; }
html.cpd-relp #single .xr-page .xr-links .xr-btn.xr-kit { background: none; border: 1px solid var(--cpd-ink); color: var(--cpd-ink); }
html.cpd-relp #single .xr-page .xr-links .xr-btn svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; }
html.cpd-relp #single .cpr-src { display: flex; flex-direction: column; gap: 8px; padding-top: 24px; border-top: 1px solid var(--cpd-rule); max-width: 46em; }
html.cpd-relp #single .cpr-src .xr-note { font: 400 15px/1.45 var(--sans); color: var(--cpd-faint); margin: 0; }
html.cpd-relp #single .xr-page .xr-facts { margin: 0; padding: 0; border: 0; }
html.cpd-relp #single .xr-page .xr-facts > h2 { display: none; }
html.cpd-relp #single .xr-page .xr-facts dl { display: flex; flex-direction: column; margin: 0; }
html.cpd-relp #single .xr-page .xr-fact { display: flex; flex-direction: column; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--cpd-rule); margin: 0; }
html.cpd-relp #single .xr-page .xr-fact dt { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--cpd-dim); }
html.cpd-relp #single .xr-page .xr-fact dd { font: 400 22px/1.25 var(--serif); color: var(--cpd-ink); margin: 0; }
/* more from the maker: cards with the type tile as picture */
html.cpd-relp #single .xr-page .xr-morefrom { padding: 56px var(--cpd-pad) 80px; margin: 0; border-top: 1px solid var(--cpd-rule); }
html.cpd-relp #single .xr-page .xr-mf-h { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 0 12px; }
html.cpd-relp #single .xr-page .xr-mf-h h2 { font: 400 48px/1.05 var(--serif); color: var(--cpd-ink); margin: 0; }
html.cpd-relp #single .xr-page .xr-mf-h h2 .xr-n-d { display: none; }
html.cpd-relp #single .xr-page .xr-mf-h h2 .xr-n-p { display: inline; }
html.cpd-relp #single .xr-page .xr-mf-h a { font: 600 15px/1.2 var(--sans); letter-spacing: 0; text-transform: none; color: var(--cpd-ink); text-decoration: none; }
html.cpd-relp #single .xr-page .xr-mf-h a:hover { color: var(--cpd-redt); }
html.cpd-relp #single .xr-page .xr-more-note { font: italic 400 22px/1.3 var(--serif); color: var(--cpd-dim); margin: 0 0 28px; }
@media (min-width: 768px) { html.cpd-relp #single .xr-page .xr-more-note .xr-n-p { display: none; } }
@media (max-width: 767px) { html.cpd-relp #single .xr-page .xr-more-note .xr-n-d { display: none; } html.cpd-relp #single .xr-page .xr-more-note .xr-n-p { display: inline; } html.cpd-relp #single .xr-page .xr-mf-h { flex-direction: column; align-items: flex-start; text-align: left; } }
html.cpd-relp #single .xr-page .xr-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 32px; }
html.cpd-relp #single .xr-page .xr-card { display: flex; flex-direction: column; gap: 12px; color: var(--cpd-ink); text-decoration: none; background: none; border: 0; padding: 0; }
html.cpd-relp #single .xr-page .xr-card .xr-tile { width: 100%; aspect-ratio: 437 / 260; height: auto; display: flex; flex-direction: column; justify-content: flex-end; gap: 4px; padding: 18px 20px; border-radius: 0; margin: 0; }
html.cpd-relp #single .xr-page .xr-card .xr-tile small { font: 700 var(--cpd-floor)/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; }
html.cpd-relp #single .xr-page .xr-card .xr-tile b { font: 400 clamp(28px, 2.4vw, 40px)/1 var(--serif); }
html.cpd-relp #single .xr-page .xr-card-t { font: 400 27px/1.1 var(--serif); color: var(--cpd-ink); }
html.cpd-relp #single .xr-page .xr-card .xr-k { font: 600 15px/1.2 var(--sans); letter-spacing: 0; text-transform: none; color: var(--cpd-dim); }
html.cpd-relp #single .xr-page .xr-card:hover .xr-card-t { color: var(--cpd-redt); }
@media (max-width: 1023px) { html.cpd-relp #single .cpr-body { grid-template-columns: minmax(0, 1fr); gap: 40px; } }
@media (max-width: 767px) {
  html.cpd-relp #single .xr-page > .xr-crumb { padding-top: 24px; }
  html.cpd-relp #single .cpr-head { padding: 14px var(--cpd-pad) 24px; gap: 14px; }
  html.cpd-relp #single .xr-page .xr-player { aspect-ratio: 4 / 3; }
  html.cpd-relp #single .xr-page .xr-player .xr-play { width: 72px; height: 72px; }
  html.cpd-relp #single .xr-page .xr-player .xr-play svg { width: 30px; height: 30px; }
  html.cpd-relp #single .cpr-body { padding: 32px var(--cpd-pad) 48px; }
  html.cpd-relp #single .xr-page .xr-brief { font-size: 22px; }
  html.cpd-relp #single .xr-page .xr-links .xr-btn { width: 100%; justify-content: center; }
  html.cpd-relp #single .xr-page .xr-morefrom { padding: 32px var(--cpd-pad) 48px; }
  html.cpd-relp #single .xr-page .xr-mf-h h2 { font-size: 36px; }
  html.cpd-relp #single .xr-page .xr-cards { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 calc(-1 * var(--cpd-pad)); padding: 0 var(--cpd-pad); gap: 16px; }
  html.cpd-relp #single .xr-page .xr-cards::-webkit-scrollbar { display: none; }
  html.cpd-relp #single .xr-page .xr-card { flex: 0 0 82%; scroll-snap-align: start; }
}
@media (prefers-reduced-motion: reduce) { html.cpd * { transition: none !important; } }

/* Cinepuuulse redesign, stage 3, slice G (2026-10-13): the Cinema SI section (/cinema-si/), generated by engine/cinemasi.py.
   Pencil file cine.pen, frames DiVxW (section home), CZSZH (all films), AIQCR (film page), KwHTT and CxS9r (390). The frames
   say "Latent Image"; the owner named the section Cinema SI the same day, so only the name differs.
   Every rule sits under main#single.xpage-cinema-si (the wrapper build.py gives the step's pages), so no other page changes.
   Deliberate differences from the frames, all owner rules or earlier slices' decisions:
   - nothing is set under the 14.6 px floor (the frames' 11/12/13/14 px labels are set at 14.6);
   - the frames' 30 % "faint" ink fails 4.5:1 on #0B0B0C, so faint text uses 55 % ink (as slices B and D did);
   - posters are typographic: the frames' key art is not used (no generated or borrowed film images);
   - the page is fluid: grids add columns as the screen grows; nothing sits in a centred column. */

main#single.xpage-cinema-si {
  --csi-bg: #0B0B0C; --csi-ink: #F2EFE9; --csi-red: #D7263D; --csi-redt: #FF4A5E; --csi-dark: #1A0709;
  --csi-dim: rgba(242, 239, 233, .6); --csi-faint: rgba(242, 239, 233, .55); --csi-rule: rgba(255, 255, 255, .12);
  --csi-panel: #141416; --csi-floor: 14.6px; --csi-pad: 32px;
  display: block; max-width: none !important; width: auto; margin: 0 !important; padding: var(--cp-bar, 64px) 0 0 !important;
  background: var(--csi-bg); color: var(--csi-ink); font-family: var(--sans); font-weight: 400; overflow-x: clip;
}
@media (max-width: 767px) { main#single.xpage-cinema-si { --csi-pad: 16px; } }
main#single.xpage-cinema-si *, main#single.xpage-cinema-si *::before, main#single.xpage-cinema-si *::after { box-sizing: border-box; }
main#single.xpage-cinema-si > .crumb, main#single.xpage-cinema-si > nav.crumbs { display: none; }
.xpage-cinema-si .csi a { color: inherit; text-decoration: none; }
.xpage-cinema-si .csi a:focus-visible, .xpage-cinema-si .csi button:focus-visible { outline: 2px solid var(--csi-redt); outline-offset: 3px; }
.xpage-cinema-si .csi p, .xpage-cinema-si .csi h1, .xpage-cinema-si .csi h2, .xpage-cinema-si .csi ul, .xpage-cinema-si .csi dl, .xpage-cinema-si .csi dd { margin: 0; }
.xpage-cinema-si .csi ul { padding: 0; list-style: none; }
.xpage-cinema-si .csi-ar { width: 18px; height: 18px; flex: none; }
.xpage-cinema-si .csi-k { font: 700 var(--csi-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--csi-dim); }

/* ------------------------------------------------------------ section nav (60 px, the frame's #1A0709 band) */
.xpage-cinema-si .csi-nav { display: flex; align-items: center; gap: 36px; min-height: 60px; padding: 0 var(--csi-pad); background: var(--csi-dark);
  border-bottom: 1px solid rgba(215, 38, 61, .35); }
.xpage-cinema-si .csi-brand { font: italic 400 26px/1.3 var(--serif); color: var(--csi-ink); white-space: nowrap; }
.xpage-cinema-si .csi-tabs { display: flex; gap: 36px; align-items: center; overflow-x: auto; scrollbar-width: none; }
.xpage-cinema-si .csi-tabs::-webkit-scrollbar { display: none; }
.xpage-cinema-si .csi-tabs a { font: 400 15px/1.2 var(--sans); color: var(--csi-dim); white-space: nowrap; padding: 21px 0 19px; border-bottom: 2px solid transparent; }
.xpage-cinema-si .csi-tabs a:hover { color: var(--csi-ink); }
.xpage-cinema-si .csi-tabs a[aria-current="page"] { color: var(--csi-ink); font-weight: 600; border-bottom-color: var(--csi-red); }

/* ------------------------------------------------------------ typographic posters (the safelight, grain, laurel, title) */
.xpage-cinema-si .csi-poster { position: relative; display: flex; flex-direction: column; justify-content: space-between; aspect-ratio: 2 / 3;
  padding: 16px 16px 22px; overflow: hidden; color: #fff; isolation: isolate; min-width: 0;
  background: radial-gradient(110% 75% at var(--csi-x, 50%) var(--csi-y, 32%), #E0324A 0%, #B3182E 38%, #5C0F1B 72%, #2A0C10 100%); }
.xpage-cinema-si .csi-poster::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .22; mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.xpage-cinema-si .csi-poster::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg, rgba(11,11,12,.6) 0%, rgba(11,11,12,0) 25%, rgba(11,11,12,0) 50%, rgba(11,11,12,.94) 100%); }
.xpage-cinema-si .csi-ptop { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; }
.xpage-cinema-si .csi-laurel { font: 700 var(--csi-floor)/1.35 var(--sans); letter-spacing: 1.2px; text-transform: uppercase; }
.xpage-cinema-si .csi-run { font: 400 20px/1 var(--serif); white-space: nowrap; }
.xpage-cinema-si .csi-bill { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.xpage-cinema-si .csi-pt { font: italic 400 32px/.95 var(--serif); letter-spacing: -.4px; overflow-wrap: anywhere; }
.xpage-cinema-si .csi-by { font: 600 var(--csi-floor)/1.3 var(--sans); letter-spacing: 1.5px; text-transform: uppercase; color: rgba(255,255,255,.92); }
.xpage-cinema-si .csi-rule { width: 32px; height: 1px; background: rgba(255,255,255,.5); }
.xpage-cinema-si .csi-with { font: 400 var(--csi-floor)/1.35 var(--sans); color: rgba(255,255,255,.9); }
.xpage-cinema-si a.csi-poster:hover .csi-pt { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 6px; }
.xpage-cinema-si .csi-poster.csi-big { padding: 30px 32px 38px; }
.xpage-cinema-si .csi-big .csi-laurel { letter-spacing: 2.5px; }
.xpage-cinema-si .csi-big .csi-run { font-size: 30px; }
.xpage-cinema-si .csi-big .csi-bill { gap: 14px; }
.xpage-cinema-si .csi-big .csi-pt { font-size: clamp(56px, 5.3vw, 104px); letter-spacing: -1.5px; }
.xpage-cinema-si .csi-big .csi-by { letter-spacing: 3px; }
.xpage-cinema-si .csi-big .csi-rule { width: 60px; }

/* ------------------------------------------------------------ section scaffolding */
.xpage-cinema-si .csi-sec { display: flex; flex-direction: column; gap: 28px; padding: 72px var(--csi-pad); border-top: 1px solid var(--csi-rule); }
.xpage-cinema-si .csi-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; }
.xpage-cinema-si .csi-titles { display: flex; flex-direction: column; gap: 8px; }
.xpage-cinema-si .csi-h { font: 400 64px/1 var(--serif); letter-spacing: -.5px; color: var(--csi-ink); }
.xpage-cinema-si .csi-sub { font: italic 400 24px/1.3 var(--serif); color: var(--csi-dim); }
.xpage-cinema-si .csi-sub:empty { display: none; }
.xpage-cinema-si .csi-more { display: inline-flex; align-items: center; gap: 8px; font: 600 15px/1.2 var(--sans); color: var(--csi-ink); white-space: nowrap; }
.xpage-cinema-si .csi-more:hover { color: var(--csi-redt); }
.xpage-cinema-si .csi-phead { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 64px; flex-wrap: wrap; padding: 48px var(--csi-pad) 28px; }
.xpage-cinema-si .csi-ph { font: italic 400 112px/.92 var(--serif); letter-spacing: -2px; }
.xpage-cinema-si .csi-pdek { font: 400 22px/1.35 var(--serif); color: var(--csi-dim); max-width: 34em; }
.xpage-cinema-si .csi-pad { padding: 0 var(--csi-pad) 28px; }
.xpage-cinema-si .csi-btn, .xpage-cinema-si .csi-btn2 { display: inline-flex; align-items: center; gap: 10px; padding: 16px 26px; font: 600 16px/1.2 var(--sans); }
.xpage-cinema-si .csi-btn { background: var(--csi-red); color: #fff; }
.xpage-cinema-si .csi-btn:hover { background: #B81E33; }
.xpage-cinema-si .csi-btn2 { border: 1px solid var(--csi-ink); color: var(--csi-ink); padding: 15px 25px; }
.xpage-cinema-si .csi-btn2:hover { background: var(--csi-ink); color: var(--csi-bg); }
.xpage-cinema-si .csi-out { display: inline-flex; align-items: center; gap: 8px; font: 600 15px/1.2 var(--sans); color: var(--csi-ink); white-space: nowrap; }
.xpage-cinema-si .csi-out:hover { color: var(--csi-redt); }
.xpage-cinema-si .csi-note { font: italic 400 19px/1.35 var(--serif); color: var(--csi-dim); }
.xpage-cinema-si .csi-src { display: flex; flex-direction: column; gap: 8px; }
.xpage-cinema-si .csi-src li { font: 400 15px/1.45 var(--sans); color: var(--csi-faint); }
.xpage-cinema-si .csi-src a { color: var(--csi-dim); text-decoration: underline; text-decoration-color: var(--csi-rule); text-underline-offset: 3px; }
.xpage-cinema-si .csi-src a:hover { color: var(--csi-ink); }

/* ------------------------------------------------------------ section home (DiVxW) */
.xpage-cinema-si .csi-lead { display: grid; grid-template-columns: minmax(0, 1fr) clamp(360px, 34.7vw, 720px); gap: 56px; align-items: end;
  padding: 64px var(--csi-pad) 72px; background: linear-gradient(180deg, var(--csi-dark) 0%, var(--csi-bg) 100%); }
.xpage-cinema-si .csi-copy { display: flex; flex-direction: column; gap: 26px; align-items: flex-start; max-width: 60em; }
.xpage-cinema-si .csi-kick { display: flex; align-items: center; gap: 10px; font: 700 var(--csi-floor)/1.2 var(--sans); letter-spacing: 2.5px; text-transform: uppercase; color: var(--csi-redt); }
.xpage-cinema-si .csi-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--csi-red); flex: none; }
.xpage-cinema-si .csi-lh { font: italic 400 clamp(56px, 5.84vw, 112px)/.98 var(--serif); letter-spacing: -1px; }
.xpage-cinema-si .csi-ld { font: 400 26px/1.35 var(--serif); color: var(--csi-dim); max-width: 32em; }
.xpage-cinema-si .csi-meta { display: flex; gap: 12px; font: 400 15px/1.2 var(--sans); color: var(--csi-faint); }
.xpage-cinema-si .csi-meta a { font-weight: 700; color: var(--csi-redt); }
.xpage-cinema-si .csi-wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 28px 20px; }
.xpage-cinema-si .csi-wall .csi-poster[hidden] { display: none; }
.xpage-cinema-si .csi-row5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
@media (max-width: 1099px) { .xpage-cinema-si .csi-row5 { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); } }

.xpage-cinema-si .csi-next { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 16px 40px; align-items: center; padding: 28px 32px;
  background: rgba(215, 38, 61, .08); outline: 1px solid rgba(215, 38, 61, .4); outline-offset: -1px; }
.xpage-cinema-si .csi-count { display: flex; flex-direction: column; gap: 2px; }
.xpage-cinema-si .csi-num { font: 400 96px/.9 var(--serif); color: var(--csi-redt); }
.xpage-cinema-si .csi-what { display: flex; flex-direction: column; gap: 6px; }
.xpage-cinema-si .csi-nn { font: 400 44px/1.05 var(--serif); }
.xpage-cinema-si .csi-nw { font: 400 16px/1.4 var(--sans); color: var(--csi-dim); }
.xpage-cinema-si .csi-frows { display: flex; flex-direction: column; }
.xpage-cinema-si .csi-frow { display: grid; grid-template-columns: 150px minmax(0, 584fr) 110px minmax(0, 420fr); gap: 32px; align-items: baseline;
  padding: 20px 8px; border-bottom: 1px solid var(--csi-rule); }
.xpage-cinema-si .csi-frow:hover .csi-fn { color: var(--csi-redt); }
.xpage-cinema-si .csi-fd { font: 600 16px/1.3 var(--sans); color: var(--csi-dim); }
.xpage-cinema-si .csi-fn { font: 400 30px/1.15 var(--serif); }
.xpage-cinema-si .csi-fc { font: 400 15px/1.3 var(--sans); color: var(--csi-dim); }
.xpage-cinema-si .csi-fl { font: italic 400 19px/1.3 var(--serif); }

.xpage-cinema-si .csi-tools { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 16px; }
.xpage-cinema-si .csi-tool { display: flex; flex-direction: column; gap: 12px; padding: 24px; background: var(--csi-panel); border-top: 2px solid var(--csi-red); }
.xpage-cinema-si a.csi-tool:hover .csi-tn { color: var(--csi-redt); }
.xpage-cinema-si .csi-tt { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.xpage-cinema-si .csi-tm { font: 700 var(--csi-floor)/1.2 var(--sans); letter-spacing: 1.5px; text-transform: uppercase; color: var(--csi-redt); }
.xpage-cinema-si .csi-td { font: 400 var(--csi-floor)/1.2 var(--sans); color: var(--csi-faint); }
.xpage-cinema-si .csi-tn { font: 400 44px/1 var(--serif); }
.xpage-cinema-si .csi-tw { font: 400 19px/1.3 var(--serif); color: var(--csi-dim); }
.xpage-cinema-si .csi-gone { border-top-color: var(--csi-rule); }
.xpage-cinema-si .csi-gone .csi-tm, .xpage-cinema-si .csi-gone .csi-tn { color: var(--csi-faint); }

.xpage-cinema-si .csi-timeline { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 24px 22px; }
.xpage-cinema-si .csi-rule-e { position: relative; display: flex; flex-direction: column; gap: 12px; padding-top: 32px; }
.xpage-cinema-si .csi-rule-e::before { content: ""; position: absolute; left: 0; top: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--csi-red); }
.xpage-cinema-si .csi-rule-e::after { content: ""; position: absolute; left: 18px; right: -22px; top: 5.5px; height: 1px; background: var(--csi-rule); }
.xpage-cinema-si .csi-rd { font: 700 var(--csi-floor)/1.2 var(--sans); color: var(--csi-redt); }
.xpage-cinema-si .csi-rw { font: 400 30px/1.1 var(--serif); }
.xpage-cinema-si .csi-rx { font: 400 19px/1.35 var(--serif); color: var(--csi-dim); }
.xpage-cinema-si a.csi-rule-e:hover .csi-rw { color: var(--csi-redt); }

.xpage-cinema-si .csi-wcols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 56px; }
.xpage-cinema-si .csi-wi { display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 20px; padding: 18px 0; border-bottom: 1px solid var(--csi-rule); }
.xpage-cinema-si .csi-wi time { font: 700 var(--csi-floor)/1.6 var(--sans); color: var(--csi-redt); white-space: nowrap; }
.xpage-cinema-si .csi-wi span { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.xpage-cinema-si .csi-wi b { font: 400 24px/1.15 var(--serif); }
.xpage-cinema-si .csi-wi small { font: 400 var(--csi-floor)/1.3 var(--sans); color: var(--csi-faint); }
.xpage-cinema-si .csi-wi:hover b { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }

/* ------------------------------------------------------------ all films (CZSZH) */
.xpage-cinema-si [data-csi="films"] .csi-phead { border-bottom: 1px solid var(--csi-rule); }
.xpage-cinema-si .csi-filters { display: flex; flex-wrap: wrap; gap: 14px 28px; padding: 14px var(--csi-pad); border-bottom: 1px solid var(--csi-rule); }
.xpage-cinema-si .csi-fg { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.xpage-cinema-si .csi-fk { font: 400 var(--csi-floor)/1.2 var(--sans); color: var(--csi-faint); margin-right: 2px; }
.xpage-cinema-si .csi-chip { font: 400 var(--csi-floor)/1.2 var(--sans); color: var(--csi-dim); background: none; border: 1px solid var(--csi-rule); border-radius: 999px; padding: 7px 14px; cursor: pointer; }
.xpage-cinema-si .csi-chip i { font-style: normal; color: var(--csi-faint); margin-left: 4px; }
.xpage-cinema-si .csi-chip:hover { color: var(--csi-ink); border-color: var(--csi-dim); }
.xpage-cinema-si .csi-chip[aria-pressed="true"] { background: var(--csi-ink); border-color: var(--csi-ink); color: var(--csi-bg); }
.xpage-cinema-si .csi-chip[aria-pressed="true"] i { color: rgba(11, 11, 12, .65); }
.xpage-cinema-si .csi-index { padding: 8px var(--csi-pad) 72px; }
.xpage-cinema-si .csi-cols, .xpage-cinema-si .csi-row { display: grid; grid-template-columns: minmax(0, 3.3fr) minmax(0, 2.4fr) minmax(0, 1.3fr) minmax(0, 2.8fr) minmax(0, 3fr); gap: 24px; align-items: center; }
.xpage-cinema-si .csi-cols { padding: 12px 0; font: 700 var(--csi-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--csi-dim); }
.xpage-cinema-si .csi-row { padding: 14px 0; border-bottom: 1px solid var(--csi-rule); font: 400 15px/1.35 var(--sans); }
.xpage-cinema-si .csi-row[hidden] { display: none; }
.xpage-cinema-si .csi-row:hover .csi-rt { color: var(--csi-redt); }
.xpage-cinema-si .csi-c1 { display: flex; align-items: center; gap: 16px; }
.xpage-cinema-si .csi-thumb { flex: none; width: 56px; height: 84px; background: radial-gradient(110% 75% at var(--csi-x, 50%) var(--csi-y, 32%), #E0324A 0%, #B3182E 38%, #5C0F1B 72%, #2A0C10 100%); }
.xpage-cinema-si .csi-rt { font: italic 400 30px/1.05 var(--serif); }
.xpage-cinema-si .csi-c2, .xpage-cinema-si .csi-c5 { color: var(--csi-dim); }
.xpage-cinema-si .csi-none { color: var(--csi-faint) !important; }
.xpage-cinema-si .csi-lab { display: none; }
.xpage-cinema-si .csi-posters { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 28px 20px; padding: 24px 0; }
.xpage-cinema-si .csi-posters[hidden], .xpage-cinema-si .csi-rows[hidden] { display: none; }
.xpage-cinema-si .csi-posters .csi-poster[hidden] { display: none; }
.xpage-cinema-si .csi-showing { padding-top: 16px; font: 400 var(--csi-floor)/1.4 var(--sans); color: var(--csi-faint); }
.xpage-cinema-si .csi-view, .xpage-cinema-si .csi-reset { font: inherit; color: var(--csi-dim); background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.xpage-cinema-si .csi-view[aria-pressed="true"] { color: var(--csi-ink); text-decoration: none; }
.xpage-cinema-si .csi-empty { padding: 32px 0; font: italic 400 24px/1.3 var(--serif); color: var(--csi-dim); }

/* ------------------------------------------------------------ film page (AIQCR) */
.xpage-cinema-si .csi-film { display: grid; grid-template-columns: clamp(320px, 33.3vw, 640px) minmax(0, 1fr); gap: 72px; align-items: start;
  padding: 64px var(--csi-pad) 80px; background: linear-gradient(180deg, var(--csi-dark) 0%, var(--csi-bg) 60%); }
.xpage-cinema-si .csi-film > .csi-poster { position: sticky; top: calc(var(--cp-bar, 64px) + 24px); }
.xpage-cinema-si .csi-film .csi-big .csi-pt { font-size: clamp(52px, 4.7vw, 92px); }
.xpage-cinema-si .csi-info { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.xpage-cinema-si .csi-crumbs { display: flex; gap: 10px; font: 400 15px/1.2 var(--sans); color: var(--csi-dim); }
.xpage-cinema-si .csi-crumbs span[aria-hidden] { color: var(--csi-faint); }
.xpage-cinema-si .csi-crumbs [aria-current] { font-weight: 600; color: var(--csi-redt); }
.xpage-cinema-si .csi-ft { font: italic 400 clamp(64px, 6.67vw, 128px)/.95 var(--serif); letter-spacing: -2px; overflow-wrap: anywhere; }
.xpage-cinema-si .csi-fby { font: 400 34px/1.15 var(--serif); color: var(--csi-dim); margin-top: -8px; }
.xpage-cinema-si .csi-award { display: flex; gap: 16px; align-items: flex-start; padding: 18px 22px; background: rgba(215, 38, 61, .1); outline: 1px solid rgba(215, 38, 61, .4); outline-offset: -1px; }
.xpage-cinema-si .csi-aw { width: 30px; height: 30px; color: var(--csi-redt); flex: none; margin-top: 2px; }
.xpage-cinema-si .csi-awt { font: 400 26px/1.2 var(--serif); }
.xpage-cinema-si .csi-awn { font: 400 15px/1.4 var(--sans); color: var(--csi-dim); margin-top: 2px; }
.xpage-cinema-si .csi-about { font: 400 24px/1.4 var(--serif); color: var(--csi-ink); max-width: 36em; }
.xpage-cinema-si .csi-facts { display: flex; flex-direction: column; }
.xpage-cinema-si .csi-fact { display: grid; grid-template-columns: minmax(140px, 200px) minmax(0, 1fr); gap: 24px; padding: 16px 0; border-bottom: 1px solid var(--csi-rule); }
.xpage-cinema-si .csi-fact dt { font: 700 var(--csi-floor)/1.5 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--csi-dim); padding-top: 3px; }
.xpage-cinema-si .csi-fact dd { font: 400 22px/1.3 var(--serif); }
.xpage-cinema-si .csi-fact dd.csi-none { font-style: italic; }
.xpage-cinema-si .csi-btns { display: flex; gap: 14px; flex-wrap: wrap; }
.xpage-cinema-si .csi-more-films { padding-bottom: 88px; }
.xpage-cinema-si .csi-more-films .csi-h { font-size: 56px; }

/* ------------------------------------------------------------ festivals, tools, rules, wire (the section frames' patterns, full lists) */
.xpage-cinema-si .csi-fests { display: flex; flex-direction: column; padding: 0 var(--csi-pad) 24px; }
.xpage-cinema-si .csi-fest { display: grid; grid-template-columns: minmax(180px, 260px) minmax(0, 1fr); gap: 16px 32px; padding: 32px 0; border-bottom: 1px solid var(--csi-rule); scroll-margin-top: calc(var(--cp-bar, 64px) + 16px); }
.xpage-cinema-si .csi-fwhen { display: flex; flex-direction: column; gap: 6px; }
.xpage-cinema-si .csi-fbody { display: flex; flex-direction: column; gap: 14px; align-items: flex-start; max-width: 64em; }
.xpage-cinema-si .csi-fname { font: 400 40px/1.1 var(--serif); }
.xpage-cinema-si .csi-fwhat { font: 400 22px/1.4 var(--serif); color: var(--csi-dim); }
.xpage-cinema-si .csi-win { display: flex; flex-direction: column; gap: 6px; }
.xpage-cinema-si .csi-win li { display: flex; gap: 12px; flex-wrap: wrap; align-items: baseline; font: italic 400 22px/1.3 var(--serif); }
.xpage-cinema-si .csi-win li span { font: 700 var(--csi-floor)/1.2 var(--sans); letter-spacing: 1.5px; text-transform: uppercase; font-style: normal; color: var(--csi-redt); }
.xpage-cinema-si .csi-win a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.xpage-cinema-si .csi-win b { font-weight: 400; }
.xpage-cinema-si .csi-est { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.xpage-cinema-si .csi-est a { display: flex; flex-direction: column; gap: 8px; padding: 24px; background: var(--csi-panel); height: 100%; }
.xpage-cinema-si .csi-est b { font: 400 28px/1.15 var(--serif); }
.xpage-cinema-si .csi-est span { font: 400 19px/1.35 var(--serif); color: var(--csi-dim); }
.xpage-cinema-si .csi-est a:hover b { color: var(--csi-redt); }
.xpage-cinema-si .csi-tools-all { padding: 0 var(--csi-pad) 72px; }
.xpage-cinema-si .csi-tools-all .csi-tool { scroll-margin-top: calc(var(--cp-bar, 64px) + 16px); }
.xpage-cinema-si .csi-namedlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(420px, 1fr)); gap: 0 56px; }
.xpage-cinema-si .csi-named { display: grid; grid-template-columns: minmax(120px, 200px) minmax(0, 1fr); gap: 20px; padding: 16px 0; border-bottom: 1px solid var(--csi-rule); }
.xpage-cinema-si .csi-nt { font: 400 26px/1.15 var(--serif); }
.xpage-cinema-si .csi-nf { font: italic 400 21px/1.35 var(--serif); }
.xpage-cinema-si .csi-nf a { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.xpage-cinema-si .csi-nf small { font: 400 var(--csi-floor)/1.3 var(--sans); font-style: normal; color: var(--csi-faint); }
.xpage-cinema-si .csi-tl-all { grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 48px 22px; padding: 16px var(--csi-pad) 72px; }
.xpage-cinema-si .csi-tl-all .csi-rule-e { scroll-margin-top: calc(var(--cp-bar, 64px) + 16px); }
.xpage-cinema-si .csi-rk { font: 700 var(--csi-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--csi-dim); }
.xpage-cinema-si .csi-eth { display: flex; flex-direction: column; gap: 12px; max-width: 48em; }
.xpage-cinema-si .csi-eth li { font: 400 22px/1.4 var(--serif); color: var(--csi-dim); padding-left: 24px; position: relative; }
.xpage-cinema-si .csi-eth li::before { content: ""; position: absolute; left: 0; top: .6em; width: 8px; height: 8px; border-radius: 50%; background: var(--csi-red); }
.xpage-cinema-si .csi-wire { display: flex; flex-direction: column; gap: 48px; padding: 16px var(--csi-pad) 72px; }
.xpage-cinema-si .csi-wmh { font: 400 40px/1.1 var(--serif); padding-bottom: 14px; border-bottom: 1px solid var(--csi-red); }
.xpage-cinema-si .csi-wmh i { font: 400 var(--csi-floor)/1 var(--sans); color: var(--csi-faint); font-style: normal; margin-left: 8px; }
.xpage-cinema-si .csi-wlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(520px, 1fr)); gap: 0 56px; }

/* ------------------------------------------------------------ medium */
@media (max-width: 1099px) {
  .xpage-cinema-si .csi-frow { grid-template-columns: 120px minmax(0, 1fr) minmax(0, 1fr); }
  .xpage-cinema-si .csi-fc { display: none; }
  .xpage-cinema-si .csi-cols { display: none; }
  .xpage-cinema-si .csi-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 24px; }
  .xpage-cinema-si .csi-c1 { grid-row: span 4; }
  .xpage-cinema-si .csi-lab { display: inline; font: 700 var(--csi-floor)/1.2 var(--sans); letter-spacing: 1.5px; text-transform: uppercase; color: var(--csi-faint); margin-right: 8px; }
  .xpage-cinema-si .csi-film { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: 40px; }
  .xpage-cinema-si .csi-next { grid-template-columns: auto minmax(0, 1fr); }
  .xpage-cinema-si .csi-next .csi-out { grid-column: 2; }
}

/* ------------------------------------------------------------ mobile (KwHTT, CxS9r) */
@media (max-width: 767px) {
  .xpage-cinema-si .csi-nav { min-height: 48px; gap: 22px; }
  .xpage-cinema-si .csi-brand { font-size: 20px; }
  .xpage-cinema-si .csi-tabs { gap: 22px; }
  .xpage-cinema-si .csi-tabs a { font-size: var(--csi-floor); padding: 14px 0 12px; }
  .xpage-cinema-si .csi-h { font-size: 40px; }
  .xpage-cinema-si .csi-sub { font-size: 19px; }
  .xpage-cinema-si .csi-sec { padding: 36px var(--csi-pad); gap: 16px; }
  .xpage-cinema-si .csi-lead { display: flex; flex-direction: column; align-items: stretch; gap: 14px; padding: 28px var(--csi-pad) 36px; }
  .xpage-cinema-si .csi-lead .csi-copy { display: contents; }
  .xpage-cinema-si .csi-lead .csi-kick { order: -2; }
  .xpage-cinema-si .csi-lead > .csi-poster { order: -1; margin-bottom: 4px; }
  .xpage-cinema-si .csi-lead .csi-btn { align-self: flex-start; }
  .xpage-cinema-si .csi-lh { font-size: 36px; line-height: 1; }
  .xpage-cinema-si .csi-ld { font-size: 18px; line-height: 1.4; }
  .xpage-cinema-si .csi-meta { font-size: var(--csi-floor); }
  .xpage-cinema-si .csi-poster.csi-big { padding: 14px 14px 18px; aspect-ratio: 358 / 520; }
  .xpage-cinema-si .csi-big .csi-run { font-size: 18px; }
  .xpage-cinema-si .csi-big .csi-pt { font-size: 40px; }
  .xpage-cinema-si .csi-big .csi-by { letter-spacing: 1.5px; }
  .xpage-cinema-si .csi-wall, .xpage-cinema-si .csi-posters { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .xpage-cinema-si .csi-poster { padding: 10px 10px 14px; }
  .xpage-cinema-si .csi-laurel { letter-spacing: .6px; }
  .xpage-cinema-si .csi-run { font-size: 16px; }
  .xpage-cinema-si .csi-pt { font-size: 24px; }
  .xpage-cinema-si .csi-by { letter-spacing: .8px; }
  .xpage-cinema-si .csi-with { display: none; }
  .xpage-cinema-si .csi-big .csi-with { display: block; }
  .xpage-cinema-si .csi-rule { display: none; }
  .xpage-cinema-si .csi-next { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 18px; }
  .xpage-cinema-si .csi-count { flex-direction: row; align-items: baseline; gap: 10px; }
  .xpage-cinema-si .csi-num { font-size: 48px; line-height: 1; }
  .xpage-cinema-si .csi-nn { font-size: 22px; }
  .xpage-cinema-si .csi-nw { font-size: var(--csi-floor); }
  .xpage-cinema-si .csi-frow { grid-template-columns: 76px minmax(0, 1fr); gap: 4px 12px; padding: 12px 0; }
  .xpage-cinema-si .csi-fd { font-size: var(--csi-floor); grid-row: span 2; }
  .xpage-cinema-si .csi-fn { font-size: 20px; }
  .xpage-cinema-si .csi-fl { grid-column: 2; font-size: 17px; color: var(--csi-dim); }
  .xpage-cinema-si .csi-sec > .csi-tools { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 10px; margin: 0 calc(-1 * var(--csi-pad)); padding: 0 var(--csi-pad); scrollbar-width: none; }
  .xpage-cinema-si .csi-sec > .csi-tools .csi-tool { flex: 0 0 240px; scroll-snap-align: start; padding: 18px; gap: 8px; }
  .xpage-cinema-si .csi-tn { font-size: 32px; }
  .xpage-cinema-si .csi-sec > .csi-tools .csi-tw { display: none; }
  .xpage-cinema-si .csi-timeline { display: flex; flex-direction: column; gap: 12px; }
  .xpage-cinema-si .csi-rule-e { padding: 0 0 0 16px; gap: 4px; border-left: 2px solid var(--csi-red); }
  .xpage-cinema-si .csi-rule-e::before, .xpage-cinema-si .csi-rule-e::after { display: none; }
  .xpage-cinema-si .csi-rw { font-size: 22px; }
  .xpage-cinema-si .csi-rx { font-size: 19px; }
  .xpage-cinema-si .csi-wcols { grid-template-columns: minmax(0, 1fr); }
  .xpage-cinema-si .csi-wi { grid-template-columns: 56px minmax(0, 1fr); gap: 12px; padding: 14px 0; }
  .xpage-cinema-si .csi-wi b { font-size: 20px; }
  .xpage-cinema-si .csi-phead { padding: 28px var(--csi-pad) 20px; gap: 12px; }
  .xpage-cinema-si .csi-ph { font-size: 64px; }
  .xpage-cinema-si .csi-pdek { font-size: 18px; }
  .xpage-cinema-si .csi-filters { gap: 10px; padding: 12px var(--csi-pad); }
  .xpage-cinema-si .csi-fg { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
  .xpage-cinema-si .csi-chip { white-space: nowrap; }
  .xpage-cinema-si .csi-index { padding: 0 var(--csi-pad) 48px; }
  .xpage-cinema-si .csi-row { grid-template-columns: 44px minmax(0, 1fr); gap: 4px 14px; padding: 14px 0; }
  .xpage-cinema-si .csi-c1 { display: contents; }
  .xpage-cinema-si .csi-thumb { grid-row: span 5; width: 44px; height: 66px; }
  .xpage-cinema-si .csi-rt { font-size: 24px; }
  .xpage-cinema-si .csi-row > span:not(.csi-c1) { grid-column: 2; }
  .xpage-cinema-si .csi-film { display: flex; flex-direction: column; gap: 0; padding: 0 0 28px; background: none; }
  .xpage-cinema-si .csi-film > .csi-poster { position: relative; top: 0; width: 100%; aspect-ratio: auto; min-height: 560px; justify-content: flex-end; padding: 0 20px 28px; }
  .xpage-cinema-si .csi-film > .csi-poster { gap: 10px; }
  .xpage-cinema-si .csi-film > .csi-poster .csi-ptop { justify-content: center; }
  .xpage-cinema-si .csi-film > .csi-poster .csi-run { display: none; }
  .xpage-cinema-si .csi-film > .csi-poster .csi-laurel { text-align: center; }
  .xpage-cinema-si .csi-film .csi-big .csi-pt { font-size: 48px; }
  .xpage-cinema-si .csi-info { padding: 20px var(--csi-pad) 0; gap: 20px; }
  .xpage-cinema-si .csi-ft { font-size: 44px; }
  .xpage-cinema-si .csi-fby { font-size: 24px; margin-top: -6px; }
  .xpage-cinema-si .csi-about { font-size: 19px; }
  .xpage-cinema-si .csi-fact { display: flex; flex-direction: column; gap: 4px; padding: 12px 0; }
  .xpage-cinema-si .csi-fact dd { font-size: 20px; }
  .xpage-cinema-si .csi-btns { flex-direction: column; align-items: stretch; }
  .xpage-cinema-si .csi-btns a { justify-content: center; }
  .xpage-cinema-si .csi-awt { font-size: 22px; }
  .xpage-cinema-si .csi-fest { grid-template-columns: minmax(0, 1fr); padding: 24px 0; }
  .xpage-cinema-si .csi-fname { font-size: 30px; }
  .xpage-cinema-si .csi-fwhat { font-size: 19px; }
  .xpage-cinema-si .csi-est, .xpage-cinema-si .csi-namedlist, .xpage-cinema-si .csi-wlist, .xpage-cinema-si .csi-tl-all { grid-template-columns: minmax(0, 1fr); }
  .xpage-cinema-si .csi-tl-all { display: flex; flex-direction: column; gap: 24px; }
  .xpage-cinema-si .csi-named { grid-template-columns: minmax(0, 1fr); gap: 4px; }
  .xpage-cinema-si .csi-wmh { font-size: 30px; }
  .xpage-cinema-si .csi-more-films .csi-h { font-size: 40px; }
}
@media (prefers-reduced-motion: reduce) { .xpage-cinema-si .csi * { scroll-behavior: auto !important; transition: none !important; } }
/* the one-line note on the name (owner/integrator decision 2026-10-13): neutral, sourced, small print under the section nav */
.xpage-cinema-si .csi-namenote { padding: 12px var(--csi-pad); background: var(--csi-dark); border-bottom: 1px solid var(--csi-rule); font: 400 var(--csi-floor)/1.45 var(--sans); color: var(--csi-dim); }
.xpage-cinema-si .csi-namenote a { color: var(--csi-ink); text-decoration: underline; text-decoration-color: var(--csi-rule); text-underline-offset: 3px; white-space: nowrap; }
.xpage-cinema-si .csi-chip:disabled { opacity: .45; cursor: default; }
.xpage-cinema-si .csi-cols[hidden], .xpage-cinema-si .csi-next[hidden], .xpage-cinema-si .csi-empty[hidden] { display: none; }

/* the rename (owner decision 2026-10-13): the shell's phone pill reads its short label from cp-shell.css; this later rule
   gives it the section's name without editing that file (same selector, loaded after it) */
@media (max-width: 767px) { .cp-on .cp-right .cp-new em::before { content: "Cinema SI"; } }

/* Cinepuuulse stage 3, slice E (2026-10-13): the country hubs (/asia/japan/ … /asia/across/), the world cinema hub
   (/world/), reviews (/reviews/) and search (/search/). Pencil file cine.pen: xcX2f / s6sG7 (country hub 1440 / 390),
   lhUt8 (world hub), o9srG / XXP3r (reviews 1440 / 390), MGcin (search). The pages are generated by engine/hubs.py and
   wrapped by the build as <main class="single xpage xpage-hub|xpage-reviews|xpage-search">; every rule below is scoped
   to those classes, so no other page changes. Loaded after cp-shell.css, cp-home.css and cp-pages-*.css.
   Deliberate differences from the frames, the same owner rules slices B, C and D followed:
   - nothing is set under the site's 14.6 px floor (the frames' 11/12/13/14 px labels are set at 14.6);
   - the frames' 30 % "faint" ink fails 4.5:1 on #0B0B0C, so text uses 55 % ink; rules stay at 12 %;
   - fluid: grids add columns as the screen grows; nothing is capped in a centred column (running text keeps a measure). */

main#single:is(.xpage-hub, .xpage-reviews, .xpage-search) {
  --h3-bg: #0B0B0C; --h3-ink: #F2EFE9; --h3-red: #D7263D; --h3-redt: #FF4A5E;
  --h3-dim: rgba(242, 239, 233, .6); --h3-faint: rgba(242, 239, 233, .55); --h3-rule: rgba(255, 255, 255, .12);
  --h3-panel: #141416; --h3-card: #1E1E21; --h3-pad: 32px; --h3-floor: 14.6px;
  max-width: none; width: auto; margin: 0; padding: var(--cp-bar, 64px) 0 0; background: var(--h3-bg); color: var(--h3-ink);
  font-family: var(--sans); text-align: left; overflow-x: clip;
}
@media (max-width: 767px) { main#single:is(.xpage-hub, .xpage-reviews, .xpage-search) { --h3-pad: 16px; } }
.h3, .h3 *, .h3 *::before, .h3 *::after { box-sizing: border-box; }
.h3 { display: block; width: 100%; background: var(--h3-bg); color: var(--h3-ink); }
.h3 a { color: inherit; text-decoration: none; }
.h3 :is(h1, h2, h3, p, figure, ul, ol) { margin: 0; padding: 0; }
.h3 :is(ul, ol) { list-style: none; }
.h3 button { font-family: var(--sans); color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }
.h3 :is(a, button, input):focus-visible { outline: 2px solid var(--h3-redt); outline-offset: 3px; }
.h3 img { display: block; }
.h3 .vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.h3 .h3-ar { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.h3 .h3-k { font: 700 var(--h3-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--h3-dim); }
.h3 .h3-k.red { color: var(--h3-redt); }

/* ------------------------------------------------------------ pictures: feed stills, credited; a dark tile when absent */
.h3 .pic { position: relative; width: 100%; overflow: hidden; background: var(--h3-card); }
.h3 .pic img { width: 100%; height: 100%; object-fit: cover; }
.h3 .pic .h3-fb { display: none; position: absolute; left: 16px; right: 16px; bottom: 14px; font: italic 400 26px/1.1 var(--serif); color: var(--h3-dim); }
.h3 .pic.noimg { background: radial-gradient(70% 70% at 30% 30%, #2A2A2E, var(--h3-card)); }
.h3 .pic.noimg img { visibility: hidden; }
.h3 .pic.noimg .h3-fb { display: block; }
@media (prefers-reduced-motion: no-preference) {
  .h3 :is(.h3-card, .h3-lead, .h3-feat-a) .pic img { transition: transform .9s cubic-bezier(.2, .7, .2, 1); }
  .h3 :is(.h3-card, .h3-lead, .h3-feat-a):hover .pic img { transform: scale(1.035); }
}

/* ------------------------------------------------------------ hub head (xcX2f "Country head", lhUt8) */
.h3-hub .h3-head { position: relative; display: flex; align-items: flex-end; min-height: 520px; padding: 120px var(--h3-pad) 40px; isolation: isolate; }
.h3-hub .h3-still { position: absolute; inset: 0; z-index: -1; }
.h3-hub .h3-still img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 35%; }
.h3-hub .h3-still::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 11, 12, .35) 0%, rgba(11, 11, 12, .55) 45%, #0B0B0C 100%); }
.h3-hub .h3-still figcaption { position: absolute; right: var(--h3-pad); bottom: 16px; z-index: 1; font: 400 var(--h3-floor)/1.2 var(--sans); color: var(--h3-faint); }
.h3-hub .h3-still figcaption a { color: var(--h3-dim); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--h3-rule); }
.h3-hub .h3-hin { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.h3-hub .h3-kick { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.h3-hub .h3-kick .nat { font: 600 22px/1.2 var(--sans); color: var(--h3-redt); }
.h3-hub .h3-kick > span:last-child { font: 700 var(--h3-floor)/1.2 var(--sans); letter-spacing: 3px; text-transform: uppercase; color: var(--h3-dim); }
.h3-world .h3-kick > span:last-child { color: var(--h3-redt); }
.h3-hub .h3-h1 { font: 400 clamp(80px, calc(16px + 10vw), 160px)/.88 var(--serif); letter-spacing: -3px; color: var(--h3-ink); overflow-wrap: anywhere; padding-bottom: .04em; }
.h3-hub .h3-stats { display: flex; flex-wrap: wrap; gap: 12px 40px; }
.h3-hub .h3-stat { display: flex; align-items: baseline; gap: 8px; }
.h3-hub .h3-stat b { font: 400 34px/1.1 var(--serif); color: var(--h3-ink); }
.h3-hub .h3-stat span { font: 400 var(--h3-floor)/1.2 var(--sans); color: var(--h3-dim); }
.h3 .h3-quiet { padding: 32px var(--h3-pad) 0; font: 400 21px/1.4 var(--serif); color: var(--h3-dim); }

/* tabs: links between the hubs, buttons on /world/ */
.h3 .h3-tabs { display: flex; gap: 10px; padding: 14px var(--h3-pad); border-bottom: 1px solid var(--h3-rule); overflow-x: auto; scrollbar-width: none; }
.h3 .h3-tabs::-webkit-scrollbar { display: none; }
.h3 .h3-tabs :is(a, button), .h3 .h3-chips button { flex: none; font: 500 15px/1.2 var(--sans); padding: 8px 16px; border-radius: 999px; border: 1px solid var(--h3-rule); color: var(--h3-dim); white-space: nowrap; background: transparent; }
.h3 .h3-tabs :is(a, button):hover, .h3 .h3-chips button:hover { color: var(--h3-ink); border-color: var(--h3-faint); }
.h3 .h3-tabs a[aria-current="page"], .h3 :is(.h3-tabs, .h3-chips) button[aria-pressed="true"] { background: var(--h3-ink); border-color: var(--h3-ink); color: var(--h3-bg); }
.h3 :is(.h3-tabs, .h3-chips) small { font-size: inherit; opacity: .7; margin-left: 2px; }

/* ------------------------------------------------------------ lead + side ("Top stories") */
.h3 .h3-top { display: grid; grid-template-columns: minmax(0, 2.05fr) minmax(280px, 1fr); gap: 32px; padding: 48px var(--h3-pad) 24px; }
.h3 a.h3-lead { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.h3 a.h3-lead .pic { aspect-ratio: 904 / 480; }
.h3 a.h3-lead h2 { font: 400 clamp(32px, calc(14px + 2.1vw), 44px)/1.08 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3 .h3-desc { font: 400 17px/1.4 var(--serif); color: var(--h3-dim); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.h3 .h3-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; font: 400 var(--h3-floor)/1.3 var(--sans); color: var(--h3-faint); }
.h3 .h3-src { font-weight: 600; color: var(--h3-redt); }
.h3 .h3-side { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.h3 a.h3-side-i { display: flex; flex-direction: column; gap: 8px; padding-bottom: 20px; border-bottom: 1px solid var(--h3-rule); }
.h3 a.h3-side-i h3 { font: 400 26px/1.1 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3 a.h3-side-i .h3-desc { -webkit-line-clamp: 3; }
.h3 :is(a.h3-lead, a.h3-side-i, a.h3-card):hover :is(h2, h3) { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }

/* ------------------------------------------------------------ card grid ("More Korea") */
.h3 .h3-grid-w { padding: 24px var(--h3-pad) 64px; }
.h3 .h3-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 40px 32px; }
.h3 a.h3-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.h3 a.h3-card .pic { aspect-ratio: 3 / 2; }
.h3 a.h3-card h3 { font: 400 26px/1.08 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3 .h3-grid [data-cut] { display: none; }
.h3-world:not(.h3-filtered) .h3-grid [data-top] { display: none; }
.h3-world.h3-filtered .h3-top { display: none; }
.h3-world.h3-filtered .h3-grid-w { padding-top: 48px; }
.h3-world .h3-grid [data-off] { display: none; }
.h3 .h3-note { margin-top: 32px; font: 400 15px/1.4 var(--sans); color: var(--h3-faint); }
.h3 .h3-morebtn { display: flex; justify-content: center; padding-top: 40px; }
.h3 .h3-morebtn button { font: 600 15px/1.2 var(--sans); padding: 16px 32px; border: 1px solid var(--h3-ink); border-radius: 999px; color: var(--h3-ink); }
.h3 .h3-morebtn button:hover { background: var(--h3-ink); color: var(--h3-bg); }

/* ------------------------------------------------------------ at a glance (box office, festivals, signals) */
.h3 .h3-glance { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 24px; padding: 56px var(--h3-pad) 72px; border-top: 1px solid var(--h3-rule); align-items: start; }
.h3 .h3-panel { display: flex; flex-direction: column; gap: 12px; padding: 24px; background: var(--h3-panel); border-top: 2px solid var(--h3-rule); min-width: 0; }
.h3 .h3-panel.h3-bo { border-top-color: var(--h3-red); }
.h3 .h3-panel .h3-sub, .h3 .h3-panel .h3-empty { font: 400 var(--h3-floor)/1.3 var(--sans); color: var(--h3-faint); }
.h3 .h3-panel .h3-empty { font: 400 19px/1.35 var(--serif); color: var(--h3-dim); }
.h3 .h3-bo ol li { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; align-items: baseline; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--h3-rule); }
.h3 .h3-bo ol li b { font: 400 22px/1 var(--serif); color: var(--h3-dim); }
.h3 .h3-bo ol li .t { font: 400 20px/1.15 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3 .h3-bo ol li .g { font: 600 15px/1.2 var(--sans); color: var(--h3-ink); white-space: nowrap; }
.h3 .h3-bo ol li.one b { font-size: 36px; color: var(--h3-redt); }
.h3 .h3-bo ol li.one .t { font-size: 26px; }
.h3 .h3-bo ol.multi li { grid-template-columns: minmax(84px, auto) minmax(0, 1fr) auto; }
.h3 .h3-bo ol.multi li .m { font: 600 var(--h3-floor)/1.2 var(--sans); color: var(--h3-dim); }
.h3 .h3-more { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font: 600 15px/1.2 var(--sans); color: var(--h3-ink); align-self: flex-start; }
.h3 .h3-more:hover { color: var(--h3-redt); }
.h3 .h3-fest li { display: flex; flex-direction: column; gap: 4px; padding: 12px 0; border-bottom: 1px solid var(--h3-rule); }
.h3 .h3-fest .top { display: flex; justify-content: space-between; gap: 12px; font: 600 var(--h3-floor)/1.2 var(--sans); }
.h3 .h3-fest .top .d { color: var(--h3-ink); }
.h3 .h3-fest .top .st { color: var(--h3-dim); font-weight: 400; }
.h3 .h3-fest .top .st.on { color: var(--h3-redt); font-weight: 600; }
.h3 .h3-fest .n { font: 400 24px/1.15 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3 .h3-fest a.n:hover { color: var(--h3-redt); }
.h3 .h3-fest .c { font: 400 var(--h3-floor)/1.2 var(--sans); color: var(--h3-faint); }
.h3 .h3-sig li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(80px, 173px) 28px; align-items: center; gap: 12px; padding: 8px 0; }
.h3 .h3-sig a { font: 400 21px/1.15 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3 .h3-sig a:hover { color: var(--h3-redt); }
.h3 .h3-sig .tr { position: relative; height: 14px; background: rgba(242, 239, 233, .05); }
.h3 .h3-sig .tr i { position: absolute; inset: 0 auto 0 0; background: var(--h3-red); }
.h3 .h3-sig .n { font: 400 var(--h3-floor)/1 var(--sans); color: var(--h3-dim); text-align: right; }

/* ------------------------------------------------------------ hub at phone width (s6sG7) */
@media (max-width: 767px) {
  .h3-hub .h3-head { min-height: 300px; padding: 96px var(--h3-pad) 20px; }
  .h3-hub .h3-hin { gap: 6px; }
  .h3-hub .h3-kick { gap: 8px; }
  .h3-hub .h3-kick .nat { font-size: var(--h3-floor); font-weight: 700; letter-spacing: 2px; }
  .h3-hub .h3-kick > span:last-child { color: var(--h3-redt); letter-spacing: 2px; }
  .h3-hub .h3-stats { gap: 6px 14px; }
  .h3-hub .h3-stat b { font: 400 var(--h3-floor)/1.2 var(--sans); color: var(--h3-dim); }
  .h3-hub .h3-still figcaption { bottom: 8px; }
  .h3 .h3-tabs { border-bottom: 0; padding-top: 14px; padding-bottom: 16px; gap: 8px; }
  .h3 .h3-tabs :is(a, button) { font-size: var(--h3-floor); padding: 7px 13px; }
  .h3 .h3-top { grid-template-columns: minmax(0, 1fr); gap: 20px; padding: 0 var(--h3-pad) 28px; }
  .h3 a.h3-lead { padding-bottom: 20px; border-bottom: 1px solid var(--h3-rule); gap: 10px; }
  .h3 a.h3-lead .pic { aspect-ratio: 358 / 220; }
  .h3 a.h3-lead h2 { font-size: 28px; line-height: 1.06; }
  .h3 .h3-side { gap: 20px; }
  .h3 a.h3-side-i { gap: 6px; padding-bottom: 16px; }
  .h3 a.h3-side-i h3 { font-size: 22px; line-height: 1.12; }
  .h3 .h3-grid-w { padding: 8px var(--h3-pad) 40px; }
  .h3 .h3-glance { padding: 0 var(--h3-pad) 32px; gap: 12px; border-top: 0; }
  .h3 .h3-panel { padding: 18px; }
}

/* ------------------------------------------------------------ reviews (o9srG / XXP3r) */
.h3-reviews .h3-rhead { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 16px 56px; padding: 56px var(--h3-pad) 32px; }
.h3-reviews .h3-h1 { font: 400 clamp(64px, calc(16px + 9vw), 144px)/.9 var(--serif); letter-spacing: -2px; color: var(--h3-ink); }
.h3-reviews .h3-dek { flex: 0 1 400px; font: 400 24px/1.3 var(--serif); color: var(--h3-dim); }
.h3-reviews .h3-filters { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px 32px; padding: 14px var(--h3-pad); border-top: 1px solid var(--h3-rule); border-bottom: 1px solid var(--h3-rule); }
.h3 .h3-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.h3 .h3-chips .lab { flex: none; white-space: nowrap; font: 400 var(--h3-floor)/1.2 var(--sans); color: var(--h3-faint); margin-right: 4px; }
.h3 .h3-chips button.red { border-color: var(--h3-red); color: var(--h3-redt); font-size: var(--h3-floor); padding: 8px 14px; }
.h3 .h3-chips button.red[aria-pressed="true"] { background: var(--h3-red); border-color: var(--h3-red); color: #fff; }
.h3-reviews .h3-feat { padding: 48px var(--h3-pad) 56px; }
.h3-reviews a.h3-feat-a { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); gap: 48px; align-items: start; }
.h3-reviews a.h3-feat-a .pic { aspect-ratio: 820 / 460; }
.h3-reviews .h3-feat .copy { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.h3-reviews .h3-feat h2 { font: 400 clamp(34px, calc(14px + 2.3vw), 46px)/1.04 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3-reviews .h3-feat .h3-desc { font-size: 21px; line-height: 1.45; -webkit-line-clamp: 6; }
.h3-reviews .h3-feat .h3-go { display: inline; padding: 0; border: 0; border-radius: 0; background: none; font: 600 15px/1.2 var(--sans); color: var(--h3-ink); }
.h3-reviews a.h3-feat-a:hover h2 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.h3-reviews .h3-wall-w { padding: 0 var(--h3-pad) 72px; }
.h3-reviews .h3-wall { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 0 40px; }
.h3-reviews a.h3-rv { display: flex; flex-direction: column; gap: 10px; padding: 24px 0; border-top: 2px solid rgba(242, 239, 233, .5); min-width: 0; }
.h3-reviews a.h3-rv .top { display: flex; justify-content: space-between; gap: 12px; font: 700 var(--h3-floor)/1.2 var(--sans); }
.h3-reviews a.h3-rv .k { color: var(--h3-redt); letter-spacing: 2px; text-transform: uppercase; }
.h3-reviews a.h3-rv .d { color: var(--h3-faint); font-weight: 400; }
.h3-reviews a.h3-rv h3 { font: 400 30px/1.08 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3-reviews a.h3-rv .h3-desc { font-size: 18px; -webkit-line-clamp: 3; }
.h3-reviews a.h3-rv .s { font: 600 var(--h3-floor)/1.2 var(--sans); color: var(--h3-ink); }
.h3-reviews a.h3-rv:hover h3 { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.h3-reviews .h3-wall [data-off], .h3-reviews .h3-wall [data-cut] { display: none; }
.h3-reviews .h3-feat.off { display: none; }
.h3 .h3-none { padding-top: 24px; font: 400 21px/1.4 var(--serif); color: var(--h3-dim); }
@media (max-width: 767px) {
  .h3-reviews .h3-rhead { padding: 32px var(--h3-pad) 16px; gap: 8px; }
  .h3-reviews .h3-dek { flex-basis: 100%; font-size: 19px; }
  .h3-reviews .h3-filters { border: 0; padding: 0 var(--h3-pad) 16px; }
  .h3-reviews .h3-filters .h3-chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; max-width: 100%; }
  .h3-reviews .h3-filters .h3-chips::-webkit-scrollbar { display: none; }
  .h3-reviews .h3-filters .h3-chips button { flex: none; font-size: var(--h3-floor); padding: 7px 13px; }
  .h3-reviews .h3-feat { padding: 0 var(--h3-pad) 8px; }
  .h3-reviews a.h3-feat-a { grid-template-columns: minmax(0, 1fr); gap: 14px; padding-bottom: 20px; border-bottom: 1px solid var(--h3-rule); }
  .h3-reviews a.h3-feat-a .pic { aspect-ratio: 358 / 220; }
  .h3-reviews .h3-feat h2 { font-size: 28px; }
  .h3-reviews .h3-feat .h3-desc { font-size: 18px; -webkit-line-clamp: 4; }
  .h3-reviews .h3-wall-w { padding-bottom: 40px; }
  .h3-reviews a.h3-rv { border-top: 0; border-bottom: 1px solid var(--h3-rule); padding: 18px 0; gap: 6px; }
  .h3-reviews a.h3-rv h3 { font-size: 24px; }
}

/* ------------------------------------------------------------ search (MGcin) */
.h3-search .h3-shead { display: flex; flex-direction: column; gap: 20px; padding: 48px var(--h3-pad) 24px; }
.h3-search .h3-sform { display: flex; align-items: center; gap: 16px; padding-bottom: 16px; border-bottom: 2px solid var(--h3-ink); }
.h3-search .h3-sform .ico { width: 36px; height: 36px; flex: none; fill: none; stroke: var(--h3-ink); stroke-width: 1.6; }
.h3-search .h3-sform input { flex: 1 1 auto; min-width: 0; padding: 0; border: 0; background: transparent; color: var(--h3-ink); font: italic 400 clamp(44px, calc(14px + 4vw), 72px)/1.1 var(--serif); outline: none; }
.h3-search .h3-sform input::placeholder { color: var(--h3-faint); }
.h3-search .h3-sform input::-webkit-search-cancel-button { display: none; }
.h3-search .h3-sform:focus-within { border-bottom-color: var(--h3-redt); }
.h3-search .h3-sform .clr { display: inline-flex; width: 44px; height: 44px; align-items: center; justify-content: center; color: var(--h3-dim); }
.h3-search .h3-sform .clr:hover { color: var(--h3-ink); }
.h3-search .h3-sform .clr svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.h3-search .h3-results { padding: 8px var(--h3-pad) 72px; }
.h3-search .h3-res { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 8px 32px; padding: 26px 0; border-bottom: 1px solid var(--h3-rule); }
.h3-search .h3-res .k { padding-top: 10px; font: 700 var(--h3-floor)/1.2 var(--sans); letter-spacing: 2px; text-transform: uppercase; color: var(--h3-redt); }
.h3-search .h3-res .b { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.h3-search .h3-res .t { font: 400 34px/1.06 var(--serif); color: var(--h3-ink); overflow-wrap: anywhere; }
.h3-search .h3-res a.t:hover { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; }
.h3-search .h3-res .x { font: 400 18px/1.4 var(--serif); color: var(--h3-dim); overflow-wrap: anywhere; }
.h3-search .h3-res .m { font: 400 var(--h3-floor)/1.3 var(--sans); color: var(--h3-faint); }
.h3-search .h3-res mark { background: none; color: var(--h3-redt); }
.h3-search .h3-emp { display: flex; flex-direction: column; gap: 10px; padding-top: 40px; }
.h3-search .h3-emp p:not(.h3-k) { font: 400 22px/1.35 var(--serif); color: var(--h3-dim); }
.h3-search .h3-sugg { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 8px; }
.h3-search .h3-sugg button { font: 500 15px/1.2 var(--sans); padding: 8px 16px; border-radius: 999px; border: 1px solid var(--h3-rule); color: var(--h3-dim); }
.h3-search .h3-sugg button:hover { color: var(--h3-ink); border-color: var(--h3-faint); }
.h3-search .h3-wait { padding-top: 32px; font: 400 21px/1.4 var(--serif); color: var(--h3-dim); }
@media (max-width: 767px) {
  .h3-search .h3-shead { padding: 28px var(--h3-pad) 16px; gap: 14px; }
  .h3-search .h3-sform .ico { width: 26px; height: 26px; }
  .h3-search .h3-facets { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .h3-search .h3-facets button { flex: none; }
  .h3-search .h3-res { grid-template-columns: minmax(0, 1fr); gap: 6px; padding: 18px 0; }
  .h3-search .h3-res .k { padding-top: 0; }
  .h3-search .h3-res .t { font-size: 26px; }
}

/* Cinepuuulse redesign, stage 3, slice F (2026-10-13): the pages engine/filmdesk.py generates. Pencil file cine.pen,
   frames z4nqrE / H9LtP (festival), Y4f9b / InMgt (In cinemas), SNSNQ / M0tiNc (Awards season), AHEY1 / UVEC8 (film
   dossier). Every rule is scoped to main.xpage-festival / -incinemas / -awards / -film (the wrapper build.py gives a
   step's page) and the step's own .f3 markup, so no other page changes. Deliberate differences from the frames, all
   owner rules (as slices C and D):
   - nothing is set under the 14.6 px floor: the frames' 11/12/13 px labels are set at 14.6;
   - the frames' 30 % "faint" ink fails 4.5:1 on #0B0B0C, so text uses 55 % ink; rules stay at 12 %;
   - the page is fluid: the coverage list and the race cards add columns as the screen grows; running text keeps a
     reading measure (the paragraph, not the page). */

main.single:is(.xpage-festival, .xpage-incinemas, .xpage-awards, .xpage-film) {
  --f3-bg: #0B0B0C; --f3-ink: #F2EFE9; --f3-red: #D7263D; --f3-redt: #FF4A5E; --f3-dim: rgba(242, 239, 233, .6);
  --f3-faint: rgba(242, 239, 233, .55); --f3-rule: rgba(255, 255, 255, .12); --f3-panel: #141416; --f3-card: #1E1E21;
  --f3-pad: 32px; --f3-floor: 14.6px;
  display: block; max-width: none; width: auto; margin: 0; padding: var(--cp-bar, 64px) 0 0; background: var(--f3-bg); color: var(--f3-ink);
  font-family: var(--sans); overflow-x: clip;
}
@media (max-width: 767px) { main.single:is(.xpage-festival, .xpage-incinemas, .xpage-awards, .xpage-film) { --f3-pad: 16px; } }
.f3, .f3 *, .f3 *::before, .f3 *::after { box-sizing: border-box; }
.f3 a { color: inherit; text-decoration: none; }
.f3 a:focus-visible, .f3 button:focus-visible { outline: 2px solid var(--f3-redt); outline-offset: 3px; }
.f3 h1, .f3 h2, .f3 h3, .f3 p, .f3 ul, .f3 ol, .f3 dl, .f3 dd, .f3 figure { margin: 0; padding: 0; }
.f3 ul, .f3 ol { list-style: none; }
.f3 .vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.f3 .f3-k { font: 600 var(--f3-floor)/1.2 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--f3-dim); }
.f3 .f3-red { color: var(--f3-redt); }
.f3 .f3-kick { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px 14px; }
.f3 .f3-local { font: 500 24px/1.2 "Shippori Mincho", var(--serif); color: var(--f3-redt); }
.f3 .f3-h1 { font: 400 clamp(44px, 7.2vw, 104px)/.92 var(--serif); letter-spacing: -.015em; color: var(--f3-ink); }
.f3 .f3-dek { font: 400 24px/1.3 var(--serif); color: var(--f3-dim); max-width: 640px; }
.f3 .f3-src { font: 400 var(--f3-floor)/1.5 var(--sans); color: var(--f3-faint); }
.f3 .f3-src a, .f3 .f3-ts, .f3 .f3-fs { text-decoration: underline; text-decoration-color: var(--f3-rule); text-underline-offset: 3px; }
.f3 .f3-src a:hover, .f3 .f3-ts:hover, .f3 .f3-fs:hover { color: var(--f3-ink); text-decoration-color: currentColor; }
.f3 .f3-pad { padding: 0 var(--f3-pad) 48px; }

/* ------------------------------------------------------------ heads */
.f3 .f3-head { position: relative; padding: 56px var(--f3-pad) 32px; }
.f3 .f3-head .f3-in { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 16px; }
.f3 .f3-has-still { min-height: min(560px, 72vh); display: flex; align-items: flex-end; padding-bottom: 44px; }
.f3 .f3-has-still .f3-in { width: 100%; }
.f3 .f3-still { position: absolute; inset: 0; overflow: hidden; }
.f3 .f3-still .f3-bg { position: absolute; inset: 0; background: var(--f3-panel); }
.f3 .f3-still img { width: 100%; height: 100%; object-fit: cover; display: block; }
.f3 .f3-still::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 11, 12, .25) 0%, rgba(11, 11, 12, .55) 45%, var(--f3-bg) 100%); }
.f3 .f3-still figcaption { position: absolute; right: var(--f3-pad); top: 16px; z-index: 2; font: 400 var(--f3-floor)/1.2 var(--sans); color: var(--f3-dim); background: rgba(11, 11, 12, .6); padding: 4px 10px; border-radius: 999px; }
.f3 .f3-still .f3-nopic span { display: none; }
.f3 .f3-plain { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 48px; flex-wrap: wrap; border-bottom: 1px solid var(--f3-rule); }
.f3 .f3-plain .f3-h1 { font-size: clamp(60px, 8.9vw, 128px); line-height: .9; letter-spacing: -.02em; }
.f3 .f3-plain .f3-dek { flex: 0 1 420px; }
.f3 .f3-k.f3-red { letter-spacing: .2em; }

/* festival facts row */
.f3 .f3-facts { display: flex; flex-wrap: wrap; gap: 16px 48px; margin-top: 8px; }
.f3 .f3-facts > div { display: flex; flex-direction: column-reverse; gap: 4px; }
.f3 .f3-facts dd { font: 400 34px/1.1 var(--serif); color: var(--f3-ink); }
.f3 .f3-facts dt { font: 600 var(--f3-floor)/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--f3-dim); }
.f3 .f3-facts .f3-cd dd { color: var(--f3-redt); }
.f3 .f3-unc { font: 400 var(--f3-floor)/1.4 var(--sans); color: var(--f3-dim); }

/* ------------------------------------------------------------ body: coverage + side */
.f3 .f3-body { display: grid; grid-template-columns: minmax(0, 1fr) clamp(320px, 29vw, 520px); gap: 48px 72px; padding: 56px var(--f3-pad) 72px; }
.f3 .f3-sech { display: flex; align-items: baseline; justify-content: space-between; gap: 12px 24px; flex-wrap: wrap; padding-bottom: 16px; }
.f3 .f3-sech h2, .f3 .f3-map h2, .f3 .f3-season h2 { font: 400 48px/1.1 var(--serif); color: var(--f3-ink); }
.f3 .f3-count { font: 400 var(--f3-floor)/1.3 var(--sans); color: var(--f3-dim); }
.f3 .f3-stories { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 640px), 1fr)); column-gap: 48px; }
.f3 .f3-stories > li { border-top: 1px solid var(--f3-rule); }
.f3 .f3-story { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 4px 20px; padding: 16px 0; }
.f3 .f3-story.f3-pics { grid-template-columns: 240px minmax(0, 1fr); grid-template-rows: auto 1fr; gap: 8px 24px; padding: 20px 0; }
.f3 .f3-pics .f3-pic { grid-row: 1 / span 2; aspect-ratio: 8 / 5; }
.f3 .f3-pic { background: var(--f3-card); overflow: hidden; position: relative; }
.f3 .f3-pic img { width: 100%; height: 100%; object-fit: cover; display: block; }
.f3 .f3-nopic { display: flex; align-items: flex-end; padding: 12px; }
.f3 .f3-nopic span { font: 400 var(--f3-floor)/1.2 var(--sans); color: var(--f3-dim); }
.f3 .f3-pic > .f3-fb { display: none; }   /* audit 2026-10-16: the source's name waits under a picture; shown only when it fails */
.f3 .f3-nopic > .f3-fb { display: block; }
.f3 .f3-d { font: 600 var(--f3-floor)/1.4 var(--sans); color: var(--f3-redt); white-space: nowrap; }
.f3 .f3-pics .f3-d { align-self: end; }
.f3 .f3-t { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.f3 .f3-h { font: 400 23px/1.2 var(--serif); color: var(--f3-ink); }
.f3 .f3-pics .f3-h { font-size: 30px; line-height: 1.08; }
.f3 .f3-h:lang(ja), .f3 .f3-h:lang(zh), .f3 .f3-h:lang(ko) { font-family: "Shippori Mincho", var(--serif); font-size: 20px; line-height: 1.35; }
.f3 .f3-pics .f3-h:lang(ja) { font-size: 24px; }
.f3 .f3-x { font: 400 18px/1.4 var(--serif); color: var(--f3-dim); }
.f3 .f3-by { font: 500 var(--f3-floor)/1.3 var(--sans); color: var(--f3-dim); display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.f3 .f3-lang { font: 600 var(--f3-floor)/1 var(--sans); color: var(--f3-dim); border: 1px solid var(--f3-rule); border-radius: 4px; padding: 2px 6px; }
.f3 a.f3-story:hover .f3-h { color: var(--f3-redt); }

.f3 .f3-side { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.f3 .f3-note { font: 400 22px/1.3 var(--serif); color: var(--f3-ink); padding: 24px; background: rgba(215, 38, 61, .08); border: 1px solid rgba(215, 38, 61, .4); }
.f3 .f3-links { display: flex; flex-direction: column; }
.f3 .f3-links a { font: 400 22px/1.2 var(--serif); padding: 16px 0; border-bottom: 1px solid var(--f3-rule); }
.f3 .f3-links a:hover { color: var(--f3-redt); }
.f3 .f3-near { display: flex; flex-direction: column; gap: 8px; padding-top: 8px; }
.f3 .f3-near a, .f3 .f3-near li { font: italic 400 22px/1.3 var(--serif); color: var(--f3-redt); }
.f3 .f3-near a:hover { text-decoration: underline; }

.f3 .f3-more summary { display: inline-flex; margin-top: 24px; font: 600 15px/1.2 var(--sans); padding: 14px 28px; border-radius: 999px; border: 1px solid var(--f3-ink); cursor: pointer; list-style: none; }
.f3 .f3-more summary::-webkit-details-marker { display: none; }
.f3 .f3-more summary:hover { background: var(--f3-ink); color: var(--f3-bg); }
.f3 .f3-more[open] summary { display: none; }
.f3 .f3-more summary:focus-visible { outline: 2px solid var(--f3-redt); outline-offset: 3px; }

/* ------------------------------------------------------------ timelines (dossier "Where and when", awards "The season, dated") */
.f3 .f3-map, .f3 .f3-season { padding: 56px var(--f3-pad) 48px; display: flex; flex-direction: column; gap: 24px; border-bottom: 1px solid var(--f3-rule); }
.f3 .f3-tline { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
/* audit 2026-10-16: seven dated steps no longer fit 200 px columns at 1440 and the last one dropped to a lone second row;
   AHEY1 draws the timeline as one line. Above the phone it stays one row, and swipes inside itself if it ever outgrows the page. */
@media (min-width: 768px) { .f3 .f3-tline { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(150px, 1fr); overflow-x: auto; scrollbar-width: thin; } }
.f3 .f3-tline li { position: relative; display: flex; flex-direction: column; gap: 10px; padding: 32px 18px 0 0; }
.f3 .f3-tline li::before { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 2px; background: var(--f3-red); }
.f3 .f3-tline li.f3-past::before { background: rgba(242, 239, 233, .3); }
.f3 .f3-tline .f3-dot { position: absolute; left: 0; top: 1px; width: 12px; height: 12px; border-radius: 50%; background: var(--f3-red); }
.f3 .f3-tline .f3-past .f3-dot { background: rgba(242, 239, 233, .6); }
.f3 .f3-td { font: 400 30px/1.1 var(--serif); color: var(--f3-ink); }
.f3 .f3-past .f3-td, .f3 .f3-past .f3-tl { color: var(--f3-dim); }
.f3 .f3-place { color: var(--f3-redt); }
.f3 .f3-past .f3-place { color: var(--f3-faint); }
.f3 .f3-tl { font: 400 19px/1.3 var(--serif); color: var(--f3-ink); }
.f3 .f3-ts { font: 400 var(--f3-floor)/1.3 var(--sans); color: var(--f3-faint); }
.f3 .f3-map .f3-src { margin-top: 8px; }

/* ------------------------------------------------------------ film dossier */
.f3 .f3-film .f3-film-in { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 32px 48px; flex-wrap: wrap; }
.f3 .f3-film .f3-film-in > div:first-child { display: flex; flex-direction: column; gap: 14px; flex: 1 1 560px; min-width: 0; }
.f3 .f3-film .f3-local { font-size: 26px; }
.f3 .f3-film .f3-h1 { font-size: clamp(54px, 8.9vw, 128px); line-height: .9; letter-spacing: -.02em; }
.f3 .f3-film.f3-has-still { min-height: min(640px, 80vh); padding-bottom: 48px; }
.f3 .f3-cdbox { display: flex; flex-direction: column; gap: 6px; padding: 24px; background: var(--f3-red); color: #fff; flex: 0 0 auto; min-width: 280px; }
.f3 .f3-cdbox .f3-k { color: #fff; }
.f3 .f3-cdbox .f3-cdn { font: 400 72px/.95 var(--serif); }
.f3 .f3-cdbox .f3-cdd { font: 500 15px/1.2 var(--sans); color: rgba(255, 255, 255, .9); }
.f3 .f3-flist > div { display: flex; flex-direction: column; gap: 4px; padding: 14px 0; border-bottom: 1px solid var(--f3-rule); }
.f3 .f3-flist dt { font: 600 var(--f3-floor)/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--f3-dim); }
.f3 .f3-flist dd { font: 400 22px/1.3 var(--serif); color: var(--f3-ink); }
.f3 .f3-flist .f3-fs { font: 400 var(--f3-floor)/1 var(--sans); color: var(--f3-faint); margin-left: 6px; white-space: nowrap; }
.f3 .f3-bonote { font: italic 400 18px/1.4 var(--serif); color: var(--f3-faint); }
.f3 .f3-bonote a { text-decoration: underline; }
.f3 .f3-bo { display: flex; flex-direction: column; gap: 8px; }
.f3 .f3-bo li { font: 400 22px/1.3 var(--serif); }
.f3 .f3-bo > a { font: 600 15px/1.2 var(--sans); color: var(--f3-redt); }
.f3-dossier .f3-cov .f3-story .f3-h:not(:lang(ja)) { font-size: 23px; }

/* ------------------------------------------------------------ In cinemas */
.f3 .f3-filters { display: flex; justify-content: space-between; align-items: center; gap: 12px 24px; flex-wrap: wrap; padding: 14px var(--f3-pad); border-bottom: 1px solid var(--f3-rule); }
.f3 .f3-filters[hidden] { display: none; }
.f3 .f3-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.f3 .f3-chips button { font: 500 15px/1.2 var(--sans); padding: 8px 16px; border-radius: 999px; border: 1px solid var(--f3-rule); color: var(--f3-dim); background: transparent; white-space: nowrap; cursor: pointer; }
.f3 .f3-chips button:hover { color: var(--f3-ink); border-color: var(--f3-faint); }
.f3 .f3-chips button[aria-pressed="true"] { background: var(--f3-ink); color: var(--f3-bg); border-color: var(--f3-ink); }
.f3 .f3-cal { padding: 24px var(--f3-pad) 56px; }
.f3 .f3-day { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: 16px 40px; padding: 28px 0; border-top: 1px solid var(--f3-rule); }
.f3 .f3-day[hidden], .f3 .f3-op[hidden] { display: none; }
.f3 .f3-date { display: flex; flex-direction: column; gap: 4px; font: 400 56px/.95 var(--serif); color: var(--f3-ink); }
.f3 .f3-date span { font: 600 var(--f3-floor)/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--f3-dim); }
.f3 .f3-date.f3-hot { color: var(--f3-redt); }
.f3 .f3-films { display: flex; flex-direction: column; gap: 14px; }
.f3 .f3-op { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(150px, max-content); align-items: center; gap: 8px 24px; }
.f3 .f3-opt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.f3 .f3-opt h3 { font: 400 32px/1.1 var(--serif); color: var(--f3-ink); }
.f3 .f3-opt h3 :lang(ja) { font-family: "Shippori Mincho", var(--serif); font-size: 26px; }
.f3 .f3-opt h3 a:hover { color: var(--f3-redt); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.f3 .f3-lab { font-size: .7em; color: var(--f3-dim); }
.f3 .f3-opt p { font: 400 var(--f3-floor)/1.45 var(--sans); color: var(--f3-dim); max-width: 760px; }
.f3 .f3-where { font: 400 var(--f3-floor)/1.2 var(--sans); color: var(--f3-ink); padding: 6px 12px; border: 1px solid var(--f3-rule); border-radius: 999px; white-space: nowrap; justify-self: end; }
.f3 .f3-op .f3-by { font: 500 var(--f3-floor)/1.3 var(--sans); color: var(--f3-redt); justify-self: end; text-align: right; }
.f3 .f3-op .f3-by:hover { text-decoration: underline; }
.f3 .f3-empty { padding: 24px 0; font: 400 22px/1.3 var(--serif); color: var(--f3-dim); }

/* ------------------------------------------------------------ Awards season */
.f3 .f3-awh { border-bottom: 0; padding-top: clamp(56px, 12vw, 180px); padding-bottom: 40px; }
.f3 .f3-awh .f3-h1 { font-size: clamp(52px, 8.3vw, 120px); line-height: .92; }
.f3 .f3-races { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 24px; padding: 48px var(--f3-pad) 24px; align-items: start; }
.f3 .f3-race { display: flex; flex-direction: column; gap: 14px; padding: 28px; background: var(--f3-panel); border-top: 2px solid var(--f3-rule); min-width: 0; }
.f3 .f3-race.f3-lead { border-top-color: var(--f3-red); }
.f3 .f3-race .f3-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.f3 .f3-state { font: 400 var(--f3-floor)/1.2 var(--sans); color: var(--f3-dim); }
.f3 .f3-race h2 { font: 400 40px/1 var(--serif); color: var(--f3-ink); }
.f3 .f3-rh { font: italic 400 26px/1.15 var(--serif); color: var(--f3-ink); }
.f3 .f3-rb { font: 400 18px/1.4 var(--serif); color: var(--f3-dim); }
.f3 .f3-pick { display: flex; flex-direction: column; gap: 6px; padding: 12px 0; border-top: 1px solid var(--f3-rule); border-bottom: 1px solid var(--f3-rule); }
.f3 .f3-pick .f3-rh { font-size: 28px; }
.f3 .f3-pl { font: 400 var(--f3-floor)/1.45 var(--sans); color: var(--f3-dim); }
.f3 .f3-bars ul { display: flex; flex-direction: column; gap: 10px; margin-top: 10px; }
.f3 .f3-bars li { display: grid; grid-template-columns: minmax(120px, 42%) 1fr 32px; align-items: center; gap: 12px; }
.f3 .f3-bn { font: 400 var(--f3-floor)/1.2 var(--sans); color: var(--f3-ink); }
.f3 .f3-tr { height: 14px; background: rgba(242, 239, 233, .05); }
.f3 .f3-tr i { display: block; height: 100%; background: var(--f3-red); }
.f3 .f3-bv { font: 400 24px/1 var(--serif); color: var(--f3-redt); text-align: right; }
.f3 .f3-race .f3-count { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; font: 400 var(--f3-floor)/1.3 var(--sans); color: var(--f3-dim); }
.f3 .f3-race .f3-count .f3-cdn { font: 400 56px/1 var(--serif); color: var(--f3-redt); }
.f3 .f3-rs { display: flex; flex-direction: column; gap: 4px; padding-top: 8px; }
.f3 .f3-rs .f3-stories { grid-template-columns: 1fr; }
.f3 .f3-rs .f3-story { grid-template-columns: 64px minmax(0, 1fr); padding: 10px 0; }
.f3 .f3-rs .f3-h { font-size: 19px; }
.f3 .f3-season { border-bottom: 0; padding-bottom: 72px; }
.f3 .f3-season .f3-td { font-size: 32px; }
.f3 .f3-season .f3-tl { font-size: 20px; }

/* ------------------------------------------------------------ narrower screens */
@media (max-width: 1099px) {
  .f3 .f3-body { grid-template-columns: minmax(0, 1fr); }
  .f3 .f3-op { grid-template-columns: minmax(0, 1fr) auto; }
  .f3 .f3-op .f3-by { grid-column: 1 / -1; justify-self: start; text-align: left; }
}
@media (max-width: 767px) {
  .f3 .f3-head { padding-top: 28px; }
  .f3 .f3-has-still { min-height: 340px; padding-bottom: 20px; }
  .f3 .f3-film.f3-has-still { min-height: 420px; padding-bottom: 20px; }
  .f3 .f3-local { font-size: 18px; }
  .f3 .f3-kick .f3-k { letter-spacing: .14em; }
  .f3 .f3-facts { gap: 12px 28px; }
  .f3 .f3-facts dd { font-size: 24px; }
  .f3 .f3-dek { font-size: 19px; }
  .f3 .f3-plain .f3-dek { display: none; }
  .f3 .f3-body { padding-top: 12px; gap: 32px; }
  .f3 .f3-sech h2, .f3 .f3-map h2, .f3 .f3-season h2 { font-size: 32px; }
  .f3 .f3-story.f3-pics { grid-template-columns: minmax(0, 1fr); padding: 14px 0; }
  .f3 .f3-pics .f3-pic { display: none; }
  .f3 .f3-pics .f3-h, .f3 .f3-h { font-size: 22px; }
  .f3 .f3-pics .f3-x { display: none; }
  .f3 .f3-story { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 12px 0; }
  .f3 .f3-film .f3-film-in { flex-direction: column; align-items: stretch; }
  .f3 .f3-film .f3-film-in > div:first-child { flex: none; }
  .f3 .f3-cdbox { margin: 0 calc(-1 * var(--f3-pad)); flex-direction: row; align-items: center; flex-wrap: wrap; gap: 4px 14px; padding: 16px var(--f3-pad); min-width: 0; }
  .f3 .f3-cdbox .f3-cdn { font-size: 40px; }
  .f3 .f3-tline { grid-template-columns: minmax(0, 1fr); border-left: 2px solid var(--f3-red); }
  .f3 .f3-tline li { display: grid; grid-template-columns: 84px minmax(0, 1fr); gap: 2px 14px; padding: 12px 0 12px 14px; }
  .f3 .f3-tline li::before, .f3 .f3-tline .f3-dot { display: none; }
  .f3 .f3-tline li.f3-past { border-left: 2px solid rgba(242, 239, 233, .3); margin-left: -2px; }
  .f3 .f3-td, .f3 .f3-season .f3-td { font-size: 22px; grid-row: 1 / span 3; }
  .f3 .f3-tl, .f3 .f3-season .f3-tl { font-size: 18px; }
  .f3 .f3-map, .f3 .f3-season { padding: 20px var(--f3-pad); gap: 12px; }
  .f3 .f3-filters { flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; padding: 0 var(--f3-pad) 12px; border-bottom: 0; scrollbar-width: none; }
  .f3 .f3-chips { flex-wrap: nowrap; }
  .f3 .f3-chips button { font-size: var(--f3-floor); padding: 7px 13px; }
  .f3 .f3-plain { padding-bottom: 16px; border-bottom: 0; }
  .f3 .f3-cal { padding-top: 0; }
  .f3 .f3-day { grid-template-columns: minmax(0, 1fr); gap: 8px; padding: 16px 0; }
  .f3 .f3-date { flex-direction: row; align-items: baseline; gap: 12px; font-size: 34px; }
  .f3 .f3-op { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; }
  .f3 .f3-opt h3 { font-size: 21px; }
  .f3 .f3-opt h3 :lang(ja) { font-size: 19px; }
  .f3 .f3-opt p { display: none; }
  .f3 .f3-where { font-size: var(--f3-floor); padding: 4px 10px; }
  .f3 .f3-op .f3-by { grid-column: 1 / -1; justify-self: start; text-align: left; }
  .f3 .f3-awh { padding-top: 28px; padding-bottom: 8px; }
  .f3 .f3-races { padding: 12px var(--f3-pad) 28px; gap: 12px; }
  .f3 .f3-race { padding: 18px; gap: 8px; }
  .f3 .f3-race h2 { font-size: 28px; }
  .f3 .f3-rh { font-size: 19px; }
  .f3 .f3-race .f3-count .f3-cdn { font-size: 40px; }
}
/* the festival board (/departures/, slice D's table): the link to our page under a festival's name */
html.cpd-dep #single .cpd-t td.c-n a.f3-ours { display: block; width: fit-content; margin-top: 6px; font: 600 14.6px/1.3 var(--sans); color: #FF4A5E; text-decoration: none; }
html.cpd-dep #single .cpd-t td.c-n a.f3-ours:hover { text-decoration: underline; }
html.cpd-dep #single .cpd-t td.c-n a.f3-ours:focus-visible { outline: 2px solid #FF4A5E; outline-offset: 3px; }

@media (prefers-reduced-motion: reduce) { .f3 * { transition: none !important; animation: none !important; } }

/* Cinepuuulse Partner kit, /partners/ (Pencil cine.pen, frames "Cinepuuulse · Partner kit · page (desktop) · 1440" vacYe and
   "(phone) · 390" OI3ok). A hand-made fragment (sites/ginmaku/pages/partners/index.html), wrapped by the build as
   <main class="single xpage xpage-partners">, between the site's own top bar and footer. Every rule sits under
   main.xpage-partners / .cpk, so no other page changes. The site has one theme (cp-shell.css pins the dark palette), so
   there is no light variant here. The same owner rules as stage 3: nothing under the site's 14.6 px floor (the frame's
   12 and 13 px labels are set at 14.6); body ink stays at 70 % or more on #0B0B0C. The 1440 frame's values are used as
   written; the large type scales with vw below it; under 1100 px the two-column bands stack; at 767 px and under the
   phone frame applies. IBM Plex Mono is not loaded by the site (config fonts_link), so the code line falls back to the
   system monospace: no font request is added for one line. */
main#single.xpage-partners{
  --cpk-bg:#0B0B0C;--cpk-panel:#141416;--cpk-ink:#F2EFE9;--cpk-dim:rgba(242,239,233,.7);--cpk-red:#D7263D;--cpk-redt:#FF4A5E;
  --cpk-floor:14.6px;--cpk-gut:max(clamp(20px,8.33vw,120px),calc((100% - 1200px) / 2));
  --cpk-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  display:block;max-width:none;width:auto;margin:0;padding:var(--cp-bar,64px) 0 0;background:var(--cpk-bg);color:var(--cpk-ink);
  font-family:var(--sans);text-align:left;overflow-x:clip
}
.cpk,.cpk *,.cpk *::before,.cpk *::after{box-sizing:border-box}
.cpk :is(h1,h2,h3,p,ul,ol){margin:0;padding:0}
.cpk :is(ul,ol){list-style:none}
.cpk a{color:inherit}
.cpk :is(a,button):focus-visible{outline:2px solid var(--cpk-redt);outline-offset:3px}
.cpk .cpk-vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.cpk .cpk-pad{padding:72px var(--cpk-gut)}
.cpk .cpk-k{font:700 var(--cpk-floor)/1.2 var(--sans);letter-spacing:3px;text-transform:uppercase;color:var(--cpk-redt)}
.cpk .cpk-h2{font:400 clamp(38px,3.9vw,56px)/1.02 var(--serif);letter-spacing:-1px;color:var(--cpk-ink)}
.cpk .cpk-h2-l{font-size:clamp(38px,4.45vw,64px)}
.cpk .cpk-h2-xl{font-size:clamp(48px,5vw,72px)}
.cpk .cpk-lede{font:400 18px/1.55 var(--sans);color:var(--cpk-dim)}
.cpk .cpk-lede a,.cpk-steps a{text-decoration:underline;text-decoration-color:rgba(255,74,94,.6);text-underline-offset:3px}
.cpk .cpk-lede a:hover,.cpk-steps a:hover{color:var(--cpk-redt)}
.cpk-i{display:block;flex:none;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* hero */
.cpk-hero{display:flex;align-items:center;justify-content:space-between;gap:64px;padding:96px var(--cpk-gut) 88px;
  background:radial-gradient(110% 160% at 78% 50%,#5A0B16 0,var(--cpk-bg) 70%)}
.cpk-hero-text{flex:0 1 656px;display:flex;flex-direction:column;gap:24px;min-width:0}
.cpk .cpk-big{font:400 clamp(60px,7.2vw,104px)/1.02 var(--serif);letter-spacing:-1px;color:var(--cpk-ink)}
.cpk-hero .cpk-lede{font-size:20px}
.cpk-btns{display:flex;flex-wrap:wrap;gap:16px;margin-top:8px}
.cpk-btn{display:inline-flex;align-items:center;gap:12px;border-radius:4px;text-decoration:none;color:var(--cpk-ink);transition:background-color .15s,border-color .15s}
.cpk-btn span{display:flex;flex-direction:column;gap:4px}
.cpk-btn b{font:700 17px/1.2 var(--sans)}
.cpk-btn small{font:600 var(--cpk-floor)/1.2 var(--sans);letter-spacing:0;color:rgba(242,239,233,.85)}
.cpk-btn-red{background:var(--cpk-red);padding:18px 22px}
.cpk-btn-red:hover{background:#B81D31}
.cpk-btn-line{border:1px solid rgba(242,239,233,.4);padding:17px 21px}
.cpk-btn-line small{color:var(--cpk-dim)}
.cpk-btn-line:hover{border-color:var(--cpk-ink);background:rgba(242,239,233,.06)}
.cpk-art{flex:0 1 480px;display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.cpk-art img{display:block;height:auto}
.cpk-laurel{width:min(400px,83%)}
.cpk-badge{width:min(380px,79%)}

/* what is inside */
.cpk-inside{display:flex;flex-direction:column;gap:28px}
.cpk-inside .cpk-k{margin-bottom:-8px}
.cpk-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;align-items:start}
.cpk-cards li{background:var(--cpk-panel);border-radius:6px;padding:28px;display:flex;flex-direction:column;gap:12px}
.cpk-cards h3{font:400 30px/1.1 var(--serif);color:var(--cpk-ink)}
.cpk-cards p{font:400 16px/1.55 var(--sans);color:var(--cpk-dim)}
.cpk-f{font:700 var(--cpk-floor)/1.3 var(--sans);letter-spacing:1.5px;text-transform:uppercase;color:var(--cpk-redt)}

/* tag it */
.cpk-tag{background:var(--cpk-panel);display:flex;gap:48px;justify-content:space-between;align-items:flex-start}
.cpk-tag-text{flex:0 1 520px;display:flex;flex-direction:column;gap:16px;min-width:0}
.cpk-tags{flex:0 1 632px;display:flex;flex-direction:column;gap:20px;min-width:0}
.cpk .cpk-ex{background:var(--cpk-bg);border-radius:4px;padding:18px 22px;font:400 15px/1.6 var(--cpk-mono);color:var(--cpk-ink);overflow-wrap:anywhere}
.cpk-chips{display:flex;flex-wrap:wrap;gap:12px 8px;max-width:470px}
.cpk-chips li{background:rgba(215,38,61,.2);border-radius:18px;padding:8px 16px;font:700 var(--cpk-floor)/1.15 var(--sans);letter-spacing:2px;text-transform:uppercase;color:var(--cpk-ink)}

/* the deal */
.cpk-deal{display:flex;flex-direction:column;gap:28px}
.cpk-deal .cpk-k{margin-bottom:-8px}
.cpk-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;align-items:start}
.cpk-steps li{background:var(--cpk-panel);border-radius:6px;padding:24px;display:flex;flex-direction:column;gap:10px;font:400 16px/1.55 var(--sans);color:var(--cpk-ink);overflow-wrap:break-word}
.cpk-steps b{font:400 48px/1 var(--serif);color:var(--cpk-redt)}
.cpk-steps .cpk-step5{background:var(--cpk-red)}
.cpk-steps .cpk-step5 b{color:var(--cpk-ink)}

/* proof */
.cpk-proof{display:flex;gap:64px;justify-content:space-between;align-items:flex-start}
.cpk-proof-text{flex:0 1 616px;display:flex;flex-direction:column;gap:16px;min-width:0}
.cpk-noproof{flex:0 1 520px;background:var(--cpk-red);border-radius:6px;padding:36px;display:flex;flex-direction:column;gap:12px;min-width:0}
.cpk-noproof .cpk-np{font:400 clamp(34px,3.06vw,44px)/1.1 var(--serif);color:var(--cpk-ink)}
.cpk-noproof p:not(.cpk-np){font:400 18px/1.55 var(--sans);color:var(--cpk-ink)}

/* copy the paragraph */
.cpk-copy{background:var(--cpk-panel);display:flex;flex-direction:column;gap:20px}
.cpk-copy .cpk-k{margin-bottom:0}
.cpk-box{position:relative;background:var(--cpk-bg);border-radius:6px;padding:28px;display:flex;align-items:center;gap:24px;margin-top:8px}
.cpk-tpl{flex:1 1 auto;min-width:0;font:400 16px/1.6 var(--cpk-mono);color:var(--cpk-ink);overflow-wrap:break-word}
.cpk-cbtn{flex:none;min-width:96px;background:var(--cpk-red);color:var(--cpk-ink);border:0;border-radius:4px;padding:14px 22px;font:700 15px/1.2 var(--sans);cursor:pointer;transition:background-color .15s}
.cpk-cbtn:hover{background:#B81D31}
.cpk-cbtn.is-done{background:#F2EFE9;color:#0B0B0C}
.cpk-small{font:400 15px/1.55 var(--sans);color:var(--cpk-dim)}

/* please note */
.cpk-note{padding-top:56px;padding-bottom:56px}
.cpk-note-box{border:1px solid var(--cpk-redt);border-radius:6px;padding:32px;display:flex;flex-direction:column;gap:10px}
main#single .cpk h2.cpk-pn{font:800 15px/1.2 var(--sans);letter-spacing:3px;text-transform:uppercase;color:var(--cpk-redt)}
.cpk-note-box p{font:400 clamp(22px,2.08vw,30px)/1.25 var(--serif);color:var(--cpk-ink)}

@media (max-width:1279px){
  .cpk-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cpk-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:1099px){
  .cpk-hero,.cpk-tag,.cpk-proof{flex-direction:column;align-items:stretch;gap:20px}
  .cpk-hero{gap:20px}
  .cpk-hero-text,.cpk-tag-text,.cpk-tags,.cpk-proof-text,.cpk-noproof{flex:none;width:100%}
  .cpk-art{align-self:center;width:min(480px,100%)}
}
@media (max-width:767px){
  .cpk .cpk-pad{padding:48px 20px}
  .cpk-hero{padding:48px 20px}
  .cpk .cpk-h2,.cpk .cpk-h2-l{font-size:38px}
  .cpk .cpk-h2-xl{font-size:48px}
  .cpk .cpk-big{font-size:60px}
  .cpk-hero .cpk-lede{font-size:17px}
  .cpk-btns{flex-direction:column;align-items:stretch;margin-top:0}
  .cpk-btn{width:100%}
  .cpk-laurel{width:300px;max-width:86%}
  .cpk-badge{width:300px;max-width:86%}
  .cpk-cards,.cpk-steps{grid-template-columns:minmax(0,1fr)}
  .cpk-chips{max-width:none}
  .cpk-noproof .cpk-np{font-size:34px}
  .cpk-box{flex-direction:column;align-items:center}
  .cpk-tpl{font-size:14.6px}
  .cpk-note-box p{font-size:22px}
}
@media (prefers-reduced-motion:reduce){
  .cpk-btn,.cpk-cbtn{transition:none}
}

/* Cinepuuulse: a film's press material written up as our own article, in the film-dossier layout (2026-10-23, an owner
   rule). Pencil file cine.pen, frames eo9Mr (desktop 1440) and FNZYt (phone 390), "Article · Mongolia's
   Oscar entry". The page is hand-made under pages/film/<slug>/ and reuses the dossier's .f3 head, red box, timeline and
   facts list from cp3-f.css; this file adds only what the dossier has no part for: the story column, the pull quote, the
   stills, the director block and the cast list. Every rule is scoped to .cpa. Owner rules kept: nothing under the
   14.6 px floor; a vertical still is never alone, it sits with a second vertical and a wide one, and is shown whole. */

.f3.cpa .f3-film .f3-h1 { font-size: clamp(46px, 7.2vw, 104px); line-height: .98; letter-spacing: -.02em; max-width: 1008px; }
.f3.cpa .f3-film .f3-dek { max-width: 820px; }
.f3.cpa .cpa-kick { color: var(--f3-redt); }
.f3.cpa .f3-cdbox .f3-cdn { font-size: 64px; }
.f3.cpa .cpa-src { font: 400 var(--f3-floor)/1.3 var(--sans); color: var(--f3-faint); }
.f3.cpa .f3-tline { grid-auto-columns: minmax(200px, 1fr); }

.f3.cpa .cpa-h { font: 400 44px/1.1 var(--serif); color: var(--f3-ink); }
.f3.cpa .cpa-k { font: 600 var(--f3-floor)/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--f3-redt); }

/* the story, its pull quote and the facts beside it (the dossier's .f3-body grid) */
.f3.cpa .f3-body { border-top: 1px solid var(--f3-rule); padding-top: 48px; }
.f3.cpa .cpa-story { display: flex; flex-direction: column; gap: 26px; max-width: 892px; min-width: 0; }
.f3.cpa .cpa-story p { font: 400 22px/1.5 var(--serif); color: var(--f3-ink); }
.f3.cpa .cpa-story .cpa-lead { font-size: 26px; line-height: 1.45; }
.f3.cpa .cpa-quote { margin: 0; padding: 20px 0 20px 28px; border-left: 3px solid var(--f3-red); display: flex; flex-direction: column; gap: 16px; }
.f3.cpa .cpa-quote p { font: italic 400 40px/1.1 var(--serif); }
.f3.cpa .cpa-quote cite { font: 600 var(--f3-floor)/1.2 var(--sans); font-style: normal; letter-spacing: .14em; text-transform: uppercase; color: var(--f3-redt); }

/* stills: three wide in a row, then two verticals shown whole with a wide one beside them */
.f3.cpa .cpa-stills { padding: 0 var(--f3-pad) 64px; display: flex; flex-direction: column; gap: 24px; }
.f3.cpa .cpa-row { display: grid; gap: 16px; }
.f3.cpa .cpa-row-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.f3.cpa .cpa-row-v { grid-template-columns: minmax(0, 9fr) minmax(0, 9fr) minmax(0, 24fr); align-items: start; }
.f3.cpa .cpa-stills figure { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.f3.cpa .cpa-stills img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: var(--f3-panel); }
.f3.cpa .cpa-row-v .cpa-v img { aspect-ratio: 9 / 16; }
.f3.cpa .cpa-row-v .cpa-w { align-self: stretch; }
.f3.cpa .cpa-row-v .cpa-w img { flex: 1; aspect-ratio: auto; min-height: 0; height: 100%; }
.f3.cpa .cpa-stills figcaption { display: flex; gap: 10px; align-items: baseline; font: 400 var(--f3-floor)/1.35 var(--sans); color: var(--f3-dim); }
.f3.cpa .cpa-stills figcaption::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--f3-red); transform: translateY(-1px); }

/* the director: the bio, and the awards in the dossier's facts list */
.f3.cpa .cpa-dir { display: grid; grid-template-columns: minmax(0, 1fr) clamp(320px, 29vw, 520px); gap: 48px 72px; padding: 48px var(--f3-pad) 64px; border-top: 1px solid var(--f3-rule); }
.f3.cpa .cpa-bio { display: flex; flex-direction: column; gap: 24px; max-width: 892px; }
.f3.cpa .cpa-bio p:not(.cpa-k) { font: 400 22px/1.5 var(--serif); color: var(--f3-ink); }
.f3.cpa .cpa-awards dd { font-size: 22px; }

/* who plays whom */
.f3.cpa .cpa-cast { padding: 48px var(--f3-pad) 40px; border-top: 1px solid var(--f3-rule); display: flex; flex-direction: column; gap: 24px; }
.f3.cpa .cpa-cast ul { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 24px; }
.f3.cpa .cpa-cast li { display: flex; flex-direction: column; gap: 4px; padding: 14px 0 16px; border-top: 1px solid var(--f3-rule); }
.f3.cpa .cpa-cast b { font: 400 30px/1.1 var(--serif); color: var(--f3-ink); }
.f3.cpa .cpa-cast span { font: 600 15px/1.2 var(--sans); color: var(--f3-redt); }

.f3.cpa .cpa-end { display: flex; gap: 16px; align-items: baseline; max-width: calc(892px + 2 * var(--f3-pad)); padding: 24px var(--f3-pad) 88px; font: 400 var(--f3-floor)/1.55 var(--sans); color: var(--f3-dim); }
.f3.cpa .cpa-end::before { content: ""; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--f3-red); }

@media (max-width: 1099px) {
  .f3.cpa .cpa-dir { grid-template-columns: minmax(0, 1fr); }
  .f3.cpa .cpa-cast ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* phone (FNZYt): one column; the two verticals stay side by side, every wide still on its own row */
@media (max-width: 767px) {
  /* the still is shown whole above the title, not under it (owner 2026-10-23: the text covered the picture) */
  .f3.cpa .f3-film.f3-has-still { display: block; min-height: 0; padding: 0; }
  .f3.cpa .f3-film .f3-still { position: relative; inset: auto; height: auto; }
  .f3.cpa .f3-film .f3-still .f3-bg { position: relative; inset: auto; }
  .f3.cpa .f3-film .f3-still img { aspect-ratio: 16 / 9; height: auto; }
  .f3.cpa .f3-film .f3-still::after { content: none; }
  .f3.cpa .f3-film .f3-film-in { padding: 20px var(--f3-pad) 0; gap: 22px; }
  .f3.cpa .f3-film .f3-h1 { font-size: 46px; line-height: 1; letter-spacing: -.01em; }
  .f3.cpa .f3-film .f3-dek { font-size: 17px; }
  .f3.cpa .f3-cdbox { flex-direction: column; align-items: flex-start; gap: 4px; }
  .f3.cpa .f3-cdbox .f3-cdn { font-size: 44px; }
  .f3.cpa .cpa-h { font-size: 30px; }
  .f3.cpa .f3-body { padding-top: 28px; }
  .f3.cpa .cpa-story { gap: 18px; }
  .f3.cpa .cpa-story p, .f3.cpa .cpa-bio p:not(.cpa-k) { font-size: 18px; }
  .f3.cpa .cpa-story .cpa-lead { font-size: 20px; }
  .f3.cpa .cpa-quote { padding: 8px 0 8px 16px; gap: 10px; }
  .f3.cpa .cpa-quote p { font-size: 27px; line-height: 1.12; }
  .f3.cpa .cpa-stills { gap: 18px; padding-bottom: 32px; }
  .f3.cpa .cpa-row-3 { grid-template-columns: minmax(0, 1fr); gap: 18px; }
  .f3.cpa .cpa-row-v { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px 10px; }
  .f3.cpa .cpa-row-v .cpa-w { grid-column: 1 / -1; }
  .f3.cpa .cpa-row-v .cpa-w img { aspect-ratio: 16 / 9; height: auto; }
  .f3.cpa .cpa-dir { padding: 28px var(--f3-pad) 24px; gap: 16px; }
  .f3.cpa .cpa-bio { gap: 16px; }
  .f3.cpa .cpa-cast { padding: 28px var(--f3-pad) 16px; gap: 8px; }
  .f3.cpa .cpa-cast ul { grid-template-columns: minmax(0, 1fr); }
  .f3.cpa .cpa-cast li { flex-direction: row; justify-content: space-between; align-items: baseline; gap: 12px; padding: 12px 0; border-top: 0; border-bottom: 1px solid var(--f3-rule); }
  .f3.cpa .cpa-cast b { font-size: 21px; }
  .f3.cpa .cpa-cast span { font-size: var(--f3-floor); text-align: right; }
  .f3.cpa .cpa-end { padding: 20px var(--f3-pad) 40px; }
}

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