/*
 * MSR Record — theme styles.
 * Dark-first MSR palette. The cyan-to-Signal-Blue gradient is the only depth in the system:
 * no glows, no drop shadows. Motion is transform, stroke and clip only, so every element
 * rests readable, and all of it stands down under reduced motion.
 */

/* ---------- tokens ---------- */
:root{
  --msr-bg:#0A1326; --msr-deep:#070D1A; --msr-surf:#10203B; --msr-raise:#16283F; --msr-chip:#24354F;
  --msr-plate:#060B16; --msr-plate-bar:#03070F;
  --msr-ink:#F5F7FA; --msr-text:#B9C0C9; --msr-soft:#9AA6B6;
  --msr-accent:#5BC2F2; --msr-on-accent:#0A1326;
  --msr-rule:rgba(91,194,242,.14); --msr-rule-hi:rgba(91,194,242,.34); --msr-grid:rgba(91,194,242,.07);
  --msr-grad:linear-gradient(135deg,#5BC2F2,#1E6FA8);
  --msr-g-a:#5BC2F2; --msr-g-b:#1E6FA8;
  --msr-theme-rot:0deg;
  --msr-display:var(--wp--preset--font-family--display, 'Caladea', Cambria, Georgia, serif);
  --msr-body:var(--wp--preset--font-family--body, 'Carlito', Calibri, 'Segoe UI', system-ui, sans-serif);
  --msr-mono:var(--wp--preset--font-family--mono, 'IBM Plex Mono', ui-monospace, Menlo, Consolas, monospace);
  --msr-ease:cubic-bezier(.2,.7,.2,1); --msr-ease-io:cubic-bezier(.65,0,.35,1);
  --msr-r:16px; --msr-r-lg:24px;
  color-scheme:dark;
  interpolate-size:allow-keywords;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --msr-bg:#F5F7FA; --msr-deep:#EAEEF3; --msr-surf:#FFFFFF; --msr-raise:#F0F3F7; --msr-chip:#E3E9F0;
    --msr-plate:#E3E9F0; --msr-plate-bar:#D3DCE6;
    --msr-ink:#10203B; --msr-text:#2A3140; --msr-soft:#56616F;
    --msr-accent:#1E6FA8; --msr-on-accent:#FFFFFF;
    --msr-rule:rgba(16,32,59,.12); --msr-rule-hi:rgba(30,111,168,.42); --msr-grid:rgba(16,32,59,.06);
    --msr-g-a:#1E6FA8; --msr-g-b:#10203B;
    --msr-theme-rot:180deg;
    color-scheme:light;
  }
}
:root[data-theme="light"]{
  --msr-bg:#F5F7FA; --msr-deep:#EAEEF3; --msr-surf:#FFFFFF; --msr-raise:#F0F3F7; --msr-chip:#E3E9F0;
  --msr-plate:#E3E9F0; --msr-plate-bar:#D3DCE6;
  --msr-ink:#10203B; --msr-text:#2A3140; --msr-soft:#56616F;
  --msr-accent:#1E6FA8; --msr-on-accent:#FFFFFF;
  --msr-rule:rgba(16,32,59,.12); --msr-rule-hi:rgba(30,111,168,.42); --msr-grid:rgba(16,32,59,.06);
  --msr-g-a:#1E6FA8; --msr-g-b:#10203B;
  --msr-theme-rot:180deg;
  color-scheme:light;
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth; scroll-padding-top:calc(100px + env(safe-area-inset-top,0px))}
:root:has(#wpadminbar){scroll-padding-top:132px}
body{margin:0; background:var(--msr-bg); color:var(--msr-text); font-family:var(--msr-body); font-size:1.0625rem; line-height:1.65;
  -webkit-text-size-adjust:100%; -webkit-font-smoothing:antialiased}
body::before{content:""; position:fixed; inset:0 0 auto; height:env(safe-area-inset-top,0px); z-index:40; background:var(--msr-bg)}
h1,h2,h3,h4{font-family:var(--msr-display); color:var(--msr-ink); font-weight:700; margin:0; letter-spacing:-.02em; text-wrap:balance}
p{margin:0; text-wrap:pretty}
a{color:var(--msr-accent); text-underline-offset:3px}
img{display:block; max-width:100%}
:focus-visible{outline:2px solid var(--msr-accent); outline-offset:3px}
::selection{background:var(--msr-accent); color:var(--msr-on-accent)}
.in{max-width:1200px; margin-inline:auto;
  padding-left:max(20px, env(safe-area-inset-left,0px)); padding-right:max(20px, env(safe-area-inset-right,0px))}

/* ---------- shared type ---------- */
.eb{display:flex; align-items:center; gap:10px; font:500 .72rem/1 var(--msr-mono); letter-spacing:.16em;
  text-transform:uppercase; color:var(--msr-accent)}
.eb::before{content:""; flex:none; width:22px; height:1px; background:var(--msr-grad); transform-origin:0 50%}
.lbl{font:500 .7rem/1.4 var(--msr-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--msr-soft)}
h1 em, h2 em{font-style:italic; font-weight:400; color:var(--msr-soft)}
.gt{background-image:linear-gradient(135deg, var(--msr-g-a) 20%, var(--msr-g-b) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; padding-right:.04em}
.lede{font-size:1.1rem; max-width:46ch}
.blk{padding-block:clamp(80px, 10vw, 128px)}
.blk.alt{background:var(--msr-deep)}
.wp-block-group.sh{display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); gap:20px 56px; align-items:end;
  margin-bottom:clamp(40px, 5vw, 64px)}
.sh h2, .wp-block-heading.h2{font-size:clamp(2.2rem, 4.8vw, 3.75rem); line-height:1.02; letter-spacing:-.03em}
.sh h2, .rec-side h2, .faq-side h2{margin-top:16px}
@media (max-width:860px){ .wp-block-group.sh{grid-template-columns:minmax(0,1fr)} }

/* ---------- buttons ---------- */
.wp-block-buttons.acts{gap:10px}
.wp-block-button__link, .msr-btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px;
  padding:0 22px; border-radius:999px; border:1px solid transparent; font:700 1rem/1 var(--msr-body); text-decoration:none;
  cursor:pointer; white-space:nowrap; background:var(--msr-accent); color:var(--msr-on-accent)}
.wp-block-button:not(.is-style-outline) .wp-block-button__link::after, .msr-btn.pri::after{content:""; flex:none; width:16px; height:16px;
  background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat}
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover, .msr-btn.pri:hover{background:var(--msr-ink); color:var(--msr-on-accent)}
.wp-block-button.is-style-outline .wp-block-button__link, .msr-btn.ghost{background:transparent; color:var(--msr-ink); border:1px solid var(--msr-rule-hi)}
.wp-block-button.is-style-outline .wp-block-button__link:hover, .msr-btn.ghost:hover{background:var(--msr-raise)}
.msr-btn.sm{min-height:44px; padding:0 18px; font-size:.92rem}
.icon-btn{width:44px; height:44px; flex:none; border-radius:50%; display:inline-flex; align-items:center; justify-content:center;
  padding:0; border:1px solid var(--msr-rule); background:transparent; color:var(--msr-ink); cursor:pointer}
