/* =====================================================================
   Manage following modal (Figma 1479:42772 / 1479:43128 / 1479:43289; mobile sheet 1479:57550).
   Panel 680, padding 32, gap 20, radius 16; only the body scrolls (64px fade at the bottom while more is below).
   Groups: Sports, Leagues, Teams, Editors, Series (+ Athletes "Coming soon"). Follow Items Size Compact.
   ===================================================================== */
.mf{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;padding:var(--space-24);background:rgba(20,18,15,.5);opacity:0;transition:opacity .25s}
.mf[hidden]{display:none}
.mf.is-open{opacity:1}
.mf [hidden]{display:none!important}
.mf__panel{position:relative;box-sizing:border-box;display:flex;flex-direction:column;gap:var(--space-20);width:min(680px,100%);max-height:calc(100vh - 48px);padding:var(--space-32);background:var(--surface-default);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-large-hover);transform:translateY(16px) scale(.97);transition:transform .35s var(--ease-out)}
.mf.is-open .mf__panel{transform:none}
.mf__grabber{display:none}
.mf__head{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-16)}
.mf__titles{display:flex;flex-direction:column;gap:var(--space-4);min-width:0}
.mf__title{margin:0;font:700 30px/36px var(--font-display);text-transform:uppercase;color:var(--text-primary)}
.mf__sub{margin:0;font:var(--text-sm);color:var(--text-secondary)}
.mf__x{flex:none;margin:calc(-1 * var(--space-4)) calc(-1 * var(--space-8)) 0 0}
.mf__x .btn__icon{width:24px;height:24px}
.mf__search .input__control:focus-within{border-color:var(--accent-default)}

/* Scroll body + bottom fade */
.mf__body{position:relative;flex:1 1 420px;min-height:0;height:420px;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border-strong) transparent;-webkit-mask-image:linear-gradient(#000 calc(100% - 64px),transparent);mask-image:linear-gradient(#000 calc(100% - 64px),transparent)}
.mf__body.is-end{-webkit-mask-image:none;mask-image:none}
.mf-group{display:flex;flex-direction:column;gap:var(--space-16);padding:var(--space-24) 0 var(--space-8);border-top:1px solid var(--border-default)}
.mf-group.is-first{padding-top:var(--space-8);border-top:0}
.mf-group__head{display:flex;align-items:center;gap:var(--space-12)}
.mf-group__title{margin:0;font:var(--text-xl);text-transform:uppercase;color:var(--text-primary)}
.mf-group__n{margin:0;font:var(--text-sm);color:var(--text-secondary)}
.mf-group__n:empty{display:none}
.mf-group__list{display:flex;flex-wrap:wrap;gap:var(--space-8);padding:var(--space-2) var(--space-2) var(--space-6)}
.mf-item{background:var(--surface-elevated);border:1px solid var(--neutral-200)}
.mf-soon{display:inline-flex;align-items:center;height:24px;padding:0 var(--space-8);border-radius:var(--radius-full);background:var(--surface-selected);font:var(--text-xs);color:var(--text-secondary)}
.mf-group--soon{gap:var(--space-8)}
.mf-none{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);height:100%;min-height:160px;text-align:center}
.mf-none__title{margin:0;font:var(--text-xl);text-transform:uppercase;color:var(--text-primary)}
.mf__foot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-12);padding-top:var(--space-16);border-top:1px solid var(--border-default)}
.mf__foot .btn{height:44px}
.mf__foot a.btn{text-decoration:none}

/* Mobile bottom sheet (<= 640px): full width, top corners 16, grabber, footer buttons share the width */
@media (max-width:640px){
  .mf{align-items:flex-end;padding:0}
  .mf__panel{width:100%;max-height:90vh;padding:var(--space-24) var(--space-16) calc(var(--space-16) + env(safe-area-inset-bottom));border-radius:16px 16px 0 0;border-bottom:0;transform:translateY(24px)}
  .mf__grabber{display:block;position:absolute;top:8px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:var(--radius-full);background:var(--border-strong)}
  .mf__title{font-size:24px;line-height:32px}
  .mf__body{height:auto;flex:1 1 auto}
  .mf__foot .btn{flex:1}
}
@media (prefers-reduced-motion:reduce){.mf,.mf__panel{transition:none}.mf__panel,.mf.is-open .mf__panel{transform:none}}

/* Components page specimens: the panel without the overlay, and the mobile sheet at 390 */
.mf__panel--static{transform:none;max-height:none}
.mf__panel--static .mf__body{flex:none;height:auto;max-height:420px}
.mf__panel--static .mf-none{min-height:200px}
.mf__panel--sheet{width:390px;max-width:100%;padding:var(--space-24) var(--space-16) var(--space-16);border-radius:16px 16px 0 0}
.mf__panel--sheet .mf__grabber{display:block;position:absolute;top:8px;left:50%;width:36px;height:4px;margin-left:-18px;border-radius:var(--radius-full);background:var(--border-strong)}
.mf__panel--sheet .mf__title{font-size:24px;line-height:32px}
.mf__panel--sheet .mf__body{max-height:300px}
.mf__panel--sheet .mf__foot .btn{flex:1}