/* RitamSage, round 2: the fusion design system (shared/base.css)
   Observatory as the base language (paper, emerald hairlines, measured spacing, Plex Mono for data),
   Bento tiles for hubs, Atlas night bands for detail heroes.

   Components (all opt-in by class):
   .wrap                         page width + gutters
   .kicker  (+ .rule span)       mono eyebrow with a hairline
   .site-head / .site-foot       shared header (sticky, ruler) and footer
   #rs-sound-toggle              header Sound button (nav.js wires it to RS.sound)
   .btn .btn-solid .btn-ghost .btn-light .btn-sm
   .chip, .tags
   .bento + .tile (.t2 .white .sand .deep .night) + spans .c3–.c12, .r2
   .phone > .screen > img        CSS phone frame (--pw sets width)
   .night (+ canvas.starfield)   night band, #053426 -> #1E2A4A
   .jade                         free-standing jade carving with soft shadow
   [data-reveal]                 visible at rest; nav.js animates it in only if below the fold and motion is allowed
   body.has-night                header sits transparent over the first .night band, turns paper on scroll
*/
:root{
  --paper:#F8F6EF; --paper-hi:#FCFBF7; --paper-lo:#F1EEE3;
  --ink:#0A2F23; --muted:#4C6A5D; --line:#DCEDDD;
  --hair:rgba(15,97,71,.16); --hair-strong:rgba(15,97,71,.32);
  --e900:#053426; --e800:#0B4A36; --e700:#0F6147; --e500:#5FA584; --e300:#A3CFB5; --e200:#DCEDDD; --e100:#ECF5EB;
  --amber:#E9A21A; --copper:#A35B1A; --sand:#F2EDE0; --white:#FFFFFF;
  --night-a:#053426; --night-b:#1E2A4A;
  --on-night:#EAF2EC; --on-night-muted:#A9C4B7; --on-night-line:rgba(163,207,181,.22);
  --serif:"Cormorant Garamond","Cormorant",Georgia,"Times New Roman",serif;
  --sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --deva:"Noto Serif Devanagari","Cormorant Garamond",serif;
  --wrap:1280px; --gutter:clamp(16px,3.4vw,40px);
  --r-xl:28px; --r-lg:22px; --r-md:16px; --r-sm:10px;
  --gap:16px; --head-h:68px;
  --shadow:0 1px 1px rgba(5,52,38,.04),0 18px 40px -22px rgba(5,52,38,.28);
  --jade-shadow:drop-shadow(0 6px 10px rgba(5,52,38,.18));
  --jade-glow:drop-shadow(0 10px 26px rgba(0,0,0,.38));
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--head-h) + 20px)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.62;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-variant-numeric:lining-nums;overflow-x:hidden}
img,svg,canvas{max-width:100%}
img{height:auto;display:block}
a{color:var(--e700);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--e900)}
:focus-visible{outline:2px solid var(--e700);outline-offset:3px;border-radius:6px}
.night :focus-visible,.deep :focus-visible{outline-color:var(--e300)}
h1,h2,h3,h4{font-family:var(--serif);font-weight:500;line-height:1.05;letter-spacing:-.01em;margin:0;text-wrap:balance;font-variant-numeric:lining-nums;color:inherit}
h1{font-size:clamp(44px,6.2vw,92px)}
h2{font-size:clamp(34px,4.2vw,58px)}
h3{font-size:clamp(25px,2.4vw,33px)}
h4{font-size:22px}
p{margin:0 0 1em}
button{font:inherit;color:inherit}
.deva{font-family:var(--deva);font-weight:500;letter-spacing:0}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.sage{font-family:var(--serif);font-style:italic;font-weight:500}
.lede{font-size:clamp(18px,1.55vw,21px);line-height:1.58;color:var(--muted);max-width:62ch}
.muted{color:var(--muted)}
.small{font-size:14.5px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;background:var(--e900);color:#fff;padding:10px 16px;border-radius:999px;z-index:200;text-decoration:none}
.skip:focus{top:12px;color:#fff}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--gutter)}

/* kicker: the Observatory data voice */
.kicker{font-family:var(--mono);font-size:11.5px;line-height:1.5;letter-spacing:.14em;text-transform:uppercase;font-weight:500;color:var(--e700);display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 16px}
.kicker .rule{flex:0 0 32px;height:1px;background:currentColor;opacity:.55}
.deep .kicker,.night .kicker{color:var(--e300)}
.coord{font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;color:var(--muted);font-variant-numeric:tabular-nums}

/* ---------- header ---------- */
.site-head{position:sticky;top:0;z-index:60;background:rgba(248,246,239,.86);backdrop-filter:saturate(1.3) blur(14px);-webkit-backdrop-filter:saturate(1.3) blur(14px);transition:background .35s var(--ease),color .35s var(--ease)}
.head-bar{display:flex;align-items:center;gap:18px;height:var(--head-h)}
.site-head .ruler{height:7px;border-top:1px solid var(--hair);background:
  repeating-linear-gradient(90deg,var(--hair-strong) 0 1px,transparent 1px 60px) top left/100% 7px no-repeat,
  repeating-linear-gradient(90deg,var(--hair) 0 1px,transparent 1px 12px) top left/100% 4px no-repeat;opacity:.9}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);flex:none}