.icon-btn:hover{background:var(--msr-raise)}
.icon-btn svg{width:18px; height:18px}
#msrThemeBtn svg{transform:rotate(var(--msr-theme-rot))}
.menu-btn path{transform-box:fill-box; transform-origin:50% 50%}
.menu-btn[aria-expanded="true"] .l1{transform:translateY(4px) rotate(45deg)}
.menu-btn[aria-expanded="true"] .l2{transform:translateY(-4px) rotate(-45deg)}

/* ---------- floating nav (header template part) ---------- */
.wp-block-template-part.top{position:sticky; top:env(safe-area-inset-top,0px); z-index:30; padding-top:12px}
.admin-bar .wp-block-template-part.top{top:32px}
@media (max-width:782px){ .admin-bar .wp-block-template-part.top{top:46px} }
@media (max-width:600px){ .admin-bar .wp-block-template-part.top{top:0} }
.pill{position:relative; display:flex; align-items:center; gap:12px; min-height:64px; padding:8px 8px 8px 10px;
  background:var(--msr-surf); border:1px solid var(--msr-rule); border-radius:999px}
.top.compact .pill{min-height:56px; padding-top:4px; padding-bottom:4px}
.brand{display:flex; align-items:center; gap:12px; min-width:0; text-decoration:none}
.brand img{width:40px; height:40px; flex:none}
.top.compact .brand img{transform:scale(.9)}
.brand-t{min-width:0}
.brand b{display:block; color:var(--msr-ink); font-size:1rem; line-height:1.15; white-space:nowrap}
.brand small{display:block; color:var(--msr-soft); font-size:.78rem; line-height:1.25; white-space:nowrap}
.links-wrap{position:relative; margin-left:auto}
.ind{position:absolute; left:0; top:0; height:100%; width:0; border-radius:999px; background:var(--msr-raise); opacity:0; pointer-events:none}
.links{position:relative; z-index:1; display:flex; gap:2px; list-style:none; margin:0; padding:0}
.links a{display:inline-flex; align-items:center; min-height:44px; padding:0 15px; border-radius:999px;
  color:var(--msr-text); text-decoration:none; font-size:.95rem}
.links a:hover, .links a[aria-current="true"]{color:var(--msr-ink)}
.tools{display:flex; align-items:center; gap:6px; margin-left:8px}
.menu-btn{display:none}
.progress{position:absolute; left:32px; right:32px; bottom:-1px; height:2px; border-radius:2px; background:var(--msr-grad);
  transform-origin:0 50%; transform:scaleX(0); opacity:0; pointer-events:none}
@supports (animation-timeline: scroll()){
  .progress{opacity:1; animation:msr-prog linear both; animation-timeline:scroll(root)}
}
@keyframes msr-prog{to{transform:scaleX(1)}}
.mnav{position:absolute; top:calc(100% + 8px); left:max(20px, env(safe-area-inset-left,0px));
  right:max(20px, env(safe-area-inset-right,0px)); display:grid; gap:2px; padding:10px; background:var(--msr-surf);
  border:1px solid var(--msr-rule); border-radius:var(--msr-r-lg)}
.mnav[hidden]{display:none}
.mnav a:not(.msr-btn){display:flex; align-items:center; min-height:48px; padding:0 14px; border-radius:12px; color:var(--msr-ink);
  text-decoration:none; font-size:1.05rem}
.mnav a:not(.msr-btn):hover{background:var(--msr-raise)}
.mnav .msr-btn{margin-top:8px}
@media (max-width:1100px){ .brand small{display:none} }
@media (max-width:980px){ .links-wrap, .tools .cta{display:none} .menu-btn{display:inline-flex} .tools{margin-left:auto} }
@media (max-width:420px){ .brand-t{display:none} }

