/* Static news pages. Shared PCPDF tokens and nav live in ../read/style.css. */
@view-transition{navigation:auto}
.news-head{padding:40px 0 34px;background:var(--paper-deep);border-bottom:1px solid var(--hair)}
.news-head .wrap,.news-list.wrap{max-width:1400px}
.news-head .wrap{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-rows:auto auto;column-gap:56px;align-items:end}
.news-head h1{grid-column:1;grid-row:1;max-width:none;white-space:nowrap}.news-head .gold-rule{grid-column:1;grid-row:2;margin-top:20px}
.news-head .lede{grid-column:2;grid-row:1/3;align-self:center;max-width:48ch;border-left:1px solid var(--hair);padding-left:32px;margin:0;text-wrap:balance}
.news-meta,.news-summary-label,.news-auto{font-family:var(--mono);font-size:15px;letter-spacing:.05em;color:var(--gold-text);text-transform:uppercase}
.news-list{padding-top:36px;padding-bottom:88px}
.news-card{display:block;color:inherit;text-decoration:none;background:#efe5cc;overflow:hidden;animation:news-rise .52s cubic-bezier(.23,1,.32,1) both;animation-delay:calc(var(--news-n) * 55ms)}
.news-card:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(60,48,30,.16)}.news-card:active{transform:scale(.985)}
.news-image{aspect-ratio:16/10;overflow:hidden;background:var(--paper-deep)}.news-image img,.news-hero img{width:100%;height:100%;object-fit:cover;display:block;filter:sepia(.55) saturate(.72);transition:transform .38s var(--ease),filter .38s var(--ease)}
.news-card:hover img{filter:sepia(0) saturate(1);transform:scale(1.035)}.news-copy{padding:27px 28px 24px}.news-meta{display:flex;gap:11px;justify-content:space-between;margin-bottom:14px}.news-meta time{color:var(--ink-mute)}
.news-card h2{font-size:21px;line-height:1.3;max-width:18ch;margin-bottom:12px}.news-card p:not(.news-meta):not(.news-auto){font-size:18px;text-wrap:pretty;line-height:1.65;color:var(--ink-soft)}
.news-auto{display:flex;justify-content:space-between;align-items:center;margin-top:19px}.news-arrow{width:9px;height:9px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);transition:transform .2s var(--ease)}.news-card:hover .news-arrow{transform:rotate(45deg) translate(3px,-3px)}
.news-month{font-family:var(--mono);font-size:15px;font-weight:400;letter-spacing:.12em;text-transform:uppercase;max-width:none;border-bottom:2px solid var(--gold);padding-bottom:12px;margin:0 0 23px}.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-bottom:60px}
.news-note{border-top:1px solid var(--hair);padding-top:24px;font-size:15px;color:var(--ink-mute);max-width:72ch}.news-first{border:1px solid rgba(163,129,46,.55);background:#efe5cc;padding:28px;font-size:19px;margin-bottom:40px}
.news-item{padding-top:66px;padding-bottom:64px}.news-back{font-family:var(--sans);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);text-decoration:none;display:inline-flex;margin-bottom:38px;border-bottom:1px solid var(--gold);padding-bottom:5px}.news-item-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.85fr);gap:58px;align-items:start}.news-item h1{max-width:18ch;margin-bottom:30px}.news-summary{border:1px solid rgba(163,129,46,.55);outline:5px double rgba(163,129,46,.17);outline-offset:-7px;background:#efe5cc;padding:28px;margin:28px 0}.news-summary-label{margin-bottom:12px}.news-summary p:not(.news-summary-label):not(.news-auto){font-size:17.5px;line-height:1.65;color:var(--ink-soft)}.news-source{margin-top:4px;font-size:15px}.news-hero{aspect-ratio:4/5;border:1px solid rgba(163,129,46,.55);padding:7px;background:#efe5cc}.news-hero img{filter:sepia(.42)}.news-more{padding-bottom:96px}.news-more .news-grid{margin-bottom:0}
/* Front row (ticket 39): lead with its photo beside the copy, the next item beside it; both end on one line */
.news-front{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(0,1fr);gap:28px;margin-bottom:64px}
.news-card.news-lead{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr)}
.news-lead .news-image{aspect-ratio:auto;height:100%;min-height:420px}.news-lead .news-copy{padding:30px 34px 28px;display:flex;flex-direction:column}.news-lead .news-auto{margin-top:auto;padding-top:19px}
.news-card.news-lead h2{font-size:30px;line-height:1.2;max-width:none;margin-bottom:14px}
.news-side{display:flex;flex-direction:column}.news-side .news-image{aspect-ratio:2/1}.news-side .news-copy{flex:1;display:flex;flex-direction:column;padding-bottom:28px}
.news-card.news-side h2{max-width:none}.news-front [data-news-summary]{max-width:72ch}.news-side .news-auto{margin-top:auto;padding-top:19px}
html[lang="zh-Hans"] .news-month{max-width:none}
@keyframes news-rise{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1920px){.news-head .wrap,.news-list.wrap,.nav-in,.foot{max-width:min(2100px,88vw)}.news-meta,.news-summary-label,.news-auto,.news-month,.news-note{font-size:16px}.news-card p:not(.news-meta):not(.news-auto),.news-summary p:not(.news-summary-label):not(.news-auto){font-size:20px}.news-card h2{font-size:23px}.news-card.news-lead h2{font-size:34px}.news-head .lede{font-size:22px;max-width:60ch}.news-head h1{font-size:88px}.news-side .news-image{aspect-ratio:2.6/1}}
@media(max-width:1280px){.news-head .wrap{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.news-head h1{white-space:normal}.news-front{grid-template-columns:1fr}.news-side .news-image{aspect-ratio:16/7}}
@media(max-width:980px){.news-head .wrap{grid-template-columns:1fr;grid-template-rows:none}.news-head h1,.news-head .gold-rule,.news-head .lede{grid-column:1;grid-row:auto}.news-head .lede{border-left:0;padding-left:0;margin-top:22px}.news-grid{grid-template-columns:repeat(2,1fr)}.news-item-grid{gap:34px}}
@media(max-width:680px){.news-head{padding:60px 0 34px}.news-list,.news-item{padding-top:40px}.news-card.news-lead,.news-item-grid,.news-grid{grid-template-columns:1fr}.news-lead .news-image{aspect-ratio:16/10;height:auto;min-height:0}.news-front{margin-bottom:46px;gap:22px}.news-card.news-lead h2{font-size:24px}.news-grid{gap:22px;margin-bottom:45px}.news-copy{padding:24px 22px}.news-hero{order:-1;aspect-ratio:16/10}.news-source{width:100%;justify-content:center}.news-back{padding-top:18px;margin-top:-18px}.news-more{padding-bottom:64px}}
@media(prefers-reduced-motion:reduce){.news-card{animation:news-fade .2s ease both}.news-card,.news-image img,.news-hero img,.news-arrow{transition:none}.news-card:hover,.news-card:active{transform:none}}@keyframes news-fade{from{opacity:0}to{opacity:1}}
/* Card B (owner pick 2026-09-27), ported from .scratch/design-md/proof/news-on-site/index.html.
   Stacked on the rules above in the same order the approved preview used, so the cascade matches it. */
.news-card{background:#1d1d20;color:#fbf9f4;border-radius:22px;overflow:hidden;isolation:isolate;
  box-shadow:0 1px 2px rgba(29,29,32,.14),0 18px 40px -22px rgba(29,29,32,.4);transition:transform .32s cubic-bezier(.22,1,.36,1),box-shadow .32s cubic-bezier(.22,1,.36,1)}
.news-card:hover{transform:translateY(-6px);box-shadow:0 1px 2px rgba(29,29,32,.18),0 30px 54px -20px rgba(29,29,32,.55)}
.news-card:focus-visible{outline:3px solid #a3812e;outline-offset:3px}
.news-image img,.news-card:hover img{filter:none}
.news-card .news-meta{font-family:"Spline Sans Mono",ui-monospace,monospace;text-transform:none;letter-spacing:.01em;font-size:16px;justify-content:flex-start;gap:12px}
.news-card .news-meta span{color:#c9ab62;font-weight:600}.news-card .news-meta time{color:#fbf9f4}
.news-card h2{font-family:"EB Garamond",Georgia,serif;color:#fbf9f4;font-weight:600}
.news-card p[data-news-summary]{color:rgba(251,249,244,.78)!important;font-family:Archivo,-apple-system,sans-serif;font-size:20px!important;line-height:1.55!important;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-card .news-auto{font-family:Archivo,-apple-system,sans-serif;text-transform:none;letter-spacing:0;font-style:italic;font-size:16px;color:rgba(251,249,244,.62);margin-top:14px}
.b-foot{display:flex;justify-content:flex-end;align-items:center;gap:16px;border-top:1px solid rgba(251,249,244,.14);padding-top:18px;margin-top:18px;
  font:600 18px/1 Archivo,-apple-system,sans-serif;color:#fbf9f4}
.b-corner{width:48px;height:48px;border-radius:14px 4px 14px 14px;background:#a61820;display:flex;align-items:center;justify-content:center;transition:background .28s ease,transform .32s cubic-bezier(.22,1,.36,1)}
.b-corner svg{width:20px;height:20px;stroke:#fbf9f4;transition:transform .32s cubic-bezier(.22,1,.36,1)}
.news-card:hover .b-corner{background:#8c1119;transform:rotate(45deg)}.news-card:hover .b-corner svg{transform:rotate(-45deg)}
.news-card p.b-foot{color:#fbf9f4!important;font-size:18px!important;line-height:1!important}
.news-lead .news-copy,.news-side .news-copy{display:flex;flex-direction:column}.news-copy .b-foot{margin-top:auto}
/* fixes 2026-09-27: lead card fills its height, meta keeps its dot */
.news-lead .news-image{min-height:0;height:auto}
.news-front{align-items:stretch}
.news-card.news-lead p[data-news-summary]{-webkit-line-clamp:5}
.news-card .news-meta time::before{content:"·";margin-right:12px;color:rgba(251,249,244,.5)}
/* colorize 2026-09-27: warm the ink toward the chart's brown so the dark cards belong to the cream paper;
   gold measures (dates, dividers, notes), red acts (the button, selection) */
:root{--card-ink:#211b16;--card-ink-hi:#2b231c;--card-text:#fbf9f4;--card-soft:#dcd4c4;--card-note:#b9a67c;--card-rule:rgba(201,171,98,.24)}
.news-card{background:var(--card-ink)}
.news-card:hover{background:var(--card-ink-hi)}
.news-card p[data-news-summary]{color:var(--card-soft)!important}
.news-card .news-auto{color:var(--card-note)}
.news-card .news-meta time{color:var(--card-soft)}
.news-card .news-meta time::before{color:var(--card-note)}
.b-foot{border-top-color:var(--card-rule)}
.news-card:hover p.b-foot{color:#e7d3a3!important}
footer{background:var(--card-ink)}
::selection{background:#a61820;color:#fbf9f4}
html{caret-color:#a61820;accent-color:#a61820}
a:focus-visible{outline-color:#a61820}
.news-card:focus-visible{outline:3px solid #a3812e;outline-offset:4px}
/* layout 2026-09-27: the head is a title, not a band; the source note closes the page inside the footer */
.news-head{background:none;border-bottom:0;padding:64px 0 0}
.news-head .wrap{grid-template-columns:minmax(0,auto) minmax(0,1fr);column-gap:72px;align-items:end}
.news-head h1{margin:0}
.news-head .gold-rule{margin-top:18px}
.news-head .lede{grid-row:1/3;border-left:0;padding-left:0;justify-self:end;align-self:end;max-width:46ch;margin:0 0 -8px;text-wrap:pretty}
.news-list{padding-top:44px;padding-bottom:72px}
.nav-links a,.langs a,.langs span{font-size:16px}
.brand .t small{font-size:16px}
footer{padding:0}
.foot-note{max-width:72ch;margin:0 calc((100% - min(2100px,88vw))/2 + 48px);padding:44px 0 28px;border:0;font:400 16px/1.6 Archivo,-apple-system,sans-serif;color:#cfc6b4}
.foot{max-width:calc(min(2100px,88vw) - 96px);padding:30px 0;align-items:center;font-size:16px;letter-spacing:.02em;color:#b9b2a3}
.foot a{color:#e7d3a3}
body{min-height:100vh;display:flex;flex-direction:column}main{flex:1 0 auto}
/* polish + adapt 2026-09-27: nav and footer sit on the card grid; every size has a composition */
.nav-in{justify-content:flex-start;max-width:min(2100px,88vw);padding-top:18px;padding-bottom:18px}
.nav-links{margin-left:auto;gap:34px}
.nav-right{gap:18px}
.langs{margin-right:-10px}
.brand img{height:52px}
.brand .t{font-size:19px}
.menu summary,.menu-panel a{font-size:15px}
.foot{display:flex;justify-content:space-between;align-items:center;gap:40px;padding:44px 0 48px;flex-wrap:nowrap;letter-spacing:0}
.f-id{display:flex;align-items:center;gap:18px}
.f-id img{height:56px;width:auto}
.f-id p{margin:0}
.f-en{font:500 22px/1.25 "EB Garamond",Georgia,serif;color:#f3eee2}
.f-alt{font:400 16px/1.5 Archivo,-apple-system,sans-serif;color:#b9b2a3;margin-top:6px!important}
.f-meta{display:flex;flex-direction:column;align-items:flex-end;gap:4px;font:400 16px/1.5 Archivo,-apple-system,sans-serif;color:#b9b2a3;text-align:right}
.f-meta a{min-height:44px;font-size:18px;color:#e7d3a3}
.f-meta a:hover{color:#fbf9f4}
.langs a{white-space:nowrap}
@media(max-width:1560px){.nav-links{gap:22px}.nav-links a{letter-spacing:.08em}}
@media(max-width:1280px){.news-front{grid-template-columns:1fr}.news-lead .news-image{min-height:380px}}
@media(max-width:1080px){.nav-right{margin-left:auto}}
@media(max-width:980px){.news-card.news-lead{grid-template-columns:1fr}.news-lead .news-image{min-height:0;aspect-ratio:16/10}}
@media(max-width:760px){
  .news-head{padding-top:36px}.news-list{padding-top:28px;padding-bottom:48px}
  .foot{flex-direction:column;align-items:flex-start;gap:24px;padding:36px 22px 40px;max-width:none}
  .f-meta{align-items:flex-start;text-align:left}
  .f-id{align-items:flex-start}.f-id img{height:44px}
  .b-foot{padding-top:14px}
  .news-card h2{font-size:24px!important}
  .nav-in{gap:12px}.brand{flex:none}.brand img{height:44px}.nav-right{margin-left:auto;gap:10px}.langs{margin-right:0}
  .news-card.news-lead p[data-news-summary]{-webkit-line-clamp:4}
}
@media(max-width:480px){.brand .t{display:none}
}
/* typeset 2026-09-27: headline, summary, note read as three clear steps (36 / 26 / 18 at 1440) */
.news-card h2{text-wrap:balance;letter-spacing:-.005em}
.news-card.news-lead h2{font-size:clamp(34px,2.5vw,52px)!important;line-height:1.12;margin-bottom:18px}
.news-card.news-side h2{font-size:clamp(26px,1.8vw,36px)!important;line-height:1.18}
.news-card p[data-news-summary]{font-size:clamp(18px,calc(.18vw + 15.4px),20px)!important;line-height:1.62!important;letter-spacing:.005em;max-width:60ch}
@media(max-width:760px){.news-card.news-lead h2{font-size:25px!important}.news-card.news-side h2{font-size:24px!important}.news-card p[data-news-summary]{font-size:18px!important}}
/* layout 2026-09-27: picture leads the lead card; the note stays with its summary, spare room sits above the action */
@media(min-width:981px){.news-card.news-lead{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}}
.news-lead .news-auto,.news-side .news-auto{margin-top:14px;padding-top:0}
.news-copy .b-foot{margin-top:auto}
/* fit 2026-09-27: on a laptop (two columns, under 1920) both cards end inside an 820px window */
@media(min-width:1281px) and (max-width:1919px){.news-head{padding-top:30px}.news-list{padding-top:26px}.news-side .news-image{aspect-ratio:3/1}}
/* nav 2026-09-27: logo and footer start on the cards' left edge; the full name stays on one line */
@media(min-width:761px) and (max-width:1919px){.foot{max-width:calc(min(1400px,100vw) - 96px)}}
@media(min-width:1360px){.brand .t small{white-space:nowrap}}
/* header 2026-09-27: the bar spans the window; emblem and name at the left edge, pages and languages at the right */
.nav-in{max-width:none!important}@media(min-width:761px){.nav-in{padding-left:clamp(24px,2.2vw,56px);padding-right:clamp(24px,2.2vw,56px)}.langs{margin-right:0}}
/* width 2026-09-27: on big screens the column widens and the gap between the cards grows with the window */
.news-front{gap:clamp(28px,2.4vw,72px)}
@media(min-width:1920px){.news-head .wrap,.news-list.wrap,.foot{max-width:min(2400px,94vw)}.foot{max-width:calc(min(2400px,94vw) - 96px)}}
/* height 2026-09-27: when the window is taller than the page, the cards take the spare height (the pictures grow), not the cream gap above the footer */
main{display:flex;flex-direction:column}
.news-list{flex:1 0 auto;display:flex;flex-direction:column;padding-bottom:clamp(40px,3.6vw,72px)}
.news-front{flex:1 0 auto;margin-bottom:0}
.news-side .news-image{flex:1 0 auto}
.news-lead .news-copy h2{margin-top:auto}.news-lead .news-copy .b-foot{margin-top:28px}
/* title row 2026-09-27: tighter band, the cards start sooner */
.news-head{padding-top:clamp(24px,1.8vw,44px)}
.news-head .gold-rule{margin-top:12px}
.news-list{padding-top:clamp(20px,1.4vw,32px)}
/* grid below the front row (owner pick 2026-09-27): same card, same gap as the front row, one column per side card */
.news-front+.news-month{margin-top:clamp(48px,4vw,88px)}
.news-grid{gap:clamp(28px,2.4vw,72px);margin-bottom:clamp(48px,4vw,88px)}
.news-grid .news-card{display:flex;flex-direction:column}
.news-grid .news-image{aspect-ratio:2/1}
.news-grid .news-copy{flex:1;display:flex;flex-direction:column}
.news-grid .news-card h2{max-width:none;font-size:clamp(22px,1.5vw,30px);line-height:1.2}
.news-card .news-meta{flex-wrap:wrap;row-gap:4px}
.news-card .news-meta time{white-space:nowrap}
@media(min-width:1920px){.news-grid .news-image{aspect-ratio:2.6/1}}
@media(max-width:1280px){.news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.news-grid{grid-template-columns:1fr}}  /* the 1280 rule above had overridden the phone's one column */
.news-grid .news-card:only-child{grid-column:1/-1}  /* a month with one story fills its row */
@media(min-width:981px){.news-grid .news-card:only-child{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}.news-grid .news-card:only-child .news-image{aspect-ratio:auto;height:100%;min-height:320px}.news-grid .news-card:only-child p[data-news-summary]{-webkit-line-clamp:8}}
.f-meta span,.f-meta div{white-space:nowrap}
/* article page in card B (2026-09-27): one dark card, copy left, picture filling the right side edge to edge
   (reference: Microsoft Copilot story card on Mobbin); same ink, gold meta and red action as the list cards */
.news-grid .news-card p[data-news-summary]{-webkit-line-clamp:4}
.news-item{padding-top:clamp(24px,1.8vw,44px);padding-bottom:clamp(48px,4vw,88px)}
.news-item.wrap,.news-more.wrap{max-width:1400px}
.news-back{font:600 16px/1 Archivo,-apple-system,sans-serif;letter-spacing:0;text-transform:none;color:var(--ink);border:0;padding:12px 0;margin-bottom:12px;min-height:44px;align-items:center;gap:10px}
.news-back::before{content:"←";color:#a61820}
.news-back:hover{color:#a61820}
.news-item-grid{gap:0;align-items:stretch;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);background:var(--card-ink);color:var(--card-text);border-radius:22px;overflow:hidden;
  box-shadow:0 1px 2px rgba(29,29,32,.14),0 18px 40px -22px rgba(29,29,32,.4)}
.news-item-copy{padding:clamp(32px,3vw,64px);display:flex;flex-direction:column}
.news-item .news-meta{font-family:"Spline Sans Mono",ui-monospace,monospace;text-transform:none;letter-spacing:.01em;font-size:16px;justify-content:flex-start;gap:12px;flex-wrap:wrap;row-gap:4px}
.news-item .news-meta span{color:#c9ab62;font-weight:600}
.news-item .news-meta time{color:var(--card-soft);white-space:nowrap}
.news-item .news-meta time::before{content:"·";margin-right:12px;color:var(--card-note)}
.news-item h1{font-family:"EB Garamond",Georgia,serif;font-weight:600;color:var(--card-text);font-size:clamp(38px,3vw,60px);line-height:1.1;max-width:none;margin:0 0 28px;text-wrap:balance;letter-spacing:-.005em}
.news-summary{border:0;outline:0;background:none;padding:0;margin:0 0 32px}
.news-summary-label{font-family:"Spline Sans Mono",ui-monospace,monospace;text-transform:none;letter-spacing:.01em;font-size:16px;color:var(--card-note);margin-bottom:10px}
.news-summary p:not(.news-summary-label):not(.news-auto){font-family:Archivo,-apple-system,sans-serif;font-size:clamp(18px,calc(.18vw + 15.4px),20px);line-height:1.62;color:var(--card-soft);max-width:60ch}
.news-summary .news-auto{font-family:Archivo,-apple-system,sans-serif;text-transform:none;letter-spacing:0;font-style:italic;font-size:16px;color:var(--card-note);margin-top:14px;display:block}
.news-item .btn-red.news-source{margin-top:auto;align-self:flex-start;display:inline-flex;align-items:center;gap:4px;min-height:52px;padding:0 24px;border-radius:14px 4px 14px 14px;
  background:#a61820!important;border:0!important;color:#fbf9f4!important;font:600 18px/1 Archivo,-apple-system,sans-serif;letter-spacing:0;text-transform:none;text-decoration:none;
  transition:background .28s ease}
.news-item .btn-red.news-source:hover{background:#8c1119!important}
.news-item .btn-red.news-source:focus-visible{outline:3px solid #a3812e;outline-offset:3px}
.news-hero{aspect-ratio:auto;border:0;padding:0;background:none;min-height:520px}
.news-hero img{filter:none}
.news-more .news-month{margin-top:0}
@media(max-width:980px){.news-item-grid{grid-template-columns:1fr}.news-hero{order:-1;min-height:0;aspect-ratio:16/9}}
@media(min-width:1920px){.news-item.wrap,.news-more.wrap{max-width:min(2400px,94vw)}.news-hero{min-height:680px}}
.zh-words{word-break:keep-all;overflow-wrap:anywhere}
/* short windows (owner yes 2026-09-27): on a 1536x695 laptop the front row ran past the first screen and
   cut off Read more; under 760 tall the headline steps down, summaries shorten and the side picture flattens. */
@media (min-width:1281px) and (max-height:760px){
  .news-card.news-lead h2{font-size:clamp(30px,2.1vw,40px)!important}
  .news-card.news-lead p[data-news-summary]{-webkit-line-clamp:3}
  .news-lead .news-copy .b-foot{margin-top:18px}
  .news-head{padding-top:14px}
  .news-list{padding-top:14px}
  .news-card.news-side p[data-news-summary]{-webkit-line-clamp:2}
  .news-side .news-image{aspect-ratio:3.6/1}
}

/* Compact row card (owner pick 2026-10-13, direction 5 of the news-list review mock): every item on the list, lead and side
   included, is a horizontal ivory card: picture left, outlet, date, headline and Read more right. No summary and no
   automatic-translation note on the list (the item page keeps both). Supersedes the dark Card B for the list only;
   .news-item rules above are untouched. The P prefix outweighs the lead, side and only-child rules earlier in this file. */
:root{--k-ink:#211b16;--k-paper:#fffdf8;--k-line:#e4dccb;--k-gold:#7a5c16;--k-soft:#4a4038}
.news-front,.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr));gap:14px;margin-bottom:0}
.news-grid{margin-bottom:clamp(48px,4vw,88px)}
:is(.news-front,.news-grid) .news-card.news-card{grid-column:auto;display:grid;grid-template-columns:38% minmax(0,1fr);background:var(--k-paper);color:var(--k-ink);
  border:1px solid var(--k-line);border-radius:16px;box-shadow:0 18px 34px -30px rgba(60,48,30,.5);animation:none;
  transition:transform .16s cubic-bezier(.23,1,.32,1),background-color .2s ease,box-shadow .32s cubic-bezier(.22,1,.36,1)}
:is(.news-front,.news-grid) .news-card.news-card:focus-visible{outline:3px solid #a3812e;outline-offset:3px}
:is(.news-front,.news-grid) .news-card.news-card:active{transform:scale(.985)}
:is(.news-front,.news-grid) .news-card.news-card .news-image{aspect-ratio:auto;height:100%;min-height:150px;flex:none}
:is(.news-front,.news-grid) .news-card.news-card .news-copy{padding:16px 16px 14px;display:flex;flex-direction:column;gap:8px}
:is(.news-front,.news-grid) .news-card.news-card .news-meta{margin:0;font-size:15px;flex-direction:column;align-items:flex-start;gap:2px}
:is(.news-front,.news-grid) .news-card.news-card .news-meta span{color:var(--k-gold)}
:is(.news-front,.news-grid) .news-card.news-card .news-meta time{color:var(--k-gold)}
:is(.news-front,.news-grid) .news-card.news-card .news-meta time::before{content:none}
:is(.news-front,.news-grid) .news-card.news-card h2{color:var(--k-ink);font-size:20px!important;line-height:1.2;margin:0!important;max-width:none}
:is(.news-front,.news-grid) .news-card.news-card p[data-news-summary],:is(.news-front,.news-grid) .news-card.news-card .news-auto{display:none!important}
:is(.news-front,.news-grid) .news-card.news-card .b-foot{margin-top:auto!important;padding-top:10px;border-top-color:var(--k-line);font-size:15px!important;gap:10px}
:is(.news-front,.news-grid) .news-card.news-card p.b-foot{color:var(--k-ink)!important;font-size:15px!important}
:is(.news-front,.news-grid) .news-card.news-card .b-corner{width:36px;height:36px;border-radius:10px 3px 10px 10px}
@media (hover:hover){
  :is(.news-front,.news-grid) .news-card.news-card:hover{background:#fff;transform:translateY(-4px);box-shadow:0 12px 26px rgba(60,48,30,.16)}
  :is(.news-front,.news-grid) .news-card.news-card:hover p.b-foot{color:var(--k-ink)!important}
}
@media (hover:none){:is(.news-front,.news-grid) .news-card.news-card:hover{transform:none}}
@media (prefers-reduced-motion:reduce){:is(.news-front,.news-grid) .news-card.news-card,:is(.news-front,.news-grid) .news-card.news-card:hover,:is(.news-front,.news-grid) .news-card.news-card:active{transform:none;transition:none}}
@media(min-width:1920px){:is(.news-front,.news-grid) .news-card.news-card .news-meta{font-size:16px}:is(.news-front,.news-grid) .news-card.news-card p.b-foot{font-size:17px!important}:is(.news-front,.news-grid) .news-card.news-card h2{font-size:23px!important}}
.news-list.wrap{width:100%}  /* a flex child shrinks to its auto-fill grid's content, leaving the list narrower than the title at 2560 */
.news-front{grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr))}  /* two top stories fill the row instead of leaving an empty third column */
@media(min-width:1100px){.news-front .news-card.news-card h2{font-size:27px!important;line-height:1.15}}
@media(min-width:1920px){.news-front .news-card.news-card h2{font-size:32px!important}}
/* top stories on desktop (Gilad 2026-10-13: the stretched rows looked empty): half picture, larger headline, the summary fills the card */
@media(min-width:1100px){
  .news-front .news-card.news-card{grid-template-columns:50% minmax(0,1fr)}
  .news-front .news-card.news-card .news-image{min-height:300px}
  .news-front .news-card.news-card .news-copy{padding:26px 28px 22px;gap:12px}
  .news-front .news-card.news-card h2{font-size:clamp(26px,1.7vw,36px)!important;line-height:1.15}
  .news-front .news-card.news-card p[data-news-summary]{display:-webkit-box!important;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0;
    color:var(--k-soft)!important;font-size:18px!important;line-height:1.55!important}
}
@media(min-width:1920px){.news-front .news-card.news-card p[data-news-summary]{font-size:20px!important}}
/* iPhone Safari keeps :hover after a touch, which left the old Card B corner spun into a diamond (live, 2026-10-13): the spin is for a mouse only */
@media (hover:none){.news-card:hover .b-corner,.news-card:hover .b-corner svg{transform:none}.news-card:hover .b-corner{background:#a61820}}
/* Article page on ivory (Gilad 2026-10-15): the list went ivory on 2026-10-13 and the article still showed the dark Card B.
   Same tokens as the list card (--k-*), same border and radius, so a tap from list to article stays in one look. */
.news-item-grid{background:var(--k-paper);color:var(--k-ink);border:1px solid var(--k-line);border-radius:16px;box-shadow:0 18px 34px -30px rgba(60,48,30,.5)}
.news-item .news-meta span,.news-item .news-meta time{color:var(--k-gold)}
.news-item .news-meta time::before{color:var(--k-gold)}
.news-item h1{color:var(--k-ink)}
.news-summary-label{color:var(--k-gold)}
.news-summary p:not(.news-summary-label):not(.news-auto){color:var(--k-soft)}
.news-summary .news-auto{color:var(--k-soft)}
