/* skin.css — the v2 look applied to the shared content-page markup.
 * Load after styles.css, site.css, page stylesheets and v2.css. The content pages
 * draw every colour from styles.css/site.css tokens, so remapping those tokens
 * carries the v2 palette into all components; the rules below then adjust type,
 * spacing, surfaces and controls. Sections: 1 tokens · 2 base · 3 page header ·
 * 4 subnav and sections · 5 controls · 6 surfaces · 7 footer and print. */

/* 1 · Tokens ------------------------------------------------------------------ */
html[data-theme="dark"] {
  color-scheme: dark;
  --paper: #05070E; --surface: #0A0F1A; --tint: #0F1626; --inverse: #05070E;
  --ink: #EEF2F7; --soft: #A3AEC2; --muted: #8590A4;
  --line: rgb(255 255 255 / 9%); --strong-line: rgb(255 255 255 / 18%);
  --brand: oklch(80% 0.12 195); --brand-tint: oklch(80% 0.12 195 / 13%); --caution: oklch(82% 0.14 75);
  --chart-1: oklch(78% 0.12 195); --chart-2: #6B778D; --chart-3: oklch(80% 0.14 75); --chart-4: #A3AEC2; --chart-5: oklch(72% 0.15 290); --chart-6: #4A5568;
  --chart-muted: #3A4558; --chart-grid: rgb(255 255 255 / 7%);
  --chart-1-ink: #05070E; --chart-2-ink: #05070E; --chart-3-ink: #05070E; --chart-4-ink: #05070E; --chart-5-ink: #05070E; --chart-6-ink: #EEF2F7; --chart-muted-ink: #EEF2F7;
}
html[data-theme="light"] {
  color-scheme: light;
  --paper: #F6F5F1; --surface: #FFFFFF; --tint: #EFEDE7; --inverse: #F6F5F1;
  --ink: #0E1420; --soft: #4A5568; --muted: #5F6B7E;
  --line: rgb(14 20 32 / 11%); --strong-line: rgb(14 20 32 / 22%);
  --brand: oklch(46% 0.1 205); --brand-tint: oklch(52% 0.1 200 / 10%); --caution: oklch(50% 0.13 60);
  --chart-1: oklch(50% 0.1 205); --chart-2: #9AA3B2; --chart-3: oklch(60% 0.14 60); --chart-4: #4A5568; --chart-5: oklch(52% 0.15 290); --chart-6: #6B778D;
  --chart-muted: #C3C8D1; --chart-grid: #E6E4DD;
  --chart-1-ink: #fff; --chart-2-ink: #0E1420; --chart-3-ink: #0E1420; --chart-4-ink: #fff; --chart-5-ink: #fff; --chart-6-ink: #fff; --chart-muted-ink: #0E1420;
}
:root {
  --radius: 12px; --header-h: 64px;
  --sans: var(--font-sans); --heading: var(--font-sans); --mono: var(--font-mono);
  --ease-out: cubic-bezier(0.05, 0.7, 0.1, 1);
}