/* ---------- hero ---------- */
.hero{position:relative; overflow:clip}
.gridbg{position:absolute; inset:0; overflow:hidden; pointer-events:none;
  -webkit-mask-image:radial-gradient(ellipse 60% 70% at 74% 40%, #000 18%, transparent 72%);
  mask-image:radial-gradient(ellipse 60% 70% at 74% 40%, #000 18%, transparent 72%)}
.gridbg::before{content:""; position:absolute; inset:-56px;
  background-image:linear-gradient(var(--msr-grid) 1px, transparent 1px), linear-gradient(90deg, var(--msr-grid) 1px, transparent 1px);
  background-size:56px 56px}
.wp-block-group.hero-in{position:relative; display:grid; grid-template-columns:minmax(0,1.22fr) minmax(0,1fr);
  gap:clamp(36px, 5vw, 72px); align-items:center; padding-block:clamp(48px, 7vw, 104px) clamp(64px, 8vw, 104px)}
.hero-copy .status{position:relative; display:inline-flex; align-items:center; gap:10px; padding:8px 14px 8px 12px; border-radius:999px;
  border:1px solid var(--msr-rule-hi); font:500 .7rem/1 var(--msr-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--msr-ink)}
.hero-copy .status::before{content:""; flex:none; width:8px; height:8px; border-radius:50%; background:var(--msr-grad)}
.hero-copy .hero-title{font-size:clamp(2.6rem, 5vw, 4.3rem); line-height:1; letter-spacing:-.035em; margin-top:26px}
.hero-title .w{display:inline-block; transform-origin:0 100%}
.hero-title strong, .hero-title strong .w{font-weight:inherit; background-image:linear-gradient(90deg, var(--msr-g-a), var(--msr-g-b), var(--msr-g-a));
  background-size:200% 100%; background-position:0 0; -webkit-background-clip:text; background-clip:text; color:transparent}
.hero-title strong:has(.w){background-image:none}
.hero-copy .sub{margin-top:24px; font-size:1.18rem; max-width:50ch}
.hero-copy .acts{margin-top:32px}
.hero-copy .refs{display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:28px; font-size:.95rem; color:var(--msr-soft)}
.hero-copy .refs::before{content:""; flex:none; width:18px; height:18px; background:var(--msr-accent);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h7l5 5v11a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z'/%3E%3Cpath d='M15 3v5h5M9.5 13h7M9.5 17h5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 3h7l5 5v11a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2z'/%3E%3Cpath d='M15 3v5h5M9.5 13h7M9.5 17h5'/%3E%3C/svg%3E") center/contain no-repeat}
.rec-wrap{min-width:0}
@media (max-width:940px){ .wp-block-group.hero-in{grid-template-columns:minmax(0,1fr)} }

/* subject record card */
.rec{position:relative; overflow:hidden; min-width:0; border-radius:var(--msr-r-lg); border:1px solid transparent;
  background:linear-gradient(var(--msr-surf), var(--msr-surf)) padding-box, var(--msr-grad) border-box}
.rec::after{content:""; position:absolute; left:0; right:0; top:-64px; height:64px; opacity:0; pointer-events:none;
  background:linear-gradient(to bottom, transparent, var(--msr-rule) calc(100% - 2px), var(--msr-accent) calc(100% - 2px));
  background:linear-gradient(to bottom, transparent, color-mix(in srgb, var(--msr-accent) 16%, transparent) calc(100% - 2px), var(--msr-accent) calc(100% - 2px))}
.rec-hd{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:15px 22px;
  border-bottom:1px solid var(--msr-rule); font:500 .68rem/1 var(--msr-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--msr-soft)}
.rec-hd b{font-weight:500; color:var(--msr-accent)}
.rec-id{display:flex; align-items:center; gap:22px; padding:24px 22px 6px}
.portrait{flex:none; width:148px; height:148px; margin:0; padding:2px; border-radius:24px; background:var(--msr-grad)}
.portrait .pf{display:block; width:100%; height:100%; overflow:hidden; border-radius:22px; background:var(--msr-raise)}
.portrait img{width:100%; height:100%; object-fit:cover}
.rec-id b{display:block; font-family:var(--msr-display); font-size:1.65rem; line-height:1.08; letter-spacing:-.015em; color:var(--msr-ink)}
.rec-id div > span{display:block; margin-top:6px; font-size:.95rem; line-height:1.4}
.rec dl.kv{display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px 18px; margin:0; padding:18px 22px 22px; font-size:.95rem; line-height:1.45}
.rec dl.kv dt{font:500 .64rem/2 var(--msr-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--msr-soft)}
.rec dl.kv dd{margin:0; color:var(--msr-ink); min-width:0}
.hash{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px 14px; align-items:center; padding:16px 22px;
  border-top:1px solid var(--msr-rule); background:var(--msr-raise)}
.hash .k{font-size:.86rem; line-height:1.35; color:var(--msr-soft)}
.hash .k b{display:block; font:500 .68rem/1.6 var(--msr-mono); letter-spacing:.14em; color:var(--msr-accent)}
.hash code{grid-column:1/-1; font:400 .8rem/1.65 var(--msr-mono); color:var(--msr-ink); word-spacing:.25em; overflow-wrap:anywhere;
  font-variant-numeric:tabular-nums; background:none; padding:0}
.vbtn{display:inline-flex; align-items:center; gap:7px; min-height:44px; padding:0 15px; border-radius:999px;
  border:1px solid var(--msr-rule-hi); background:transparent; color:var(--msr-ink); font:500 .68rem/1 var(--msr-mono);
  letter-spacing:.12em; text-transform:uppercase; cursor:pointer}
.vbtn:hover{background:var(--msr-surf)}
.vbtn:disabled{cursor:progress; opacity:.7}
.vbtn svg{width:14px; height:14px; color:var(--msr-accent)}
.hash-msg{grid-column:1/-1; font-size:.86rem; color:var(--msr-soft); min-height:1.35em}
.hash-msg.ok{color:var(--msr-accent)}
.rec-ft{display:flex; justify-content:space-between; align-items:center; gap:4px 14px; flex-wrap:wrap; padding:6px 22px;
  border-top:1px solid var(--msr-rule); font-size:.9rem; color:var(--msr-soft)}
.rec-ft a{display:inline-flex; align-items:center; gap:6px; min-height:44px; font-weight:700; text-decoration:none}
.rec-ft a svg{width:15px; height:15px}
@media (max-width:460px){ .rec-id{flex-direction:column; align-items:flex-start} }

/* forensic scale ruler under the hero */
.ruler{height:16px; border-top:1px solid var(--msr-rule);
  background:
    repeating-linear-gradient(90deg, var(--msr-rule-hi) 0 1px, transparent 1px 80px) left top/100% 14px no-repeat,
    repeating-linear-gradient(90deg, var(--msr-rule-hi) 0 1px, transparent 1px 8px) left top/100% 6px no-repeat}

/* ---------- ticker ---------- */
.mq{position:relative; background:var(--msr-deep); border-bottom:1px solid var(--msr-rule)}
.mq-view{overflow:hidden; padding-right:56px;
  -webkit-mask-image:linear-gradient(90deg, transparent, #000 6%, #000 88%, transparent);
  mask-image:linear-gradient(90deg, transparent, #000 6%, #000 88%, transparent)}
.mq-track{display:flex; width:max-content; animation:msr-mq 70s linear infinite}
.mq ul{display:flex; list-style:none; margin:0; padding:20px 0}
.mq li{display:flex; align-items:center; gap:28px; padding-right:28px; white-space:nowrap;
  font:500 .76rem/1 var(--msr-mono); letter-spacing:.16em; text-transform:uppercase; color:var(--msr-soft)}
.mq li::after{content:""; width:6px; height:6px; transform:rotate(45deg); background:var(--msr-grad)}
.mq:hover .mq-track, .mq.paused .mq-track{animation-play-state:paused}
@keyframes msr-mq{to{transform:translateX(-50%)}}
.mq-btn{position:absolute; top:50%; right:max(12px, env(safe-area-inset-right,0px)); transform:translateY(-50%); background:var(--msr-deep)}
.mq-btn .i-play{display:none}
.mq.paused .mq-btn .i-play{display:block}
.mq.paused .mq-btn .i-pause{display:none}

/* ---------- bento index ---------- */
.wp-block-group.bento{display:grid; grid-template-columns:repeat(12, minmax(0,1fr)); gap:16px}
.tile{display:flex; flex-direction:column; gap:16px; min-width:0; padding:clamp(22px, 2.6vw, 32px);
  border-radius:var(--msr-r-lg); background:var(--msr-surf); border:1px solid var(--msr-rule)}
.tile.t-a{grid-column:1 / span 7; grid-row:span 2; border-color:transparent;
  background:linear-gradient(var(--msr-surf), var(--msr-surf)) padding-box, var(--msr-grad) border-box}
.tile.t-b, .tile.t-c{grid-column:8 / span 5}
.tile.t-d, .tile.t-e, .tile.t-f{grid-column:span 4}
.t-top{display:flex; justify-content:space-between; gap:12px; flex-wrap:wrap}
.big{font-family:var(--msr-display); font-weight:700; color:var(--msr-ink); font-size:clamp(4rem, 8vw, 6.5rem); line-height:.88;
  letter-spacing:-.045em; font-variant-numeric:tabular-nums}
.num{display:inline-block; min-width:calc(var(--ch, 1) * 1ch); text-align:right}
.t-row{display:flex; align-items:flex-end; gap:18px}
.t-row .big{font-size:clamp(3.2rem, 5vw, 4.4rem); flex:none}
.t-row h3{font-size:1.2rem; line-height:1.25; padding-bottom:4px}
.tile h3{letter-spacing:-.01em}
.tile > h3{font-size:1.35rem; line-height:1.2}
.tile p{font-size:.98rem}
.lanes{display:grid; gap:14px; margin-top:auto}
.lane-l{display:block; margin-bottom:7px; font:500 .66rem/1.3 var(--msr-mono); letter-spacing:.1em; text-transform:uppercase; color:var(--msr-soft)}
.track{position:relative; height:10px; border-radius:999px; background:var(--msr-raise)}
.track i{position:absolute; top:0; bottom:0; left:calc(var(--a) / 16 * 100%); width:calc((var(--b) - var(--a)) / 16 * 100%);
  border-radius:inherit; background:var(--msr-soft); transform-origin:0 50%}
.lane.df .track i{background:var(--msr-grad)}
.axis{position:relative; height:30px; margin-top:4px;
  background:repeating-linear-gradient(90deg, var(--msr-rule-hi) 0 1px, transparent 1px calc(100% / 16)) left top/100% 6px no-repeat}
.axis::after{content:""; position:absolute; right:0; top:0; width:1px; height:6px; background:var(--msr-rule-hi)}
.axis span{position:absolute; top:12px; left:calc(var(--at) / 16 * 100%); transform:translateX(-50%);
  font:400 .7rem/1 var(--msr-mono); color:var(--msr-soft); font-variant-numeric:tabular-nums}
.axis span:first-child{transform:none}
.axis span:last-child{transform:translateX(-100%)}
.miles{list-style:none; margin:0; padding:16px 0 0; border-top:1px solid var(--msr-rule); display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px 24px; font-size:.92rem; line-height:1.4}
.miles b{display:block; font:500 .7rem/1.6 var(--msr-mono); letter-spacing:.08em; color:var(--msr-accent)}
.yrs{list-style:none; margin:auto 0 0; padding:0; display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:8px}
.yrs li{padding:12px 12px 13px; border-radius:12px; background:var(--msr-raise); font-size:.86rem; line-height:1.3; color:var(--msr-ink); min-width:0}
.yrs b{display:block; margin-bottom:4px; font:500 .72rem/1 var(--msr-mono); color:var(--msr-accent); font-variant-numeric:tabular-nums}
.codes{list-style:none; margin:auto 0 0; padding:0; display:grid; gap:6px}
.codes li{display:flex; align-items:center; gap:12px; font-size:.95rem; color:var(--msr-ink)}
.codes code{display:inline-flex; align-items:center; justify-content:center; width:40px; height:28px; border-radius:8px;
  background:var(--msr-raise); color:var(--msr-accent); font-family:var(--msr-mono); font-size:.72rem}
@media (max-width:1000px){
  .tile.t-a{grid-column:1 / -1; grid-row:auto}
  .tile.t-b, .tile.t-c{grid-column:span 6}
}
@media (max-width:720px){
  .wp-block-group.bento{grid-template-columns:minmax(0,1fr)}
  .tile.t-a, .tile.t-b, .tile.t-c, .tile.t-d, .tile.t-e, .tile.t-f{grid-column:1 / -1}
  .miles{grid-template-columns:minmax(0,1fr)}
}

/* ---------- practice ---------- */
.wp-block-group.disc{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:16px}
.wp-block-group.dc{position:relative; display:flex; flex-direction:column; gap:14px; min-width:0; padding:clamp(24px, 2.6vw, 30px);
  border-radius:var(--msr-r-lg); background:var(--msr-surf); border:1px solid var(--msr-rule)}
.dc::before, .ec::before{content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px; pointer-events:none;
  background:var(--msr-grad); opacity:0; transition:opacity .35s;
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0)}
.dc:hover::before, .ec:hover::before{opacity:1}
.dc-hd{display:flex; justify-content:space-between; align-items:center; margin-bottom:6px}
.dc-ic{width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:var(--msr-raise); color:var(--msr-accent)}
.dc-ic svg{width:26px; height:26px}
.dc-code{font:500 .7rem/1 var(--msr-mono); letter-spacing:.12em; color:var(--msr-soft); border:1px solid var(--msr-rule-hi);
  border-radius:999px; padding:7px 11px}
.dc h3{font-size:1.7rem; line-height:1.08}
.dc .dc-sub{font-family:var(--msr-display); font-style:italic; color:var(--msr-accent); font-size:1.06rem; line-height:1.35}
.dc .dc-body{font-size:.98rem}
.wp-block-list.caps{list-style:none; margin:6px 0 0; padding:0; border-top:1px solid var(--msr-rule)}
.caps li{display:grid; grid-template-columns:42px minmax(0,1fr); gap:8px; padding:11px 0; border-bottom:1px solid var(--msr-rule);
  font-size:.94rem; line-height:1.45; color:var(--msr-ink)}
.caps code{font:400 .68rem/2 var(--msr-mono); color:var(--msr-soft); background:none; padding:0}
.dc .fine{font-size:.86rem; color:var(--msr-soft)}
@media (max-width:1000px){ .wp-block-group.disc{grid-template-columns:minmax(0,1fr)} }

/* ---------- engagements ---------- */
.tags-legend{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px 22px; font-size:.9rem; color:var(--msr-soft)}
.tags-legend li{display:flex; align-items:center; gap:10px}
.tag{display:inline-flex; align-items:center; padding:6px 9px; border-radius:999px; background:var(--msr-bg); border:1px solid var(--msr-rule-hi);
  color:var(--msr-accent); font:500 .6rem/1 var(--msr-mono); letter-spacing:.08em; white-space:nowrap}
.wp-block-group.stack{display:grid; gap:20px; margin-top:36px}
.stack > .ec-item{position:relative}
.stack > :nth-child(2){--i:1} .stack > :nth-child(3){--i:2} .stack > :nth-child(4){--i:3}
.stack > :nth-child(5){--i:4} .stack > :nth-child(6){--i:5} .stack > :nth-child(7){--i:6} .stack > :nth-child(8){--i:7}
.ec{position:relative; display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); gap:clamp(20px, 3vw, 44px);
  align-items:center; padding:clamp(14px, 1.6vw, 20px); border-radius:28px; background:var(--msr-surf); border:1px solid var(--msr-rule);
  transform-origin:50% 0; transform:scale(calc(1 - var(--s, 0) * .05))}
.ec::after{content:""; position:absolute; inset:-1px; border-radius:inherit; background:var(--msr-deep); pointer-events:none;
  opacity:calc(var(--s, 0) * .6)}
@media (min-width:900px) and (min-height:720px){
  .stack > .ec-item{position:sticky; top:calc(100px + var(--i, 0) * 14px)}
}
.ec-body{display:flex; flex-direction:column; gap:12px; min-width:0; padding:10px clamp(4px, 1.5vw, 20px) 10px 0}
.ec-meta{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; font:500 .68rem/1 var(--msr-mono); letter-spacing:.12em;
  text-transform:uppercase; color:var(--msr-soft)}
.ec-meta .ex{color:var(--msr-accent)}
.chip{display:inline-flex; align-items:center; padding:6px 10px; border-radius:999px; background:var(--msr-raise); color:var(--msr-ink);
  font:500 .66rem/1 var(--msr-mono); letter-spacing:.1em; text-transform:uppercase}
.ec h3{font-size:clamp(1.5rem, 2.4vw, 2.1rem); line-height:1.08; letter-spacing:-.02em}
.ec p{max-width:46ch}
.ec dl{display:grid; grid-template-columns:auto minmax(0,1fr); gap:6px 16px; margin:4px 0 0; padding-top:14px;
  border-top:1px solid var(--msr-rule); font-size:.92rem; line-height:1.45}
.ec dt{font:500 .62rem/2 var(--msr-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--msr-soft)}
.ec dd{margin:0; color:var(--msr-ink); min-width:0}
@media (max-width:820px){ .ec{grid-template-columns:minmax(0,1fr)} .ec-body{padding:2px 6px 10px} }

/* image plates: every engagement image says what it is */
.plate{position:relative; aspect-ratio:16/10; max-width:100%; min-width:0; margin:0; overflow:hidden; border-radius:18px;
  background:var(--msr-plate); border:1px solid var(--msr-rule)}
.plate.sample{background-image:linear-gradient(var(--msr-grid) 1px, transparent 1px), linear-gradient(90deg, var(--msr-grid) 1px, transparent 1px);
  background-size:24px 24px; background-position:-1px -1px}
.plate svg{position:absolute; inset:0; width:100%; height:100%}
.plate .tag{position:absolute; left:12px; top:12px}
.plate .cap{position:absolute; left:14px; right:110px; bottom:12px; font-size:.8rem; line-height:1.2; color:var(--msr-ink);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.plate .tc{position:absolute; right:14px; bottom:12px; font:400 .68rem/1.2 var(--msr-mono); color:var(--msr-soft); font-variant-numeric:tabular-nums}
.p-bar{fill:var(--msr-plate-bar)}
.p-line{fill:none; stroke:var(--msr-rule-hi); stroke-width:1}
.p-ring{fill:none; stroke:var(--msr-rule-hi); stroke-width:1.5}
.p-acc{fill:var(--msr-accent)}
.p-acc-s{fill:none; stroke:var(--msr-accent); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round}
.p-dash{fill:none; stroke:var(--msr-soft); stroke-width:1.5; stroke-dasharray:5 6; stroke-linecap:round}
.p-screen{fill:var(--msr-raise); stroke:var(--msr-rule-hi); stroke-width:1}
.p-soft{fill:var(--msr-chip)}
.p-txt{fill:var(--msr-soft); font-family:var(--msr-mono); font-size:11px}
.pop, .grow, .playg{transform-box:fill-box; transform-origin:50% 50%}
.grow{transform-origin:0 50%}

/* ---------- record ---------- */
.wp-block-group.rec-grid{display:grid; grid-template-columns:minmax(0,.92fr) minmax(0,1.3fr); gap:clamp(40px, 6vw, 96px); align-items:start}
.wp-block-group.rec-side{position:sticky; top:112px}
.rec-side .lede, .faq-side .lede{margin-top:18px}
.wp-block-quote.bio{margin:32px 0 0; padding:26px 0 0; border:0; border-top:1px solid var(--msr-rule)}
.wp-block-quote.bio p{font-family:var(--msr-display); font-size:clamp(1.2rem, 1.9vw, 1.45rem); line-height:1.45; color:var(--msr-ink)}
.wp-block-quote.bio em{color:var(--msr-soft)}
.by{display:flex; align-items:center; gap:12px; margin-top:20px; font-size:.86rem; line-height:1.35; color:var(--msr-soft)}
.by img{width:44px; height:44px; flex:none; border-radius:12px; object-fit:cover}
.by b{display:block; color:var(--msr-ink); font-size:.95rem}
.wp-block-group.rec-main{display:grid; gap:56px; min-width:0}
.rgrp-h{padding-bottom:14px; border-bottom:1px solid var(--msr-rule); font:500 .72rem/1 var(--msr-mono); letter-spacing:.16em;
  text-transform:uppercase; color:var(--msr-soft)}
.tl{position:relative; list-style:none; margin:0; padding:6px 0 0 34px; view-timeline-name:--msr-tl}
.tl::before, .tl::after{content:""; position:absolute; left:7px; top:26px; bottom:30px; width:2px; border-radius:2px}
.tl::before{background:var(--msr-raise)}
.tl::after{background:var(--msr-grad); transform-origin:50% 0}
.tl li{position:relative; padding:16px 0 22px}
.tl li::before{content:""; position:absolute; left:-32px; top:20px; width:12px; height:12px; border-radius:50%;
  background:var(--msr-deep); border:2px solid var(--msr-accent)}
.tl li:hover::before{background:var(--msr-accent)}
.when{font:500 .7rem/1.3 var(--msr-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--msr-accent); font-variant-numeric:tabular-nums}
.tl h4{margin-top:8px; font-size:1.35rem; line-height:1.2; letter-spacing:-.01em}
.tl .org{display:block; margin-top:3px; font-size:.95rem; color:var(--msr-soft)}
.tl p{margin-top:8px; max-width:58ch; font-size:.98rem}
.creds, .awards{list-style:none; margin:0; padding:0}
.creds li, .awards li{display:grid; gap:6px 20px; align-items:center; padding:18px 0; border-bottom:1px solid var(--msr-rule)}
.creds li{grid-template-columns:minmax(0,1fr) auto}
.awards li{grid-template-columns:64px minmax(0,1fr) auto}
.creds b, .awards b{display:block; color:var(--msr-ink); font-size:1.05rem; line-height:1.35}
.creds .iss, .awards .iss{display:block; margin-top:2px; font-size:.92rem; line-height:1.4; color:var(--msr-soft)}
.awards .y{font-family:var(--msr-display); font-size:1.6rem; font-weight:700; color:var(--msr-ink); font-variant-numeric:tabular-nums}
.st{display:inline-flex; align-items:center; gap:8px; padding:7px 12px; border-radius:999px; border:1px solid var(--msr-rule-hi);
  color:var(--msr-ink); font:500 .64rem/1 var(--msr-mono); letter-spacing:.1em; text-transform:uppercase; white-space:nowrap}
.st::before{content:""; width:9px; height:9px; flex:none; border-radius:50%; border:1.5px solid var(--msr-accent)}
.st.on::before{background:var(--msr-accent)}
.st.half::before{background:linear-gradient(90deg, var(--msr-accent) 50%, transparent 50%)}
@media (max-width:940px){ .wp-block-group.rec-grid{grid-template-columns:minmax(0,1fr)} .wp-block-group.rec-side{position:static} }
@media (max-width:520px){ .awards li{grid-template-columns:52px minmax(0,1fr)} .awards .st{grid-column:2; justify-self:start}
  .creds li{grid-template-columns:minmax(0,1fr)} .creds .st{justify-self:start} }

/* ---------- platforms ---------- */
.pgrid{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(5, minmax(0,1fr)); gap:12px}
.pt{display:flex; flex-direction:column; gap:3px; min-width:0; padding:20px; border-radius:var(--msr-r);
  background:var(--msr-surf); border:1px solid var(--msr-rule)}
.pt-hd{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:14px}
.pt-mk{width:42px; height:42px; flex:none; border-radius:12px; display:grid; place-items:center; background:var(--msr-raise);
  color:var(--msr-accent); font:500 .74rem/1 var(--msr-mono)}
.pt:hover{border-color:var(--msr-rule-hi)}
.pt:hover .pt-mk{background:var(--msr-accent); color:var(--msr-on-accent)}
.pt .st{padding:6px 9px; font-size:.58rem}
.pt b{color:var(--msr-ink); font-size:1.02rem; line-height:1.3}
.pt .use{font-size:.88rem; line-height:1.4; color:var(--msr-soft)}
@media (max-width:1060px){ .pgrid{grid-template-columns:repeat(2, minmax(0,1fr))} }

/* ---------- faq ---------- */
.wp-block-group.faq{display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr); gap:clamp(40px, 6vw, 96px); align-items:start}
.steps{list-style:none; margin:36px 0 0; padding:0; display:grid; gap:0}
.steps li{position:relative; display:grid; grid-template-columns:40px minmax(0,1fr); gap:16px; padding-bottom:22px}
.steps li:not(:last-child)::after{content:""; position:absolute; left:19px; top:44px; bottom:4px; width:2px; border-radius:2px;
  background:var(--msr-raise); transform-origin:50% 0}
.steps .n{width:40px; height:40px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--msr-rule-hi);
  color:var(--msr-accent); font:500 .8rem/1 var(--msr-mono)}
.steps b{display:block; color:var(--msr-ink); font-size:1.05rem; padding-top:8px}
.steps p{font-size:.94rem; margin-top:2px}
.qa .wp-block-details{margin:0; border-bottom:1px solid var(--msr-rule)}
.qa .wp-block-details:first-child{border-top:1px solid var(--msr-rule)}
.qa summary{list-style:none; display:flex; justify-content:space-between; align-items:center; gap:20px; min-height:44px; padding:22px 0;
  cursor:pointer; color:var(--msr-ink); font-size:1.12rem; font-weight:700; line-height:1.35}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:""; flex:none; width:34px; height:34px; border-radius:50%;
  background:var(--msr-accent);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 34'%3E%3Cpath d='M17 11v12M11 17h12' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='17' r='16.5' fill='none' stroke='%23000' stroke-opacity='.35'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 34'%3E%3Cpath d='M17 11v12M11 17h12' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3Ccircle cx='17' cy='17' r='16.5' fill='none' stroke='%23000' stroke-opacity='.35'/%3E%3C/svg%3E") center/contain no-repeat}
.qa .wp-block-details[open] summary::after{transform:rotate(45deg)}
.qa .wp-block-details > p{padding:0 54px 24px 0; max-width:62ch}
@media (max-width:940px){ .wp-block-group.faq{grid-template-columns:minmax(0,1fr)} .qa .wp-block-details > p{padding-right:0} }

/* ---------- contact ---------- */
.wp-block-group.cpanel{position:relative; overflow:hidden; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:clamp(32px, 5vw, 72px);
  align-items:end; padding:clamp(28px, 5vw, 64px); border-radius:32px; border:1px solid transparent;
  background:linear-gradient(var(--msr-surf), var(--msr-surf)) padding-box, var(--msr-grad) border-box}
.cpanel::before{content:""; position:absolute; inset:0; pointer-events:none;
  background-image:linear-gradient(var(--msr-grid) 1px, transparent 1px), linear-gradient(90deg, var(--msr-grid) 1px, transparent 1px);
  background-size:40px 40px;
  -webkit-mask-image:radial-gradient(ellipse 55% 80% at 100% 0, #000, transparent 70%);
  mask-image:radial-gradient(ellipse 55% 80% at 100% 0, #000, transparent 70%)}
.cpanel > *{position:relative}
.cp-l .mega{font-size:clamp(2.6rem, 6vw, 5rem); line-height:.98; letter-spacing:-.035em; margin-top:18px}
.cp-l .lede{margin-top:20px}
.cp-l .acts{margin-top:32px}
.claim{margin-top:28px; padding-top:20px; border-top:1px solid var(--msr-rule); font-family:var(--msr-display); font-style:italic;
  font-size:1.15rem; color:var(--msr-ink)}
.cl{display:grid; gap:10px}
.cr{display:flex; justify-content:space-between; align-items:center; gap:12px; min-width:0; padding:14px 14px 14px 18px;
  border-radius:var(--msr-r); background:var(--msr-raise); border:1px solid var(--msr-rule)}
.cr:hover{border-color:var(--msr-rule-hi)}
.cr > div{min-width:0}
.cr span{display:block; font:500 .62rem/1.6 var(--msr-mono); letter-spacing:.12em; text-transform:uppercase; color:var(--msr-soft)}
.cr b{display:block; color:var(--msr-ink); font-size:1.06rem; overflow-wrap:anywhere; user-select:all}
.cp{flex:none; display:inline-flex; align-items:center; min-height:44px; padding:0 16px; border-radius:999px; border:1px solid var(--msr-rule-hi);
  background:transparent; color:var(--msr-ink); font:500 .66rem/1 var(--msr-mono); letter-spacing:.12em; text-transform:uppercase;
  text-decoration:none; cursor:pointer}
.cp:hover{background:var(--msr-surf)}
.cp.ok{color:var(--msr-accent); border-color:var(--msr-accent)}
@media (max-width:900px){ .wp-block-group.cpanel{grid-template-columns:minmax(0,1fr); align-items:start} }

/* ---------- footer (template part) ---------- */
.wp-block-template-part.ft{padding-block:clamp(64px, 8vw, 96px) 28px}
.ft-cols{display:grid; grid-template-columns:minmax(0,1.6fr) repeat(3, minmax(0,1fr)); gap:32px; padding-bottom:40px}
.ft-brand{display:flex; align-items:center; gap:14px}
.ft-brand img{width:44px; height:44px; flex:none}
.ft-brand b{display:block; color:var(--msr-ink)}
.ft-brand span{display:block; font-size:.88rem; color:var(--msr-soft)}
.ft h4{margin-bottom:12px; font:500 .64rem/1 var(--msr-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--msr-soft)}
.ft-cols a, .ft-cols .t{display:block; width:fit-content; max-width:100%; padding:5px 0; color:var(--msr-text); text-decoration:none;
  font-size:.94rem; overflow-wrap:anywhere}
.ft-cols a{background:linear-gradient(currentColor, currentColor) 0 calc(100% - 3px)/0 1px no-repeat}
.ft-cols a:hover{color:var(--msr-ink); background-size:100% 1px}
.wm{display:block; width:100%; height:auto; margin-top:8px}
.wm text{font-family:var(--msr-display); font-weight:700; font-size:150px; letter-spacing:-4px; fill:none; stroke:var(--msr-rule-hi); stroke-width:1}
.ft-base{display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px 20px; padding-top:22px; border-top:1px solid var(--msr-rule);
  font-size:.86rem; color:var(--msr-soft)}
.ft-base a{color:var(--msr-soft)}
@media (max-width:860px){ .ft-cols{grid-template-columns:repeat(2, minmax(0,1fr))} .ft-cols > :first-child{grid-column:1 / -1} }

/* ---------- inner pages, posts and archives ---------- */
.wp-block-group.page-main{padding-block:clamp(56px, 8vw, 104px)}
.page-main .narrow{max-width:760px}
.page-main .page-title, .page-main .wp-block-post-title, .page-main .wp-block-query-title{font-size:clamp(2.2rem, 4.8vw, 3.4rem); line-height:1.05; letter-spacing:-.03em}
.page-main .eb + .page-title{margin-top:16px}
.page-main .page-lede{margin-top:18px}
.page-main .page-acts{margin-top:28px}
.page-main .wp-block-post-date{margin-top:14px; font:500 .72rem/1.4 var(--msr-mono); letter-spacing:.14em; text-transform:uppercase; color:var(--msr-soft)}
.wp-block-post-content{margin-top:32px; font-size:1.08rem}
.wp-block-post-content > * + *{margin-top:1.1em}
.wp-block-post-content h2{font-size:2rem; margin-top:1.6em}
.wp-block-post-content h3{font-size:1.5rem; margin-top:1.5em}
.wp-block-post-content a{text-decoration:underline}
.post-list{list-style:none; margin:40px 0 0; padding:0; display:grid; gap:0}
.post-list > li{padding:28px 0; border-top:1px solid var(--msr-rule)}
.post-list .wp-block-post-title{font-size:1.6rem; line-height:1.15}
.post-list .wp-block-post-title a{color:var(--msr-ink); text-decoration:none}
.post-list .wp-block-post-title a:hover{color:var(--msr-accent)}
.post-list .wp-block-post-date{margin-top:0}
.post-list .wp-block-post-excerpt{margin-top:10px}
.wp-block-query-pagination{margin-top:32px; gap:12px}

/* ---------- motion ---------- */
::view-transition-old(root), ::view-transition-new(root){animation:none; mix-blend-mode:normal}
.cascade > :nth-child(2){--k:1} .cascade > :nth-child(3){--k:2} .cascade > :nth-child(4){--k:3}
.cascade > :nth-child(5){--k:4} .cascade > :nth-child(6){--k:5} .cascade > :nth-child(7){--k:6} .cascade > :nth-child(8){--k:7}
.miles{--cb:.65s} .yrs, .codes, .caps, .cl{--cb:.35s} .ec-body{--cb:.2s} .steps{--cb:.3s} .cp-l{--cb:.15s}

@media (prefers-reduced-motion:no-preference){
  /* arrival */
  .pill{animation:msr-navIn .8s var(--msr-ease) backwards; transition:min-height .35s var(--msr-ease), padding .35s var(--msr-ease)}
  .brand img{transition:transform .35s var(--msr-ease)}
  .ind{transition:transform .45s var(--msr-ease), width .45s var(--msr-ease), opacity .25s}
  .hero-copy > :not(.hero-title){animation:msr-rise .9s var(--msr-ease) backwards}
  .hero-copy > .sub{animation-delay:.42s}
  .hero-copy > .acts{animation-delay:.52s}
  .hero-copy > .refs{animation-delay:.62s}
  .hero-title .w{animation:msr-wordIn .9s var(--msr-ease) backwards; animation-delay:calc(.1s + var(--wi, 0) * 45ms)}
  .hero-title strong .w{animation:msr-wordIn .9s var(--msr-ease) backwards, msr-sheen 2.2s var(--msr-ease-io) 1s backwards;
    animation-delay:calc(.1s + var(--wi, 0) * 45ms), 1s}
  .hero-title .w > strong{animation:msr-sheen 2.2s var(--msr-ease-io) 1s backwards}
  .hero-copy .status::after{content:""; position:absolute; left:12px; top:50%; width:8px; height:8px; margin-top:-4px; border-radius:50%;
    border:1.5px solid var(--msr-accent); animation:msr-dotPing 2.6s var(--msr-ease) infinite}
  .rec{animation:msr-rise 1s var(--msr-ease) .2s backwards}
  .rec dl.kv > *{animation:msr-riseSm .7s var(--msr-ease) backwards; animation-delay:.5s}
  .rec dl.kv > :nth-child(n+3){animation-delay:.57s}
  .rec dl.kv > :nth-child(n+5){animation-delay:.64s}
  .rec dl.kv > :nth-child(n+7){animation-delay:.71s}
  .rec.scanning::after{animation:msr-scan 1.3s var(--msr-ease-io)}
  .portrait img{animation:msr-develop 1.6s var(--msr-ease-io) .7s backwards; transition:transform .6s var(--msr-ease)}
  .portrait:hover img{transform:scale(1.05)}
  .ruler{animation:msr-wipeIn 1.8s var(--msr-ease-io) .5s backwards}
  .gridbg::before{animation:msr-drift 30s linear infinite}
  @supports (animation-timeline: scroll()){
    .hero-copy{animation:msr-pxUp linear both; animation-timeline:scroll(root); animation-range:0 80vh}
    .rec-wrap{animation:msr-pxDown linear both; animation-timeline:scroll(root); animation-range:0 80vh}
  }
  @supports (animation-timeline: view()){
    .tl::after{animation:msr-growY linear both; animation-timeline:--msr-tl; animation-range:entry 30% cover 62%}
  }

  /* reveals: the script marks below-the-fold blocks .pend, then .seen as each one arrives */
  .rv.pend{transform:translateY(32px); transition:none}
  .rv.seen:not(.done){animation:msr-rvIn .95s var(--msr-ease) backwards; animation-delay:var(--d, 0ms)}
  .pend .eb::before{transform:scaleX(0)}
  .seen:not(.done) .eb::before{animation:msr-grow .9s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .2s)}
  .seen:not(.done) .cascade > *, .cascade.seen:not(.done) > *{animation:msr-riseSm .75s var(--msr-ease) backwards;
    animation-delay:calc(var(--d, 0ms) + var(--cb, 0s) + var(--k, 0) * 70ms)}

  /* bento: bars fill, axis wipes in, numbers count */
  .t-a.seen:not(.done) .track i{animation:msr-grow 1.3s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .35s)}
  .t-a.seen:not(.done) .lane.df .track i{animation-delay:calc(var(--d, 0ms) + .75s)}
  .t-a.seen:not(.done) .axis{animation:msr-wipeIn 1.2s var(--msr-ease-io) backwards; animation-delay:calc(var(--d, 0ms) + .2s)}

  /* discipline icons draw themselves, and again on hover */
  .pend .dc-ic [pathLength]{stroke-dasharray:1; stroke-dashoffset:1}
  .dc.seen:not(.done) .dc-ic [pathLength]{stroke-dasharray:1; animation:msr-draw 1.2s var(--msr-ease-io) backwards; animation-delay:calc(var(--d, 0ms) + .25s)}
  .dc.done:hover .dc-ic [pathLength]{stroke-dasharray:1; animation:msr-draw .9s var(--msr-ease-io)}

  /* engagement plates: lines draw, marks pop, dashes travel */
  .pend .dr{stroke-dasharray:1; stroke-dashoffset:1}
  .pend .pop{transform:scale(0); transition:none}
  .pend .grow{transform:scaleX(0)}
  .pend .bar-t{transform:translateY(-34px)}
  .pend .bar-b{transform:translateY(34px)}
  .seen:not(.done) .plate{animation:msr-plateIn 1s var(--msr-ease) backwards; animation-delay:var(--d, 0ms)}
  .seen:not(.done) .dr{stroke-dasharray:1; animation:msr-draw 1.3s var(--msr-ease-io) backwards; animation-delay:calc(var(--d, 0ms) + .3s + var(--k, 0) * .12s)}
  .seen:not(.done) .pop{animation:msr-pop .55s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .45s + var(--k, 0) * .12s)}
  .seen:not(.done) .grow{animation:msr-grow .9s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .4s + var(--k, 0) * .1s)}
  .seen:not(.done) .flow{animation:msr-flow 1.8s linear 2 backwards; animation-delay:calc(var(--d, 0ms) + .5s)}
  .seen:not(.done) .bar-t{animation:msr-barT .9s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .15s)}
  .seen:not(.done) .bar-b{animation:msr-barB .9s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .15s)}
  .playg{transition:transform .4s var(--msr-ease)}
  .ec:hover .playg{transform:scale(1.1)}

  /* record: each timeline dot rings once as its entry arrives */
  .tl li.seen:not(.done)::before{animation:msr-ringPing 1.2s ease-out backwards; animation-delay:calc(var(--d, 0ms) + .35s)}
  .tl li::before{transition:background-color .3s}
  .seen:not(.done) .st::before{animation:msr-pop .5s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .3s)}

  /* faq: steps fill in order, answers settle as they open */
  .seen:not(.done) .steps .n{animation:msr-pop .55s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .35s + var(--k, 0) * .15s)}
  .seen:not(.done) .steps li::after{animation:msr-growY .8s var(--msr-ease) backwards; animation-delay:calc(var(--d, 0ms) + .55s + var(--k, 0) * .15s)}
  .qa summary::after{transition:transform .3s var(--msr-ease)}
  .qa .wp-block-details > p.opening{animation:msr-riseSm .5s var(--msr-ease)}
  @supports selector(::details-content){
    .qa .wp-block-details::details-content{block-size:0; overflow-y:clip; transition:block-size .32s ease, content-visibility .32s allow-discrete}
    .qa .wp-block-details[open]::details-content{block-size:auto}
  }

  /* footer wordmark writes itself in */
  .pend.wm text{clip-path:inset(0 100% 0 0)}
  .wm.seen:not(.done) text{animation:msr-wipeIn 2.2s var(--msr-ease-io) backwards; animation-delay:var(--d, 0ms)}

  /* hover and press */
  .wp-block-button__link, .msr-btn{transition:background-color .2s, border-color .2s, color .2s, transform .2s var(--msr-ease)}
  .wp-block-button__link::after, .msr-btn::after{transition:transform .25s var(--msr-ease)}
  .wp-block-button__link:hover::after, .msr-btn:hover::after{transform:translateX(3px)}
  .wp-block-button__link:active, .msr-btn:active{transform:scale(.97)}
  .tile, .dc, .pt{transition:transform .45s var(--msr-ease), border-color .3s}
  .tile:not(.pend):hover, .dc:not(.pend):hover, .pt:not(.pend):hover{transform:translateY(-4px)}
  .pt-mk{transition:background-color .3s, color .3s}
  .cr{transition:transform .4s var(--msr-ease), border-color .3s}
  .cr:hover{transform:translateX(4px)}
  .ft-cols a{transition:background-size .35s var(--msr-ease), color .2s}
  #msrThemeBtn svg{transition:transform .5s var(--msr-ease)}
  .menu-btn path{transition:transform .3s var(--msr-ease)}
  .mnav:not([hidden]){animation:msr-menuIn .35s var(--msr-ease)}
  .cp.ok{animation:msr-pop .35s var(--msr-ease)}
}
@keyframes msr-navIn{from{transform:translateY(-14px)}}
@keyframes msr-rise{from{transform:translateY(18px)}}
@keyframes msr-riseSm{from{transform:translateY(10px)}}
@keyframes msr-rvIn{from{transform:translateY(32px)}}
@keyframes msr-wordIn{from{transform:translateY(.5em) rotate(3deg)}}
@keyframes msr-sheen{from{background-position:100% 0}}
@keyframes msr-dotPing{from{transform:scale(1); opacity:.9} to{transform:scale(3); opacity:0}}
@keyframes msr-scan{0%{top:-64px; opacity:0} 10%{opacity:1} 85%{opacity:1} 100%{top:100%; opacity:0}}
@keyframes msr-develop{from{filter:grayscale(1) brightness(.85)}}
@keyframes msr-wipeIn{from{clip-path:inset(0 100% 0 0)}}
@keyframes msr-drift{to{transform:translate(56px, 56px)}}
@keyframes msr-grow{from{transform:scaleX(0)}}
@keyframes msr-growY{from{transform:scaleY(0)}}
@keyframes msr-draw{from{stroke-dashoffset:1}}
@keyframes msr-pop{from{transform:scale(0)}}
@keyframes msr-plateIn{from{transform:scale(.94)}}
@keyframes msr-flow{from{stroke-dashoffset:66}}
@keyframes msr-barT{from{transform:translateY(-34px)}}
@keyframes msr-barB{from{transform:translateY(34px)}}
@keyframes msr-ringPing{from{outline:2px solid var(--msr-accent); outline-offset:0} to{outline:2px solid transparent; outline-offset:12px}}
@keyframes msr-pxUp{to{transform:translateY(-56px)}}
@keyframes msr-pxDown{to{transform:translateY(28px)}}
@keyframes msr-menuIn{from{transform:translateY(-8px) scale(.98)}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .mq-track{animation:none; width:auto}
  .mq-track ul + ul{display:none}
  .mq ul{flex-wrap:wrap; justify-content:center; row-gap:12px; padding-inline:20px}
  .mq-view{-webkit-mask-image:none; mask-image:none; padding-right:0}
  .mq-btn{display:none}
}
@media (forced-colors:active){ .gt, .hero-title strong, .hero-title strong .w{color:CanvasText; background:none} }