/* Eagle Genomics feature map */
.fm{
  --fm-ink:#1F1D33; --fm-g:#E2EED5; --fm-y:#FBE8AE; --fm-p:#E1DDEF; --fm-b:#A6D2E8;
  margin:0; background:var(--surface); color:var(--ink);
  border:1.5px solid var(--rule); border-radius:0 28px 0 28px;
  box-shadow:0 12px 28px -20px rgba(58,18,6,.28);
  padding:clamp(18px,2.6vw,36px);
}
html[data-pb="dark"] .fm{
  --fm-ink:#F3EEE8; --fm-g:#36462A; --fm-y:#55461A; --fm-p:#3F375A; --fm-b:#1B4A61;
}
.fm-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fm-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:clamp(14px,1.6vw,22px)}
.fm-eyebrow{margin:0;font-size:13px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-text)}
.fm-ctrl{flex:none;width:40px;height:40px;border-radius:50%;border:0;display:none;align-items:center;justify-content:center;
  background:rgba(20,14,15,.62);color:#fff;cursor:pointer;transition:background var(--dur-quick) var(--ease),transform var(--dur-quick) var(--ease)}
html.js .fm-ctrl{display:inline-flex}
.fm-ctrl:hover{background:rgba(20,14,15,.8)}
.fm-ctrl:active{transform:scale(.92)}
.fm-ctrl:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
html[data-pb="dark"] .fm-ctrl{background:rgba(246,237,228,.16)}
html[data-pb="dark"] .fm-ctrl:hover{background:rgba(246,237,228,.28)}
.fm-ctrl svg{width:16px;height:16px;fill:currentColor}
.fm-ctrl .fm-i-play,.fm-ctrl .fm-i-replay{display:none}
.fm[data-state="paused"] .fm-i-pause,.fm[data-state="ended"] .fm-i-pause{display:none}
.fm[data-state="paused"] .fm-i-play{display:block}
.fm[data-state="ended"] .fm-i-replay{display:block}

/* tabs */
.fm-tabs{display:none}
html.js .fm-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(8px,1vw,14px);margin-bottom:clamp(18px,2.2vw,30px)}
.fm-tab{position:relative;overflow:hidden;display:grid;gap:4px;align-content:start;text-align:left;font:inherit;color:var(--ink);
  background:transparent;border:1px solid var(--rule);border-radius:14px;padding:14px 16px 16px;cursor:pointer;
  transition:border-color var(--dur-short) var(--ease),background-color var(--dur-short) var(--ease)}
.fm-tab:hover{border-color:var(--rule-strong)}
.fm-tab[aria-selected="true"]{border-color:var(--ink);background:color-mix(in srgb,var(--ink) 4%,transparent)}
.fm-tab:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.fm-tab-num{font-family:'Fraunces',Georgia,serif;font-size:15px;color:var(--accent-text)}
.fm-tab-name{font-size:clamp(15px,1.15vw,17px);font-weight:500;line-height:1.25}
.fm-tab-meta{font-size:13px;color:var(--ink-3)}
.fm-progress{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:0 50%}
.fm[data-state="playing"] .fm-tab[aria-selected="true"] .fm-progress{animation:fm-progress var(--fm-dwell,9s) linear forwards}
.fm[data-state="paused"] .fm-tab[aria-selected="true"] .fm-progress{animation:fm-progress var(--fm-dwell,9s) linear forwards;animation-play-state:paused}
@keyframes fm-progress{to{transform:scaleX(1)}}

/* panels */
.fm-stage{display:grid;grid-template-columns:minmax(0,1fr)}
.fm-panel{min-width:0}
html.js .fm-panel{grid-area:1/1;transition:opacity var(--dur-short) var(--ease),visibility 0s linear 0s}
html.js .fm-panel[data-inactive]{opacity:0;visibility:hidden;transition:opacity var(--dur-short) var(--ease),visibility 0s linear .35s}
.fm-panel + .fm-panel{margin-top:36px}
html.js .fm-panel + .fm-panel{margin-top:0}
.fm-panel-title{font-family:'Fraunces',Georgia,serif;font-weight:400;font-size:clamp(20px,1.8vw,26px);margin:0 0 16px;color:var(--leaf)}
html.js .fm-panel-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.fm-cols{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,300px));gap:clamp(10px,1.2vw,18px);align-items:start}
.fm-journey{margin:0 0 10px;min-height:2.6em;display:flex;align-items:flex-end;padding-bottom:8px;border-bottom:1px solid var(--rule-strong);
  font-family:'Work Sans',system-ui,sans-serif;font-size:14px;font-weight:500;line-height:1.3;color:var(--ink)}
.fm-list{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.fm-card{position:relative;display:flex;align-items:center;min-height:42px;padding:8px 12px;border-radius:8px;
  font-size:14.5px;line-height:1.32;color:var(--fm-ink);background:var(--fm-p)}
.fm-g{background:var(--fm-g)} .fm-y{background:var(--fm-y)} .fm-p{background:var(--fm-p)} .fm-b{background:var(--fm-b)}
i.fm-x,.fm-card.fm-x{background:transparent;box-shadow:inset 0 0 0 1px var(--rule-strong)}
.fm-card.fm-x{color:var(--ink-3)}
.fm-card s{text-decoration-thickness:1px}

/* entrance */
.fm-panel.is-entering .fm-card,.fm-panel.is-entering .fm-journey{animation:fm-in .55s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0) * 40ms)}
.fm-panel.is-entering .fm-journey{animation-delay:0s}
@keyframes fm-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* key */
.fm-key{display:flex;flex-wrap:wrap;gap:8px 20px;margin-top:clamp(18px,2vw,28px);padding-top:16px;border-top:1px solid var(--rule);font-size:13.5px;color:var(--ink-2)}
.fm-key-item{display:inline-flex;align-items:center;gap:8px}
.fm-key i{width:18px;height:12px;border-radius:3px;display:inline-block}

@media (max-width:820px){
  html.js .fm-tabs{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-left:calc(-1 * clamp(18px,2.6vw,36px));margin-right:calc(-1 * clamp(18px,2.6vw,36px));padding:0 clamp(18px,2.6vw,36px) 2px;scroll-padding:0 clamp(18px,2.6vw,36px);scrollbar-width:none}
  .fm-tab{flex:0 0 min(230px,64%);scroll-snap-align:start}
  .fm-cols{display:grid;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:min(82%,300px);overflow-x:auto;scroll-snap-type:x mandatory;
    margin:0 calc(-1 * clamp(18px,2.6vw,36px));padding:0 clamp(18px,2.6vw,36px) 6px;scroll-padding:0 clamp(18px,2.6vw,36px)}
  .fm-col{scroll-snap-align:start}
}
@media (prefers-reduced-motion:reduce){
  .fm-panel.is-entering .fm-card,.fm-panel.is-entering .fm-journey{animation:none}
  html.js .fm-panel,html.js .fm-panel[data-inactive]{transition:none}
}