/* 2 · Base -------------------------------------------------------------------- */
body { background: var(--paper); color: var(--ink); font-family: var(--font-sans); font-size: 16px; line-height: 1.7; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background-image: linear-gradient(var(--blueprint) 1px, transparent 1px), linear-gradient(90deg, var(--blueprint) 1px, transparent 1px);
  background-size: 96px 96px; background-position: center top;
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 50% 20%, #000 20%, transparent 85%); mask-image: radial-gradient(ellipse 80% 60% at 50% 20%, #000 20%, transparent 85%); }
body::after { content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 100; opacity: var(--grain-opacity);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .5  0 0 0 0 .5  0 0 0 0 .5  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url%28%23n%29'/></svg>"); }
::selection { background: var(--brand-tint); color: var(--ink); }
a:focus-visible, button:focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; border-radius: 6px; }
.container { width: min(var(--content-max), calc(100% - 48px)); }
h1, h2, h3, h4 { font-family: var(--font-sans); font-weight: 600; }
h2 { font-size: clamp(30px, 2.9vw, 44px); line-height: 1.08; letter-spacing: -0.035em; }
h3 { letter-spacing: -0.02em; }
h1 em, h2 em, h3 em { font-style: normal; font-weight: inherit; color: var(--title-dim); }
html[lang="zh-CN"] h2 { line-height: 1.3; letter-spacing: 0; }

/* 3 · Page header: left-aligned statement over the page's animated backdrop --- */
.page-hero { position: relative; isolation: isolate; display: flex; flex-direction: column; justify-content: center;
  min-height: min(76vh, 700px); padding-block: clamp(72px, 11vh, 128px) clamp(64px, 9vh, 104px); border-bottom: 1px solid var(--line); }
.page-hero > :not(.v2-backdrop) { position: relative; z-index: 1; }
.page-hero > .kicker, .page-hero > h1, .page-hero > .lead, .page-hero > .page-meta, .page-hero > .board-nav { max-width: 780px; }
.v2-backdrop { position: absolute; z-index: 0; top: 0; bottom: 0; left: 50%; width: 100vw; translate: -50% 0; overflow: hidden; pointer-events: none; }
.v2-backdrop canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.v2-veil { position: absolute; inset: 0;
  background: linear-gradient(90deg, var(--paper) 0%, color-mix(in oklab, var(--paper) 86%, transparent) 30%, color-mix(in oklab, var(--paper) 30%, transparent) 56%, transparent 74%),
              linear-gradient(180deg, transparent 72%, var(--paper)); }
.v2-aurora { position: absolute; inset: -30% -10% -10% 30%; filter: blur(90px) saturate(130%); opacity: var(--aurora-opacity); }
.v2-aurora i { position: absolute; border-radius: 50%; mix-blend-mode: var(--aurora-blend); }
.v2-aurora i:nth-child(1) { width: 50%; aspect-ratio: 1; left: 34%; top: 0; background: radial-gradient(closest-side, var(--track-1), transparent); animation: drift1 26s ease-in-out infinite alternate; }
.v2-aurora i:nth-child(2) { width: 40%; aspect-ratio: 1; left: 58%; top: 34%; background: radial-gradient(closest-side, var(--track-2), transparent); opacity: .75; animation: drift2 32s ease-in-out infinite alternate; }
.v2-aurora i:nth-child(3) { width: 32%; aspect-ratio: 1; left: 20%; top: 46%; background: radial-gradient(closest-side, oklch(62% 0.16 270), transparent); opacity: .5; animation: drift3 38s ease-in-out infinite alternate; }
.page-hero .kicker { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 26px; font: 400 11.5px/1.5 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.page-hero .kicker::before { content: ""; width: 28px; height: 1px; background: var(--spectrum); flex: none; }
.page-hero h1 { font-size: clamp(46px, 5.2vw, 80px); font-weight: 600; line-height: 1.0; letter-spacing: -0.05em; margin-left: -0.05em; text-wrap: balance; }
.page-hero h1 em { color: var(--title-dim); }
html[lang="zh-CN"] .page-hero h1 { line-height: 1.18; letter-spacing: -0.01em; }
.page-hero .lead { margin-top: 24px; max-width: 38em; font-size: 17px; line-height: 1.7; color: var(--soft); }
.page-meta { gap: 8px; margin-top: 28px; font-size: 12px; }
.page-meta li { padding: 6px 11px; border-radius: 8px; border: 1px solid var(--line); background: color-mix(in oklab, var(--surface) 70%, transparent); backdrop-filter: blur(6px); font-family: var(--font-mono); font-size: 11px; letter-spacing: .03em; color: var(--soft); }
.page-meta a { padding: 0; text-decoration: none; color: var(--ink); }
.page-meta li:has(a):hover { border-color: var(--strong-line); }
.board-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.board-nav a { padding: 8px 14px; border-radius: 999px; border: 1px solid var(--line); background: color-mix(in oklab, var(--surface) 70%, transparent); font-size: 13px; color: var(--soft); text-decoration: none; }
.board-nav a:hover { color: var(--ink); border-color: var(--strong-line); }
.professional-hero .professional-deck { color: var(--ink); }

/* 4 · Subnav and sections ------------------------------------------------------ */
.subnav { background: color-mix(in oklab, var(--paper) 78%, transparent); backdrop-filter: blur(16px) saturate(140%); -webkit-backdrop-filter: blur(16px) saturate(140%); border-bottom: 1px solid var(--line); }
.subnav ol, .subnav ul { gap: 0 4px; }
.subnav a { padding: 14px 12px 12px; font-size: 13.5px; color: var(--muted); border-bottom: 0; }
.subnav li:first-child a { margin-left: -12px; }
.subnav a:hover, .subnav a[aria-current="location"] { color: var(--ink); }
.subnav-number { color: var(--muted); font-size: 11px; }
.subnav a[aria-current="location"] .subnav-number { color: var(--brand); }
.subnav .has-marker::after, .subnav ol::after, .subnav ul::after { background: var(--spectrum); height: 2px; }
.section { padding-block: clamp(72px, 9vw, 112px); }
.section-heading { gap: 64px; margin-bottom: 48px; align-items: end; }
.kicker { font: 400 11.5px/1.5 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); display: inline-flex; align-items: center; gap: 12px; }
.section-heading .kicker::before { content: ""; width: 28px; height: 1px; background: var(--spectrum); flex: none; }
.lead { color: var(--soft); font-size: 16.5px; line-height: 1.7; }
.ruled { border-top-color: var(--line); }

/* 5 · Controls: pill buttons with an icon chip, text links with icons ----------- */
.button { gap: 14px; min-height: 48px; padding: 0 7px 0 20px; border-radius: 999px; border: 1px solid var(--line); font: 600 14.5px/1 var(--font-sans); letter-spacing: -0.01em;
  color: var(--ink); background: color-mix(in oklab, var(--surface) 60%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: var(--inner-highlight); transition: border-color var(--duration-base), background-color var(--duration-base), scale var(--duration-fast); }
.button:not(:has(> span[aria-hidden="true"])) { padding-inline: 20px; }
.button:hover { background: color-mix(in oklab, var(--tint) 85%, transparent); border-color: var(--strong-line); }
.button:active { scale: .98; }
.button.primary { color: var(--paper); border-color: transparent; background: linear-gradient(180deg, color-mix(in oklab, var(--ink), white 22%), var(--ink));
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 50%), 0 1px 2px rgb(0 0 0 / 30%), 0 14px 32px -16px rgb(0 0 0 / 70%); }
html[data-theme="light"] .button.primary { background: linear-gradient(180deg, #232C3D, #0E1420); color: #F6F5F1; box-shadow: inset 0 1px 0 rgb(255 255 255 / 14%), 0 14px 30px -16px rgb(14 20 32 / 55%); }
.button.primary:hover { background: linear-gradient(180deg, color-mix(in oklab, var(--ink), white 30%), var(--ink)); border-color: transparent; }
html[data-theme="light"] .button.primary:hover { background: linear-gradient(180deg, #2B3548, #141B2A); }
.button > span[aria-hidden="true"] { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 34px; height: 34px; border-radius: 50%;
  font-size: 0; line-height: 0; color: var(--ink); background: var(--tint); transition: translate var(--duration-slow) var(--ease-emphasized), background-color var(--duration-base); }
.button.primary > span[aria-hidden="true"] { background: var(--paper); color: var(--ink); }
.button:hover > span[aria-hidden="true"] { background: var(--ink); color: var(--paper); }
.button.primary:hover > span[aria-hidden="true"] { background: var(--paper); color: var(--ink); }
.button > span[aria-hidden="true"]::before, .text-link > span[aria-hidden="true"]::before, .page-footer-nav span[aria-hidden="true"]::before {
  content: ""; display: block; flex: none; width: 15px; height: 15px; background: currentColor;
  -webkit-mask: var(--icon, var(--i-arrow)) center / contain no-repeat; mask: var(--icon, var(--i-arrow)) center / contain no-repeat; }
[data-arrow="down"] { --icon: var(--i-arrow-s); }
[data-arrow="up"] { --icon: var(--i-arrow-n); }
[data-arrow="left"] { --icon: var(--i-arrow-w); }
[data-arrow="ne"] { --icon: var(--i-arrow-ne); }
.text-link { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; color: var(--ink); text-decoration: none;
  background: linear-gradient(var(--brand), var(--brand)) no-repeat 0 100% / 0% 1.5px; padding-bottom: 2px; transition: background-size var(--duration-slow) var(--ease-standard); }
.text-link:hover, .text-link:focus-visible { background-size: 100% 1.5px; }
.text-link > span[aria-hidden="true"] { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; font-size: 0; color: var(--brand);
  transition: translate var(--duration-slow) var(--ease-emphasized); }
.text-link > span[aria-hidden="true"]::before { width: 14px; height: 14px; }
.text-link:hover > span[data-arrow="right"] { translate: 4px 0; }
.text-link:hover > span[data-arrow="down"] { translate: 0 3px; }
.text-link:hover > span[data-arrow="ne"] { translate: 3px -3px; }

/* 6 · Surfaces: rounded panels with depth; tables and code read as instruments --- */
.track, .resource, .card-grid > *, .participate-panel, .team-card, .research-group, .contact-grid > *, .kv, .callout, .panel {
  border-radius: 16px; }
.track, .card-grid > *, .resource, .participate-panel {
  background: linear-gradient(180deg, color-mix(in oklab, var(--surface), white 2%), var(--surface)); border-color: var(--line); box-shadow: var(--inner-highlight), var(--shadow-card); }
.pill, .badge, .availability, .track-tag { border-radius: 999px; font-family: var(--font-mono); letter-spacing: .04em; }
table { border-color: var(--line); }
th { font-family: var(--font-mono); font-weight: 400; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
code { font-family: var(--font-mono); }
.code-card, .code-panel { border-radius: 14px; }
details { border-radius: 12px; }
figure img, .figure-image { border-radius: 12px; }
video { border-radius: 14px; }

/* 7 · Footer navigation, legacy footer and print -------------------------------- */
.page-footer-nav a { border-radius: 16px; }
.page-footer-nav span[aria-hidden="true"] { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; font-size: 0; }
.site-footer.container { display: none; }
@media print { body::before, body::after, .v2-backdrop { display: none; } }
@media (prefers-reduced-motion: reduce) { .v2-aurora i { animation: none; } }
@media (max-width: 1080px) { .page-hero { min-height: 0; } .v2-veil { background: color-mix(in oklab, var(--paper) 72%, transparent); } }

/* =================================================================
   8 · Motion and expression layer (driven by v2.js)
   ================================================================= */

/* Kinetic headings: words rise out of a mask when their block arrives. */
.v2-content .split-vis .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.v2-content .split-vis .w > span { display: inline-block; }
.v2-content .split-vis .w.em > span { color: var(--title-dim); }
html.js:not(.rm) .v2-content .split-vis .w > span { translate: 0 110%; transition: translate 1.05s var(--ease-emphasized); transition-delay: calc(80ms + var(--wi, 0) * 42ms); }
html.js .v2-content .v2-in .split-vis .w > span { translate: 0 0; }

/* Header entrance, page index, scroll cue and scroll-linked exit. */
.v2-content .page-hero { --hx: 0; }
html.js:not(.rm) .v2-content .page-hero > :not(.v2-backdrop):not(h1):not(.v2-hero-index):not(.v2-scroll-cue) {
  animation: v2Rise 1s var(--ease-emphasized) both; animation-delay: calc(.25s + var(--hi, 0) * .09s); }
@keyframes v2Rise { from { opacity: 0; translate: 0 22px; } }
.v2-content .page-hero > :not(.v2-backdrop):not(.v2-hero-index):not(.v2-scroll-cue) { transform: translateY(calc(var(--hx) * -80px)); filter: opacity(calc(1 - var(--hx) * .9)); }
.v2-content .v2-backdrop { transform: scale(calc(1 + var(--hx) * .06)); filter: opacity(calc(1 - var(--hx) * .7)); transform-origin: 70% 40%; }
.v2-hero-index { position: absolute; right: 0; top: clamp(24px, 4vh, 40px); z-index: 1; font: 400 11.5px var(--font-mono); letter-spacing: .14em; color: var(--muted); }
.v2-hero-index::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 10px; border-radius: 50%; background: var(--brand); box-shadow: 0 0 0 3px var(--brand-tint); vertical-align: 1px; animation: pulse 2s ease-in-out infinite; }
.v2-scroll-cue { position: absolute; left: 0; bottom: 26px; z-index: 1; display: inline-flex; align-items: center; gap: 12px; font: 400 11px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.v2-scroll-cue i { position: relative; width: 1px; height: 34px; background: var(--line); overflow: hidden; }
.v2-scroll-cue i::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--spectrum); animation: v2Cue 2.2s var(--ease-standard) infinite; }
@keyframes v2Cue { to { top: 100%; } }
.page-hero:has(.page-meta), .page-hero:has(.board-nav), .page-hero:has(.professional-hero-links) { padding-bottom: clamp(88px, 12vh, 128px); }

/* Card surfaces: depth, spotlight under the pointer, a rim that follows it, slight tilt. */
.v2-content .v2-card { position: relative; isolation: isolate; overflow: hidden; border: 1px solid var(--line); border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in oklab, var(--surface), white 2.5%), var(--surface));
  box-shadow: var(--inner-highlight), var(--shadow-card);
  transform: perspective(1100px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
html[data-theme="light"] .v2-content .v2-card { background: linear-gradient(180deg, #fff, #FBFAF6); }
.v2-content .v2-card::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0; transition: opacity var(--duration-slow) var(--ease-standard);
  background: radial-gradient(520px circle at var(--mx, 50%) var(--my, 50%), var(--brand-tint), transparent 62%); }
.v2-content .v2-card::after { content: ""; position: absolute; inset: 0; z-index: 2; pointer-events: none; border-radius: inherit; padding: 1px; opacity: 0; transition: opacity var(--duration-slow) var(--ease-standard);
  background: radial-gradient(300px circle at var(--mx, 50%) var(--my, 50%), var(--brand), transparent 65%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; }
.v2-content .v2-card:hover::before, .v2-content .v2-card:hover::after, .v2-content .v2-card:focus-within::after { opacity: 1; }
.v2-content .v2-card:hover { border-color: var(--strong-line); }

/* Staggered reveals; the transform channel stays free for the card tilt. */
html.js:not(.rm) .v2-content .v2-r { opacity: 0; translate: 0 30px; filter: blur(6px);
  transition: opacity .9s var(--ease-emphasized), translate 1s var(--ease-emphasized), filter .9s var(--ease-emphasized), transform .45s var(--ease-emphasized), border-color var(--duration-base);
  transition-delay: calc(var(--i, 0) * 80ms), calc(var(--i, 0) * 80ms), calc(var(--i, 0) * 80ms), 0s, 0s; }
html.js .v2-content .v2-r.v2-in { opacity: 1; translate: 0 0; filter: none; }

/* Spectrum sweep along the top rule of each section as it arrives. */
.v2-content main > section.ruled, .v2-content main > .section.ruled { position: relative; border-top-color: transparent; }
.v2-content main > section.ruled::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: var(--line); }
.v2-content main > section.ruled::after { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 1px; background: var(--spectrum); opacity: .75;
  transform: scaleX(0); transform-origin: left; transition: transform 1.8s var(--ease-emphasized); }
.v2-content main > section.ruled.v2-in::after { transform: scaleX(1); }

/* Section headings at the homepage's scale. */
.v2-content .section-heading h2 { font-size: clamp(36px, 3.6vw, 54px); line-height: 1.03; letter-spacing: -0.042em; }
html[lang="zh-CN"] .v2-content .section-heading h2 { line-height: 1.25; letter-spacing: 0; }
.v2-content .section-heading .kicker { margin-bottom: 18px; }

/* Subnav reading progress. */
.subnav { position: sticky; }
.v2-progress { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; transform-origin: left; transform: scaleX(var(--p, 0)); background: var(--spectrum); pointer-events: none; }

/* Tables read as instruments: glass header, hover row, tabular figures. */
.v2-content .table-scroll { border: 1px solid var(--line); border-radius: 16px; background: color-mix(in oklab, var(--surface) 80%, transparent); box-shadow: var(--inner-highlight); }
.v2-content table { border-collapse: separate; border-spacing: 0; }
.v2-content th { background: color-mix(in oklab, var(--tint) 70%, transparent); border-bottom: 1px solid var(--line); }
.v2-content tbody tr { transition: background-color var(--duration-fast); }
.v2-content tbody tr:hover { background: var(--brand-tint); }
.v2-content td { font-variant-numeric: tabular-nums; border-color: var(--line); }

/* Page sequence: two large destinations. */
.v2-content .page-footer-nav { gap: 16px; }
.v2-content .page-footer-nav a { position: relative; overflow: hidden; padding: 26px 28px; border: 1px solid var(--line); border-radius: 18px;
  background: linear-gradient(180deg, color-mix(in oklab, var(--surface), white 2%), var(--surface)); box-shadow: var(--inner-highlight); transition: border-color var(--duration-base); }
.v2-content .page-footer-nav a:hover { border-color: var(--strong-line); }
.v2-content .page-footer-nav small { font: 400 11px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.v2-content .page-footer-nav a > span { font-size: clamp(22px, 2vw, 28px); font-weight: 600; letter-spacing: -0.025em; display: inline-flex; align-items: center; gap: 10px; }

/* Flow field behind long pages (shown once the header scrolls away). */
.v2-content .field { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; opacity: 0; transition: opacity 1.2s var(--ease-standard); }
html.past-hero .v2-content .field { opacity: .58; }
html[data-theme="light"].past-hero .v2-content .field { opacity: .4; }
/* below the header, a fixed glow takes the colour of the section in view (colours animate via @property) */
.v2-content .ambient { opacity: 0; transition: opacity 1.2s var(--ease-standard), --amb-a 1.4s var(--ease-standard), --amb-b 1.4s var(--ease-standard); }
html.past-hero .v2-content .ambient { opacity: 1; }
.v2-content .ambient[data-amb="violet"] { --amb-a: var(--track-3-soft); --amb-b: var(--track-1-soft); }
.v2-content .ambient[data-amb="amber"] { --amb-a: var(--track-2-soft); --amb-b: var(--track-3-soft); }

@media (prefers-reduced-motion: reduce) {
  .v2-content .page-hero > *, .v2-content .v2-backdrop { transform: none; filter: none; }
  .v2-scroll-cue i::after, .v2-hero-index::before { animation: none; }
}
.page-hero > .v2-hero-index, .page-hero > .v2-scroll-cue { position: absolute; }

/* =================================================================
   9 · Shared components with a v2 treatment
   ================================================================= */

/* Recorded media in a window frame. */
.v2-media { position: relative; overflow: hidden; border-radius: 16px; background: #05080F; border: 1px solid rgb(255 255 255 / 10%);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 7%), 0 30px 60px -36px rgb(0 0 0 / 70%); }
.v2-media video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; border: 0 !important; border-radius: 0 !important; }
.v2-media-bar { display: flex; align-items: center; gap: 12px; height: 38px; padding: 0 14px; border-bottom: 1px solid rgb(255 255 255 / 8%); background: rgb(255 255 255 / 3%);
  font: 400 10.5px var(--font-mono); letter-spacing: .06em; color: #7D889C; }
.v2-dots { display: flex; gap: 6px; } .v2-dots i { width: 10px; height: 10px; border-radius: 50%; background: rgb(255 255 255 / 13%); }
.v2-media-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.v2-media-badge { display: inline-flex; align-items: center; gap: 8px; text-transform: uppercase; letter-spacing: .1em; }
.v2-media-badge b { width: 7px; height: 7px; border-radius: 50%; background: oklch(80% 0.12 195); box-shadow: 0 0 0 3px oklch(80% 0.12 195 / 25%); animation: pulse 2s ease-in-out infinite; }

/* Proposed timeline: a track with nodes; the line draws in when the list arrives. */
.v2-content .plan-stages { position: relative; gap: 0 16px; padding-top: 34px; }
.v2-content .plan-stages::before, .v2-content .plan-stages::after { content: ""; position: absolute; left: 12px; right: 12px; top: 11px; height: 2px; border-radius: 2px; }
.v2-content .plan-stages::before { background: var(--line); }
.v2-content .plan-stages::after { background: var(--spectrum); transform: scaleX(0); transform-origin: left; transition: transform 1.8s var(--ease-emphasized) .2s; }
.v2-content .plan-stages:has(.v2-in)::after { transform: scaleX(1); }
.v2-content .plan-stage.v2-card { padding: 22px 20px 24px; border-top: 1px solid var(--line); overflow: visible; }
.v2-content .plan-stage .plan-meta { position: relative; }
.v2-content .plan-stage .plan-meta::before { content: ""; position: absolute; left: 0; top: -47px; width: 14px; height: 14px; border-radius: 50%; background: var(--paper); border: 2px solid var(--strong-line); }
.v2-content .plan-stage:first-child .plan-meta::before { border-color: var(--brand); background: var(--brand); box-shadow: 0 0 0 5px var(--brand-tint); animation: v2Beacon 2.4s var(--ease-standard) infinite; }
@keyframes v2Beacon { 50% { box-shadow: 0 0 0 9px transparent; } }
.v2-content .plan-number { font: 400 11.5px var(--font-mono); letter-spacing: .12em; color: var(--muted); }
.v2-content .status.is-tbc { border-radius: 999px; padding: 3px 9px; font: 400 10.5px var(--font-mono); letter-spacing: .06em; color: var(--caution); background: color-mix(in oklab, var(--caution) 14%, transparent); border: 0; }
.v2-content .plan-stage h3 { margin-top: 14px; font-size: 18px; letter-spacing: -0.015em; }

/* Ways to take part: numbered cards. */
.v2-content .take-part { counter-reset: take; gap: 16px; }
.v2-content .take-part > li.v2-card { counter-increment: take; padding: 26px 26px 24px; border-top: 1px solid var(--line); }
.v2-content .take-part > li h3 { font-size: 19px; letter-spacing: -0.02em; }
.v2-content .take-part > li h3::before { content: counter(take, decimal-leading-zero); display: block; margin-bottom: 18px; font: 400 11.5px var(--font-mono); letter-spacing: .12em; color: var(--brand); }
.v2-content .take-part > li:nth-child(even) h3::before { color: var(--caution); }
.v2-content .take-part .soon-tag { padding: 3px 10px; border: 1px dashed var(--border-strong); border-radius: 999px; font: 400 11px var(--font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--text-tertiary); }

/* =================================================================
   10 · Challenge
   ================================================================= */
.v2-page-challenge #subtrack-econometric { --accent: var(--track-1); --accent-soft: var(--track-1-soft); }
.v2-page-challenge #subtrack-professional { --accent: var(--track-2); --accent-soft: var(--track-2-soft); }
.v2-page-challenge .track.v2-card { padding: clamp(28px, 3vw, 44px);
  background: radial-gradient(60% 46% at 100% 0%, var(--accent-soft), transparent 72%), linear-gradient(180deg, color-mix(in oklab, var(--surface), white 2.5%), var(--surface));
  box-shadow: inset 0 2px 0 var(--accent), var(--inner-highlight), var(--shadow-card); }
.v2-page-challenge .track + .track { margin-top: 28px; }
.v2-page-challenge .track-head .pill:first-child { color: var(--accent); background: var(--accent-soft); border-color: transparent; }
.v2-page-challenge .track > h3 { margin-top: 18px; font-size: clamp(30px, 2.8vw, 42px); line-height: 1.06; letter-spacing: -0.035em; }
.v2-page-challenge .track-summary { margin-top: 14px; font-size: 17px; color: var(--soft); max-width: 46em; }
.v2-page-challenge .track-facts dt { font-family: var(--font-mono); font-weight: 400; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.v2-page-challenge .track .v2-card { box-shadow: none; }
.v2-page-challenge .track-video figcaption h4 { font-size: 21px; letter-spacing: -0.02em; }
.v2-page-challenge .demo-label .pill { color: var(--accent); background: var(--accent-soft); border-color: transparent; }
.v2-page-challenge .replication-data { padding: 22px 24px; border-radius: 14px; border: 1px solid var(--line); background: color-mix(in oklab, var(--tint) 60%, transparent); }
/* arrows inside any content link render as icons */
.v2-content main a > span[data-arrow] { display: inline-flex; align-items: center; justify-content: center; width: 14px; height: 14px; font-size: 0; vertical-align: -2px; color: var(--brand); }
.v2-content main a > span[data-arrow]::before { content: ""; width: 14px; height: 14px; background: currentColor; -webkit-mask: var(--icon, var(--i-arrow)) center / contain no-repeat; mask: var(--icon, var(--i-arrow)) center / contain no-repeat; }
.v2-content main .button > span[data-arrow] { width: 34px; height: 34px; color: var(--ink); vertical-align: middle; }
.v2-content main .button.primary > span[data-arrow] { color: var(--ink); background: var(--paper); }
.v2-content main .button > span[data-arrow]::before { width: 15px; height: 15px; }
@media (max-width: 860px) {
  .v2-content .plan-stages { padding-top: 0; }
  .v2-content .plan-stages::before, .v2-content .plan-stages::after, .v2-content .plan-stage .plan-meta::before { display: none; }
}

/* =================================================================
   11 · Page accents: each page leads with one colour of the system
   ================================================================= */
html[data-theme="dark"] { --track-3: oklch(74% 0.14 290); --track-3-soft: oklch(74% 0.14 290 / 14%); }
html[data-theme="light"] { --track-3: oklch(50% 0.15 290); --track-3-soft: oklch(50% 0.15 290 / 10%); }
.v2-page-professional-tasks, .v2-page-leaderboard { --brand: var(--track-2); --brand-tint: var(--track-2-soft); }
.v2-page-harness { --brand: var(--track-3); --brand-tint: var(--track-3-soft); }

/* =================================================================
   12 · Subtrack pages: replication workflow and business deliverables
   ================================================================= */
.v2-content .steps .step { grid-template-columns: 48px minmax(0, 1fr); column-gap: 22px; padding-bottom: 20px; }
.v2-content .step::before { left: 23.5px; top: 54px; bottom: 6px; width: 2px; border-radius: 2px; background: linear-gradient(var(--brand), var(--line) 85%); }
.v2-content .step-marker { width: 48px; height: 48px; border: 1px solid var(--strong-line); background: var(--surface); color: var(--brand); font-size: 13px; box-shadow: var(--inner-highlight); }
.v2-content .step.is-final .step-marker { background: var(--brand); color: var(--paper); border-color: transparent; box-shadow: 0 0 0 6px var(--brand-tint); }
.v2-content .step-body { padding: 22px 26px 24px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(180deg, color-mix(in oklab, var(--surface), white 2%), var(--surface)); box-shadow: var(--inner-highlight); }
.v2-content .step-title { font-size: 20px; letter-spacing: -0.02em; }
.v2-content .card-grid { gap: 16px; }
.v2-content .card.v2-card { padding: 26px; }
.v2-content .card-label { font: 400 11px var(--font-mono); letter-spacing: .12em; text-transform: uppercase; color: var(--brand); }
.v2-content .prose { max-width: 46em; font-size: 17px; line-height: 1.75; color: var(--soft); }
.v2-content .chart-source, .v2-content .note { color: var(--muted); }

.v2-page-professional-tasks .professional-deck { font-size: clamp(20px, 1.8vw, 26px); font-weight: 500; letter-spacing: -0.02em; color: var(--ink); margin-top: 18px; }
.v2-page-professional-tasks .professional-workflow { gap: 14px; }
.v2-page-professional-tasks .professional-workflow > li.v2-card { padding: 24px 22px; border-top: 1px solid var(--line); }
.v2-page-professional-tasks .professional-step { display: inline-block; font: 400 11.5px var(--font-mono); letter-spacing: .12em; color: var(--brand); }
.v2-page-professional-tasks .professional-workflow h4 { margin-top: 14px; font-size: 18px; letter-spacing: -0.015em; }
.v2-page-professional-tasks .professional-case.v2-card { padding: clamp(24px, 2.6vw, 36px); box-shadow: inset 0 2px 0 var(--brand), var(--inner-highlight), var(--shadow-card); }
.v2-page-professional-tasks .professional-case-id { font-family: var(--font-mono); color: var(--brand); letter-spacing: .08em; }
.v2-page-professional-tasks .professional-case-title { font-size: clamp(24px, 2.2vw, 32px); letter-spacing: -0.03em; }
.v2-page-professional-tasks .professional-hero-note, .v2-page-professional-tasks .professional-status { color: var(--muted); }

/* =================================================================
   13 · Harness and Self-evolving: diagrams, timeline, research map
   ================================================================= */
.v2-content .diagram-scroll { border-radius: 16px; }
.v2-content figure.hs-timeline, .v2-content figure.hs-composition, .v2-content figure.rsi-figure, .v2-content .diagram {
  padding: clamp(16px, 2vw, 28px); border: 1px solid var(--line); border-radius: 20px; background: linear-gradient(180deg, color-mix(in oklab, var(--surface), white 2%), var(--surface)); box-shadow: var(--inner-highlight), var(--shadow-card); }
.v2-page-harness .hs-timeline .hs-dot { stroke: var(--brand); stroke-width: 2; }
.v2-content details { border: 1px solid var(--line); background: color-mix(in oklab, var(--surface) 70%, transparent); }
.v2-content details > summary { cursor: pointer; padding: 14px 18px; font-weight: 600; letter-spacing: -0.01em; }
.v2-content details[open] > summary { border-bottom: 1px solid var(--line); }
.v2-content .pill-list .pill, .v2-content .pill { border-radius: 999px; }
.v2-content .compare-table th:first-child, .v2-content .compare-table td:first-child { position: sticky; left: 0; z-index: 1; background: var(--surface); }
.v2-content .compare-table th:first-child { background: var(--tint); }
.v2-content .se-map-zone, .v2-content .se-map-group, .v2-content .se-tiles > * { border-radius: 14px; }
.v2-content .se-map-glyph { color: var(--brand); }
.v2-content .se-method.v2-card { padding: 26px; }
.v2-content .se-role, .v2-content .hc-label, .v2-content .mech-basis { font-family: var(--font-mono); letter-spacing: .06em; }
.v2-content .case-step-number { color: var(--brand); font-family: var(--font-mono); }

/* =================================================================
   14 · Leaderboard and Teams
   ================================================================= */
html[data-theme="dark"] .v2-content .mountain {
  --mtn-sky: #0A0F1A; --mtn-sky-low: #0E1523; --mtn-haze: #0E1523;
  --mtn-pill: #121B2E; --mtn-pill-text: #EEF2F7; --mtn-pill-edge: rgb(255 255 255 / 16%); --mtn-badge: rgb(255 255 255 / 8%);
  --mtn-marker: #EEF2F7; --mtn-marker-ring: #05070E; }
.v2-content .mountain { border-radius: 18px; overflow: hidden; border: 1px solid var(--line); box-shadow: var(--inner-highlight), var(--shadow-card); }
.v2-content .paired-controls select, .v2-content select { border-radius: 10px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: 8px 12px; font: 500 13px var(--font-sans); }
.v2-content .dev-report-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.v2-content .dev-report-facts > div { display: flex; flex-direction: column; gap: 4px; min-width: 0; padding: 18px 20px; border: 1px solid var(--line); border-radius: 14px; background: color-mix(in oklab, var(--surface) 80%, transparent); }
.v2-content .dev-report-facts dt { font: 400 11px var(--font-mono); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.v2-content .dev-report-facts dd { margin: 6px 0 0; font-size: 15px; color: var(--ink); overflow-wrap: anywhere; }
.v2-content .dev-report-facts dd[data-v2-count] { font-size: clamp(28px, 2.6vw, 40px); font-weight: 600; letter-spacing: -0.035em; font-variant-numeric: tabular-nums; }
.v2-content .dev-table .is-sorted { color: var(--brand); }

.v2-page-teams .team-member.v2-card, .v2-page-teams .research-group.v2-card, .v2-page-teams .contact-card.v2-card { padding: 26px; }
.v2-page-teams .team-member img, .v2-page-teams .research-group img { border-radius: 14px; }
.v2-page-teams .institution-grid > .v2-card { overflow: hidden; }
.v2-page-teams .institution-logo { border-radius: 12px; }
.v2-page-teams .group-name, .v2-page-teams .team-member h3 { letter-spacing: -0.02em; }
.v2-page-teams .group-affiliation, .v2-page-teams .institution-abbreviation { font-family: var(--font-mono); letter-spacing: .08em; color: var(--brand); }
.v2-page-teams .gifts-feature.v2-card { padding: clamp(26px, 3vw, 44px); background: radial-gradient(60% 50% at 100% 0%, var(--brand-tint), transparent 70%), linear-gradient(180deg, color-mix(in oklab, var(--surface), white 2.5%), var(--surface)); }
.v2-page-professional-tasks .page-hero.professional-hero { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); gap: 56px; align-items: center; }
.v2-page-professional-tasks .professional-hero h1 { font-size: clamp(44px, 4.8vw, 74px); line-height: 1.02; letter-spacing: -0.048em; max-width: none; }
.v2-page-professional-tasks .professional-hero .lead { font-size: 16.5px; }
.v2-page-professional-tasks .professional-hero-note { align-self: center; padding: 26px 26px 22px; border: 1px solid var(--line); border-radius: 20px;
  background: color-mix(in oklab, var(--surface) 72%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: var(--inner-highlight), var(--shadow-card); }
.v2-page-professional-tasks .professional-artifact { padding: 14px 0; border-top: 1px solid var(--line); }
.v2-page-professional-tasks .professional-extension { border-radius: 8px; font-family: var(--font-mono); letter-spacing: .08em; color: var(--brand); background: var(--brand-tint); border-color: transparent; }

/* =================================================================
   15 · Performance: compositor-only motion on content pages
   ================================================================= */
.v2-aurora { filter: none; }
.v2-aurora i { mix-blend-mode: normal; will-change: transform; }
.v2-aurora i:nth-child(1) { background: radial-gradient(closest-side, color-mix(in oklab, var(--track-1) 45%, transparent), transparent); }
.v2-aurora i:nth-child(2) { background: radial-gradient(closest-side, color-mix(in oklab, var(--track-2) 40%, transparent), transparent); }
.v2-aurora i:nth-child(3) { background: radial-gradient(closest-side, oklch(62% 0.16 270 / 35%), transparent); }
/* the entrance only fills backwards, so plain opacity drives the scroll exit afterwards */
html.js:not(.rm) .v2-content .page-hero > :not(.v2-backdrop):not(h1):not(.v2-hero-index):not(.v2-scroll-cue) { animation-fill-mode: backwards; }
.v2-content .page-hero > :not(.v2-backdrop):not(.v2-hero-index):not(.v2-scroll-cue) { filter: none; opacity: calc(1 - var(--hx) * .9); }
.v2-content .v2-backdrop { filter: none; opacity: calc(1 - var(--hx) * .7); will-change: transform, opacity; }
html.js:not(.rm) .v2-content .v2-r { filter: none;
  transition: opacity .9s var(--ease-emphasized), translate 1s var(--ease-emphasized), transform .45s var(--ease-emphasized), border-color var(--duration-base);
  transition-delay: calc(var(--i, 0) * 80ms), calc(var(--i, 0) * 80ms), 0s, 0s; }
/* cards only take a 3D transform while the pointer is on them */
.v2-content .v2-card { transform: none; }
.v2-content .v2-card:hover { transform: perspective(1100px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); }
/* glass stays on the sticky header and subnav only */
.button, .page-meta li, .board-nav a, .v2-page-professional-tasks .professional-hero-note { -webkit-backdrop-filter: none; backdrop-filter: none; }
.button { background: color-mix(in oklab, var(--surface) 88%, transparent); }
.page-meta li, .board-nav a { background: color-mix(in oklab, var(--surface) 90%, transparent); }
.v2-page-professional-tasks .professional-hero-note { background: color-mix(in oklab, var(--surface) 92%, transparent); }

/* 16 · Teams: institution logos on white plates, monogram avatars, contributor chips */
.v2-logo-wall { list-style: none; margin: 0 0 28px; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.v2-logo { display: flex; flex-direction: column; gap: 14px; height: 100%; padding: 12px; border: 1px solid var(--line); border-radius: 18px; background: color-mix(in oklab, var(--surface) 82%, transparent); text-decoration: none; transition: border-color var(--duration-base) var(--ease-standard), translate var(--duration-emphasized) var(--ease-emphasized), box-shadow var(--duration-slow) var(--ease-standard); }
.v2-logo:hover, .v2-logo:focus-visible { translate: 0 -3px; border-color: color-mix(in oklab, var(--brand) 40%, transparent); box-shadow: 0 24px 48px -28px color-mix(in oklab, var(--brand) 45%, transparent); }
.v2-logo-plate, .v2-group-plate { display: grid; place-items: center; border-radius: 12px; background: #fff; box-shadow: inset 0 0 0 1px rgb(14 20 32 / 7%); }
.v2-logo-plate { height: 116px; padding: 20px 28px; }
.v2-logo-plate img { display: block; width: auto; height: auto; max-width: 100%; max-height: 62px; object-fit: contain; border-radius: 0; }
.v2-logo-meta { display: flex; flex-direction: column; gap: 4px; padding: 0 6px 6px; }
.v2-logo-meta span { font: 400 10.5px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--brand); }
.v2-logo-meta b { font-size: 15px; font-weight: 600; line-height: 1.35; letter-spacing: -0.015em; color: var(--ink); }
.v2-page-teams .institution-grid > a { padding: 12px; border-radius: 18px; }
.v2-page-teams .institution-logo { min-height: 116px; border-bottom: 0; box-shadow: inset 0 0 0 1px rgb(14 20 32 / 7%); }
.v2-page-teams .institution-copy { padding: 18px 10px 8px; }

.v2-page-teams .team-member { display: flex; flex-direction: column; }
.v2-person-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.v2-page-teams .team-member h3, .v2-page-teams .contact-card h3 { margin-top: 18px; }
.v2-page-teams .team-member > p:last-child { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--line); }
.v2-page-teams .team-member > .faculty-group-link { margin-bottom: 18px; align-self: flex-start; }
.v2-page-teams .team-member > p:last-child .text-link { margin-top: 0; font: 400 11.5px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.v2-avatar { --tc: var(--track-1); position: relative; display: block; flex: none; width: 76px; height: 76px; border-radius: 50%; isolation: isolate; }
.v2-avatar[data-tone="t2"] { --tc: var(--track-2); }
.v2-avatar[data-tone="v"] { --tc: var(--track-3); }
.v2-avatar::before { content: ""; position: absolute; inset: 0; border-radius: 50%; padding: 1.5px;
  background: conic-gradient(from 210deg, var(--tc), transparent 30%, color-mix(in oklab, var(--tc) 50%, transparent) 55%, transparent 80%, var(--tc));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude;
  transition: rotate 1.1s var(--ease-emphasized); }
.v2-avatar::after { content: ""; position: absolute; top: 5px; right: 5px; width: 9px; height: 9px; border-radius: 50%; background: var(--tc); box-shadow: 0 0 0 3px var(--surface), 0 0 12px var(--tc); }
.v2-avatar > span { position: absolute; inset: 6px; display: grid; place-items: center; border-radius: 50%;
  background: radial-gradient(circle at 32% 26%, color-mix(in oklab, var(--tc) 42%, var(--surface)), color-mix(in oklab, var(--tc) 9%, var(--surface)) 72%);
  box-shadow: inset 0 1px 0 rgb(255 255 255 / 14%), 0 14px 30px -14px color-mix(in oklab, var(--tc) 70%, transparent);
  font: 600 22px/1 var(--font-sans); letter-spacing: .02em; color: var(--ink); }
.v2-card:hover .v2-avatar::before { rotate: 200deg; }
.v2-page-teams .contributors { gap: 12px 16px; }
.v2-page-teams .contributor-list { gap: 10px; }
.v2-page-teams .contributor-list li { display: inline-flex; align-items: center; gap: 9px; padding: 5px 14px 5px 5px; border: 1px solid var(--line); border-radius: 999px; background: color-mix(in oklab, var(--surface) 82%, transparent); font-size: 14px; }
.v2-mini { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; font: 400 10px/1 var(--font-mono); letter-spacing: .04em; color: var(--ink); background: radial-gradient(circle at 32% 26%, color-mix(in oklab, var(--brand) 38%, var(--surface)), color-mix(in oklab, var(--brand) 10%, var(--surface)) 72%); box-shadow: inset 0 0 0 1px color-mix(in oklab, var(--brand) 35%, transparent); }
.v2-group-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.v2-group-plate { height: 64px; padding: 12px 20px; }
.v2-group-plate img { display: block; width: auto; height: auto; max-height: 38px; max-width: 220px; border-radius: 0 !important; }
@media (max-width: 860px) {
  .v2-logo-wall { grid-template-columns: minmax(0, 1fr); }
  .v2-logo { flex-direction: row; align-items: center; }
  .v2-logo-plate { width: 46%; height: 84px; padding: 14px 16px; flex: none; }
  .v2-group-top { flex-direction: column-reverse; align-items: flex-start; }
}
.v2-avatar.has-photo > span, .v2-mini.has-photo { overflow: hidden; background: var(--surface); }
.v2-avatar.has-photo img, .v2-mini.has-photo img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 50% !important; filter: saturate(.92) contrast(1.02); transition: filter var(--duration-slow) var(--ease-standard), scale var(--duration-emphasized) var(--ease-emphasized); }
.v2-card:hover .v2-avatar.has-photo img { filter: none; scale: 1.04; }
.v2-avatar.has-photo > span { inset: 5px; box-shadow: 0 0 0 1px color-mix(in oklab, var(--tc) 30%, transparent), 0 14px 30px -14px color-mix(in oklab, var(--tc) 70%, transparent); }
