/* What's new (/whats-new/ and /whats-new/{slug}/): archive-sb_update.php and single-sb_update.php.
   Built on resources.css (.rs scope, tokens, .chips, .bd, .ti, .prose, .cta-band). */

/* Filters: links that work without JavaScript, styled like the .chips buttons. */
.rs .wn-filters{padding:14px 0;position:sticky;top:68px;z-index:5;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);margin-bottom:28px}
.rs .wn-filters .chips a{height:40px;padding:0 15px;border-radius:999px;border:1px solid var(--line);background:#fff;font-weight:600;font-size:14.5px;color:var(--ink-2);display:inline-flex;align-items:center;gap:6px;text-decoration:none;transition:.2s;white-space:nowrap}
.rs .wn-filters .chips a:hover{border-color:var(--ink);color:var(--ink)}
.rs .wn-filters .chips a[aria-current="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.rs .wn-filters .chips small{font-size:12px;opacity:.7}

/* Cards */
.rs .wn-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.rs .wn-card{position:relative;border:1px solid var(--line);border-radius:24px;background:#fff;overflow:hidden;display:flex;flex-direction:column;transition:border-color .2s,transform .45s var(--ease),box-shadow .45s}
.rs .wn-card:hover{border-color:color-mix(in srgb,var(--k) 45%,var(--line));transform:translateY(-3px);box-shadow:0 24px 48px -32px rgba(12,22,56,.35)}
.rs .wn-card[hidden]{display:none}
.rs .wn-card:focus-within{outline:2px solid var(--royal);outline-offset:3px}
.rs .wn-thumb{position:relative;display:block;aspect-ratio:16/9;background:color-mix(in srgb,var(--k,var(--royal)) 10%,#fff);overflow:hidden}
.rs .wn-thumb img,.rs .wn-thumb video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top left}
.rs .wn-thumb.noimg{display:grid;place-items:center}
.rs .wn-thumb.noimg>.sbi{width:56px;height:56px;--ic-accent:var(--k)}
.rs .wn-play{position:absolute;right:14px;bottom:14px;width:44px;height:44px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -12px rgba(12,22,56,.5);--ic-accent:var(--ink);--ic-ink:var(--ink)}
.rs .wn-play .sbi{width:20px;height:20px}
.rs .wn-play.big{right:50%;bottom:50%;transform:translate(50%,50%);width:72px;height:72px}
.rs .wn-play.big .sbi{width:30px;height:30px}
.rs .wn-body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.rs .wn-body .tg{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.rs .wn-body h3{font-size:21px;line-height:1.18}
.rs .wn-body h3 a{color:var(--ink);text-decoration:none}
.rs .wn-body h3 a::after{content:"";position:absolute;inset:0;border-radius:24px}
.rs .wn-body h3 a:focus-visible{outline:none}
.rs .wn-body p{font-size:15px;color:var(--ink-2);line-height:1.55}
.rs .wn-foot{margin-top:auto;padding-top:6px;display:flex;justify-content:space-between;gap:10px;align-items:center;flex-wrap:wrap}
.rs .wn-cta{font-weight:700;font-size:14.5px;color:var(--royal);display:inline-flex;gap:6px;align-items:center;--ic-ink:var(--royal)}
.rs .wn-cta .sbi{width:16px;height:16px;transition:transform .2s}
.rs .wn-card:hover .wn-cta .sbi{transform:translateX(3px)}
.rs .wn-topics{text-align:right}
.rs [data-wn-empty]{margin-top:8px}
.rs [data-wn-empty] a{color:var(--royal)}
.rs .wn-grid+[data-wn-empty]:not([hidden]){margin-top:0}

/* Watch what's new */
.rs .wn-strip{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,300px);gap:16px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory}
.rs .wn-vid{display:grid;gap:8px;text-decoration:none;color:var(--ink);scroll-snap-align:start}
.rs .wn-vid .wn-thumb{border-radius:18px}
.rs .wn-vid b{font:700 16px/1.3 var(--fd);letter-spacing:-.015em}

/* Article */
.rs .wn-hero h1{max-width:22ch;font-size:clamp(34px,4.8vw,56px);overflow-wrap:anywhere}
.rs .wn-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.rs .wn-hero .lede{margin-top:4px}
.rs .wn-meta{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:22px}
.rs .wn-col{display:grid;gap:48px}
.rs .wn-col>.prose>h2:first-child{margin-top:0}
.rs .wn-cover{margin:0;border-radius:24px;overflow:hidden;border:1px solid var(--line);background:color-mix(in srgb,var(--k,var(--royal)) 8%,#fff)}
.rs .wn-cover img{display:block;width:100%;height:auto}
.rs .wn-sec{display:grid;gap:18px}
.rs .wn-sec>h2,.rs .wn-try h2{font-size:clamp(26px,2.6vw,32px)}
.rs .wn-shots{display:grid;gap:22px}
.rs .wn-shot{margin:0;display:grid;gap:10px}
.rs .wn-shot img{display:block;width:100%;height:auto;border-radius:18px;border:1px solid var(--line);box-shadow:0 22px 44px -34px rgba(12,22,56,.45)}
.rs .wn-shot figcaption{font-size:14.5px;color:var(--muted);text-align:center}
.rs .wn-video{position:relative;border-radius:20px;overflow:hidden;background:var(--surface-2);aspect-ratio:16/9}
.rs .wn-video a,.rs .wn-video img,.rs .wn-video iframe,.rs .wn-video video{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover}
.rs .wn-why blockquote{margin:0;border-left:4px solid var(--royal);padding:4px 0 4px 22px;display:grid;gap:12px}
.rs .wn-why footer{font-style:normal}
.rs .wn-try{border-radius:26px;padding:30px;background:color-mix(in srgb,var(--k,var(--royal)) 9%,#fff);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center}
.rs .wn-try p{color:var(--ink-2);margin-top:8px;max-width:52ch}
.rs .wn-try .row{display:flex;gap:10px;flex-wrap:wrap}
.rs .wn-rels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rs .wn-rel{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;border:1px solid var(--line);border-radius:18px;padding:16px 18px;text-decoration:none;color:var(--ink);transition:border-color .2s}
.rs .wn-rel:hover{border-color:var(--ink);color:var(--ink)}
.rs .wn-rel b{display:block;font-size:16px;line-height:1.3}
.rs .wn-rel small{display:block;color:var(--muted);font-size:13.5px;line-height:1.45;margin-top:3px}
.rs .wn-rel>.sbi.c{width:18px;height:18px;--ic-ink:var(--muted)}
.rs .wn-end{display:grid;gap:18px;border-top:1px solid var(--line);padding-top:28px;justify-items:start}
.rs .wn-end .cl-nav{width:100%}
.rs .wn-cl{display:flex;gap:12px;align-items:center;text-decoration:none;color:var(--ink);border:1px solid var(--line);border-radius:18px;padding:14px 18px;width:100%}
.rs .wn-cl:hover{border-color:var(--ink);color:var(--ink)}
.rs .wn-cl>.sbi{width:26px;height:26px;flex:none;--ic-accent:var(--royal)}
.rs .wn-cl small{display:block;color:var(--muted);font-weight:600;font-size:13px}
.rs .cl-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.rs .cl-nav a{border:1px solid var(--line);border-radius:18px;padding:16px 18px;text-decoration:none;color:var(--ink);display:grid;gap:4px;transition:border-color .2s}
.rs .cl-nav a:hover{border-color:var(--ink);color:var(--ink)}
.rs .cl-nav a small{color:var(--muted);font-weight:600;font-size:13px}
.rs .cl-nav a b{overflow-wrap:anywhere}
.rs .cl-nav .nx{text-align:right;grid-column:2}

@media (max-width:1100px){.rs .wn-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){
  .rs .wn-grid,.rs .wn-rels,.rs .cl-nav{grid-template-columns:minmax(0,1fr)}
  .rs .cl-nav .nx{grid-column:auto;text-align:left}
  .rs .wrap{padding:0 16px}
  .rs .wn-filters{position:static;margin-left:-16px;margin-right:-16px;padding:12px 16px}
  .rs .wn-filters .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .rs .wn-filters .chips::-webkit-scrollbar{display:none}
  .rs .wn-try{grid-template-columns:minmax(0,1fr);padding:22px}
  .rs .wn-col{gap:36px}
}
@media (prefers-reduced-motion:reduce){.rs .wn-card,.rs .wn-cta .sbi{transition:none}.rs .wn-card:hover{transform:none}}
@media print{.rs .wn-filters,.rs .wn-try .row{display:none}}