.brand img{width:auto;height:42px;border-radius:0;flex:none}
.brand .mark-dark{display:none}
.brand span{font-family:var(--serif);font-size:27px;font-weight:600;letter-spacing:-.005em;line-height:1}
.nav{display:flex;align-items:center;gap:2px;margin-left:auto}
.nav a{font-size:15px;color:var(--ink);text-decoration:none;padding:8px 12px;border-radius:999px;font-weight:500;position:relative;transition:background .2s,color .2s}
.nav a:hover{background:var(--e100);color:var(--e900)}
.nav a[aria-current=page]{color:var(--e900)}
.nav a[aria-current=page]::after{content:"";position:absolute;left:12px;right:12px;bottom:3px;height:1.5px;background:var(--e700);border-radius:2px}
.head-actions{display:flex;align-items:center;gap:10px;flex:none}
.sound-toggle{display:inline-flex;align-items:center;gap:8px;height:38px;padding:0 14px 0 12px;border-radius:999px;border:1px solid var(--hair-strong);background:transparent;color:var(--e900);font:600 13.5px/1 var(--sans);cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.sound-toggle:hover{background:var(--e100)}
.sound-toggle[hidden]{display:none}
.sound-toggle .eq{display:flex;align-items:flex-end;gap:2px;height:14px;width:16px}
.sound-toggle .eq i{flex:1;background:currentColor;border-radius:1px;height:30%;opacity:.8}
.sound-toggle .eq i:nth-child(2){height:60%}.sound-toggle .eq i:nth-child(3){height:45%}.sound-toggle .eq i:nth-child(4){height:20%}
.sound-toggle[aria-pressed=true]{background:var(--e900);border-color:var(--e900);color:#fff}
.sound-toggle[aria-pressed=true] .eq i{animation:eq 1.1s ease-in-out infinite}
.sound-toggle[aria-pressed=true] .eq i:nth-child(2){animation-delay:-.3s}.sound-toggle[aria-pressed=true] .eq i:nth-child(3){animation-delay:-.6s}.sound-toggle[aria-pressed=true] .eq i:nth-child(4){animation-delay:-.85s}
@keyframes eq{0%,100%{height:22%}50%{height:100%}}
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;width:42px;height:42px;border-radius:999px;border:1px solid var(--hair-strong);display:grid;place-items:center;color:var(--e900)}
.menu summary::-webkit-details-marker{display:none}
.menu summary svg{width:20px;height:20px}
.menu[open] summary{background:var(--e100)}
.menu-panel{position:absolute;right:0;top:52px;width:min(320px,calc(100vw - 32px));background:#fff;border:1px solid var(--hair);border-radius:var(--r-lg);box-shadow:0 30px 60px -20px rgba(5,52,38,.35);padding:10px;display:grid;gap:2px}
.menu-panel a{padding:12px 14px;border-radius:12px;text-decoration:none;color:var(--ink);font-weight:500}
.menu-panel a:hover,.menu-panel a[aria-current=page]{background:var(--e100)}
.menu-panel .btn{justify-content:center;margin-top:8px;color:#fff}
@media (max-width:1140px){.nav{display:none}.menu{display:block}.head-actions{margin-left:auto}}
@media (max-width:560px){.head-actions .btn-get{display:none}.sound-toggle{padding:0 11px}.sound-toggle .lbl{display:none}.brand span{font-size:25px}.site-head .brand img{height:40px}}

/* header over a night band */
body.has-night .site-head{background:rgba(5,40,32,.86);color:var(--on-night)}
body.has-night .site-head.is-paper{background:rgba(248,246,239,.88);color:var(--ink)}
body.has-night .site-head.is-clear{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
body.has-night .site-head:not(.is-paper) .brand,body.has-night .site-head:not(.is-paper) .nav a{color:var(--on-night)}
body.has-night .site-head:not(.is-paper) .brand .mark-light{display:none}
body.has-night .site-head:not(.is-paper) .brand .mark-dark{display:block}
body.has-night .site-head:not(.is-paper) .nav a:hover{background:rgba(220,237,221,.1);color:#fff}
body.has-night .site-head:not(.is-paper) .nav a[aria-current=page]::after{background:var(--e300)}
body.has-night .site-head:not(.is-paper) .sound-toggle,body.has-night .site-head:not(.is-paper) .menu summary{color:var(--on-night);border-color:rgba(220,237,221,.32)}
body.has-night .site-head:not(.is-paper) .menu[open] summary{color:var(--e900);background:var(--paper)}
body.has-night .site-head:not(.is-paper) .sound-toggle[aria-pressed=true]{background:var(--paper);color:var(--e900);border-color:var(--paper)}
body.has-night .site-head:not(.is-paper) .btn-get{background:var(--paper);color:var(--e900)}
body.has-night .site-head:not(.is-paper) .ruler{opacity:.35;filter:invert(1) hue-rotate(180deg)}
body.has-night .night-first{margin-top:calc(-1 * (var(--head-h) + 8px));padding-top:calc(var(--head-h) + 8px)}

/* ---------- buttons, chips ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font:600 15px/1.1 var(--sans);text-decoration:none;border-radius:999px;padding:13px 22px;border:1px solid transparent;cursor:pointer;transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s;white-space:nowrap}
.btn svg{width:18px;height:18px;flex:none}
.btn-solid{background:var(--e900);color:#fff}
.btn-solid:hover{background:var(--e700);color:#fff;transform:translateY(-1px)}
.btn-light{background:#fff;color:var(--e900)}
.btn-light:hover{background:var(--e100);color:var(--e900)}
.btn-ghost{background:transparent;color:inherit;border-color:var(--hair-strong)}
.btn-ghost:hover{border-color:var(--e700)}
.night .btn-ghost,.deep .btn-ghost{border-color:rgba(220,237,221,.35)}
.btn-sm{padding:10px 17px;font-size:14px}
.arrow{display:inline-flex;align-items:center;gap:8px;font-weight:600;font-size:15px;color:var(--e700);text-decoration:none}
.deep .arrow,.night .arrow{color:#fff}
.arrow::after{content:"";width:18px;height:18px;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='black' 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='black' 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;transition:transform .3s var(--ease)}
a:hover .arrow::after,a.arrow:hover::after{transform:translateX(4px)}
.chip{text-decoration:none;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.8);color:var(--e900);letter-spacing:.01em;border:0}
.white .chip{background:var(--e100)}
.deep .chip,.night .chip{background:rgba(255,255,255,.12);color:#DFF0E4}
button.chip{cursor:pointer}
.tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.tags li{background:#fff;border-radius:999px;padding:7px 14px;font-size:14.5px;font-weight:500}
.white .tags li{background:var(--e100)}
.gp{display:inline-flex;align-items:center;gap:12px;background:#000;color:#fff;border-radius:14px;padding:10px 18px 10px 14px;text-decoration:none;line-height:1.15}
.gp svg{width:24px;height:24px}
.gp small{display:block;font:500 10.5px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;opacity:.8}
.gp b{font-size:17px;font-weight:600}
.gp:hover{color:#fff;background:#111}

/* ---------- bento grid + tiles ---------- */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:var(--gap);grid-auto-flow:dense}
.tile{position:relative;border-radius:var(--r-xl);background:var(--e100);padding:clamp(22px,2.8vw,40px);overflow:hidden;isolation:isolate;min-width:0;color:var(--ink);box-shadow:inset 0 0 0 1px rgba(15,97,71,.07);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.tile.t2{background:var(--e200)}
.tile.white{background:#fff;box-shadow:inset 0 0 0 1px var(--hair)}
.tile.sand{background:var(--sand)}
.tile.deep{background:radial-gradient(120% 90% at 85% 0%,#14704F 0%,#0B4A36 38%,#053426 78%);color:#EAF4EC;box-shadow:none}
.tile.night{background:linear-gradient(165deg,var(--night-a) 0%,#0A3B36 40%,#15324A 75%,var(--night-b) 100%);color:var(--on-night);box-shadow:none}
.tile.deep .muted,.tile.deep .lede,.tile.night .muted{color:#B9D8C5}
.tile.deep a:not(.btn):not(.chip),.tile.night a:not(.btn):not(.chip){color:#fff}
a.tile{text-decoration:none;display:block}
a.tile:hover,.tile.lift:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.tile h2,.tile h3{margin-bottom:12px}
.tile p:last-child{margin-bottom:0}
.c3{grid-column:span 3}.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}.c7{grid-column:span 7}.c8{grid-column:span 8}.c9{grid-column:span 9}.c12{grid-column:1/-1}
.r2{grid-row:span 2}
@media (max-width:1020px){.c3,.c4,.c5,.c7{grid-column:span 6}.c8,.c9{grid-column:1/-1}}
@media (max-width:680px){.bento{gap:12px}.c3,.c4,.c5,.c6,.c7,.c8,.c9{grid-column:1/-1}.r2{grid-row:auto}.tile{border-radius:22px}}

/* ---------- section heads ---------- */
.section{padding:clamp(56px,8vw,112px) 0 0}
.section-head{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px 48px;align-items:end;margin-bottom:clamp(24px,3vw,40px)}
.section-head>p{margin:0;color:var(--muted);font-size:18px;max-width:52ch}
@media (max-width:820px){.section-head{grid-template-columns:1fr}}
.page-head{padding-top:clamp(32px,5vw,72px);padding-bottom:clamp(24px,3.4vw,40px)}
.page-head h1{max-width:16ch}
.page-head .lede{margin-top:20px}
.hairline{border:0;border-top:1px solid var(--hair);margin:0}

/* ---------- phone ---------- */
.phone{position:relative;width:min(100%,var(--pw,300px));aspect-ratio:360/780;border-radius:calc(var(--pw,300px)*.15);padding:calc(var(--pw,300px)*.032);background:linear-gradient(145deg,#1B4A3A,#0A2F23 40%,#04241A);box-shadow:0 1px 0 1px rgba(255,255,255,.08) inset,0 50px 80px -40px rgba(5,52,38,.55),0 24px 40px -24px rgba(5,52,38,.35);flex:none}
.phone .screen{position:relative;width:100%;height:100%;border-radius:calc(var(--pw,300px)*.12);overflow:hidden;background:var(--paper)}
.phone .screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center}
.phone::after{content:"";position:absolute;top:calc(var(--pw,300px)*.05);left:50%;width:calc(var(--pw,300px)*.032);height:calc(var(--pw,300px)*.032);transform:translateX(-50%);border-radius:50%;background:#06261C;box-shadow:inset 0 0 0 2px #0E3a2c}
.phone-rise{display:flex;justify-content:center;margin-bottom:calc(-1 * clamp(22px,2.8vw,40px))}
.phone-rise .phone{border-bottom-left-radius:0;border-bottom-right-radius:0;padding-bottom:0;aspect-ratio:360/600}
.phone-rise .phone .screen{border-bottom-left-radius:0;border-bottom-right-radius:0}

/* ---------- night band ---------- */
.night{position:relative;color:var(--on-night);background:radial-gradient(120% 90% at 85% 0%,rgba(30,42,74,0) 0%,rgba(30,42,74,.55) 100%),linear-gradient(165deg,var(--night-a) 0%,#0A3B36 38%,#15324A 72%,var(--night-b) 100%);overflow:hidden;isolation:isolate}
.night .starfield{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.night::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,rgba(163,207,181,.4),transparent)}
.night h1,.night h2{color:#F3F8F2}
.night a:not(.btn):not(.chip){color:var(--e300)}
.night .btn-solid{background:var(--paper);color:var(--e900)}
.night .btn-solid:hover{background:#fff;color:var(--e900)}
.crumbs{font:500 12px/1.4 var(--mono);letter-spacing:.1em;text-transform:uppercase;margin:0 0 22px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap}
.crumbs a{color:inherit;text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs [aria-hidden]{opacity:.5}
.night .crumbs{color:var(--on-night-muted)}

/* ---------- jade ---------- */
.jade{filter:var(--jade-shadow);object-fit:contain}
.night .jade,.deep .jade.pale{filter:var(--jade-glow)}
.float{transition:transform .9s var(--ease);will-change:transform;transform:translate3d(var(--px,0),var(--py,0),0)}

/* ---------- footer ---------- */
.site-foot{margin-top:clamp(64px,8vw,120px);padding:0 0 40px}
.foot-tile{background:var(--e100);border-radius:var(--r-xl);padding:clamp(28px,4vw,56px);display:grid;grid-template-columns:1.3fr 1fr .8fr .9fr 1.7fr;gap:32px;box-shadow:inset 0 0 0 1px rgba(15,97,71,.07);position:relative;overflow:hidden}
.foot-tile h4{font:500 11.5px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--e700);margin-bottom:14px}
.foot-tile h4 a{color:inherit;text-decoration:none}
.foot-tile ul{list-style:none;margin:0;padding:0;display:grid;gap:7px;font-size:15px}
.foot-tile a{color:var(--ink);text-decoration:none}
.foot-tile a:hover{color:var(--e700);text-decoration:underline}
.foot-tile .brand span{font-size:30px}
.foot-tile .brand img{height:48px}
.foot-tile .about{color:var(--muted);font-size:15px;margin:16px 0 0;max-width:36ch}
.foot-tile ul.cols-2{display:block;columns:2;column-gap:20px}
.foot-tile ul.cols-2 li{margin-bottom:7px;break-inside:avoid}
.foot-mark{position:absolute;right:-30px;bottom:-40px;width:220px;opacity:.06;pointer-events:none}
.foot-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13.5px;color:var(--muted);padding:22px 8px 0}
.foot-base a{color:var(--muted)}
@media (max-width:1020px){.foot-tile{grid-template-columns:1fr 1fr}.foot-tile .fb{grid-column:1/-1}}
@media (max-width:480px){.foot-tile{grid-template-columns:1fr}}

/* ---------- footer disclosures: plain columns on wide screens, collapsible on phones ---------- */
.foot-acc>summary{display:none}
.foot-acc>summary::-webkit-details-marker{display:none}


/* ---------- phones and small tablets: the menu is a full-screen sheet ---------- */
@media (max-width:900px){
  .menu-panel{position:fixed;left:0;right:0;top:calc(var(--head-h) + 8px);bottom:0;width:auto;border:0;border-top:1px solid var(--hair);border-radius:0;box-shadow:none;background:var(--paper);padding:12px var(--gutter) calc(24px + env(safe-area-inset-bottom,0px));gap:0;align-content:start;overflow-y:auto;overscroll-behavior:contain;animation:sheet-in .35s var(--ease) both}
  .menu-panel a:not(.btn){font-family:var(--serif);font-size:30px;font-weight:500;line-height:1.1;min-height:60px;display:flex;align-items:center;padding:0 4px;border-radius:0;border-bottom:1px solid var(--hair)}
  .menu-panel a:not(.btn)[aria-current=page]{background:none;color:var(--e700)}
  .menu-panel a:not(.btn)[aria-current=page]::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--amber);margin-left:12px}
  .menu-panel .btn{margin-top:24px;min-height:52px;font-size:16px}
  html.menu-open,html.menu-open body{overflow:hidden}
  body.has-night .site-head:not(.is-paper) .menu-panel a:not(.btn){color:var(--ink)}
}
@keyframes sheet-in{from{opacity:0;transform:translate3d(0,-10px,0)}to{opacity:1;transform:none}}
@media (max-width:560px){
  .menu summary,.sound-toggle{width:44px;height:44px;padding:0;justify-content:center}
  .head-actions{gap:8px}
  .head-bar .brand{min-height:44px}
  .foot-tile .about a{display:inline-flex;align-items:center;min-height:44px}
  .crumbs{margin-top:-12px;margin-bottom:10px}
  .crumbs a{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px}
  /* footer: compact, collapsible lists with 44px targets */
  .site-foot{padding-bottom:28px}
  .foot-tile{gap:0;padding:26px 20px 14px}
  .foot-tile .fb{padding-bottom:18px}
  .foot-tile>div:not(.fb){padding-bottom:6px}
  .foot-tile ul,.foot-tile ul.cols-2{display:flex;flex-wrap:wrap;columns:auto;gap:0 2px;margin:0 -10px}
  .foot-tile ul li,.foot-tile ul.cols-2 li{margin:0}
  .foot-tile ul a{display:inline-flex;align-items:center;min-height:44px;padding:0 10px}
  .foot-tile h4{margin:14px 0 2px}
  .foot-acc{border-top:1px solid var(--hair)}
  .foot-acc>h4{display:none}
  .foot-acc>summary{display:flex;align-items:center;justify-content:space-between;min-height:52px;cursor:pointer;list-style:none;font:500 11.5px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--e700)}
  .foot-acc>summary::after{content:"";width:9px;height:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translate(-2px,-2px);transition:transform .3s var(--ease)}
  .foot-acc[open]>summary::after{transform:rotate(225deg)}
  .foot-acc>ul{padding-bottom:12px}
  .foot-base{padding:18px 4px 0;font-size:13px}
}

/* ---------- reveal (visible at rest; nav.js adds .rv-pending only below the fold) ---------- */
.rv-pending{opacity:0;transform:translate3d(0,26px,0)}
.rv-in{opacity:1;transform:none;transition:opacity .9s var(--ease),transform 1s var(--ease);transition-delay:var(--rv-delay,0s)}
[data-reveal=stagger].rv-pending{opacity:1;transform:none}
[data-reveal=stagger].rv-pending>*{opacity:0;transform:translate3d(0,22px,0)}
[data-reveal=stagger].rv-in>*{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .9s var(--ease)}
[data-reveal=stagger].rv-in>*:nth-child(2){transition-delay:.06s}[data-reveal=stagger].rv-in>*:nth-child(3){transition-delay:.12s}[data-reveal=stagger].rv-in>*:nth-child(4){transition-delay:.18s}[data-reveal=stagger].rv-in>*:nth-child(5){transition-delay:.24s}[data-reveal=stagger].rv-in>*:nth-child(6){transition-delay:.3s}[data-reveal=stagger].rv-in>*:nth-child(n+7){transition-delay:.36s}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv-pending,[data-reveal=stagger].rv-pending>*{opacity:1!important;transform:none!important}
  .float{transform:none!important}
}

/* ---------- the mini-player: on every page, outside <main>, so sound carries on across page swaps (shared/nav.js) ---------- */
.rs-mini{position:fixed;right:16px;bottom:16px;z-index:70;display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--hair);border-radius:999px;padding:6px 6px 6px 8px;box-shadow:0 24px 50px -24px rgba(5,52,38,.5);max-width:min(420px,calc(100vw - 32px));transform:translate3d(0,140%,0);opacity:0;transition:transform .6s var(--ease),opacity .4s}
.rs-mini.show{transform:none;opacity:1}
.rs-mini-viz{width:44px;height:44px;border-radius:50%;background:var(--e100);flex:none}
.rs-mini-meta{display:grid;min-width:0;line-height:1.25}
.rs-mini-meta b{font-family:var(--serif);font-size:18px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs-mini-meta span{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rs-mini-btn{width:44px;height:44px;border-radius:50%;border:0;background:var(--e900);color:#fff;display:grid;place-items:center;cursor:pointer;flex:none}
.rs-mini-btn:hover{background:var(--e700)}
.rs-mini-btn svg{width:18px;height:18px}
.rs-mini-btn .i-pause{display:none}
.rs-mini-btn[aria-pressed=true] .i-play{display:none}
.rs-mini-btn[aria-pressed=true] .i-pause{display:block}
@media (max-width:560px){.rs-mini{left:12px;right:12px;bottom:12px;max-width:none}.rs-mini-meta span{white-space:normal}}

/* mini-player: a compact bar docked to the bottom edge on phones, clear of the home indicator */
@media (max-width:560px){
  .rs-mini{left:0;right:0;bottom:0;max-width:none;border-radius:20px 20px 0 0;border-width:1px 0 0;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px)) 12px;gap:12px;box-shadow:0 -14px 34px -24px rgba(5,52,38,.5)}
  .rs-mini-viz{width:40px;height:40px}
  .rs-mini-meta b{font-size:17px}
  .rs-mini-meta span{white-space:nowrap;font-size:10.5px}
  .rs-mini-btn{margin-left:auto;width:46px;height:46px}
  body.mini-on{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  body.mini-on .site-foot{margin-bottom:0}
}
.rs-mini[data-state="resume"] .rs-mini-btn{background:var(--e700)}
