/* mbm-homepage-audience-routing-2026-08-09
   Shared chooser and audience-homepage visual system. The official Made by Matt
   mark remains the primary identity; audience colours are controlled accents. */
:root{
  --mf-canvas:#F6F1E4;
  --mf-canvas-alt:#FBF6EA;
  --mf-surface:#FFFDF6;
  --mf-surface-strong:#FFFFFF;
  --mf-ink:#1B2140;
  --mf-muted:#4A5170;
  --mf-line:#E3DAC5;
  --mf-navy:#161D3D;
  --mf-deep:#0F1530;
  --mf-cream:#E8E2D4;
  --mf-mint:#B9E6CD;
  --mf-mint-deep:#2F6B4D;
  --mf-amber:#F2A24A;
  --mf-amber-deep:#C97F2E;
  --mf-shadow-sm:0 7px 22px rgba(22,29,61,.08);
  --mf-shadow-md:0 18px 48px rgba(22,29,61,.13);
  --mf-shadow-lg:0 30px 80px rgba(4,8,28,.28);
  --mf-radius-sm:14px;
  --mf-radius-md:20px;
  --mf-radius-lg:30px;
  --face-accent:#288240;
  --face-accent-visual:var(--face-accent);
  --face-soft:#DDEFE5;
}

body.mbm-face-page{
  margin:0;
  min-width:0;
  overflow-x:hidden;
  background:var(--mf-canvas);
  color:var(--mf-ink);
}
body.mbm-face-page main{display:block;min-width:0}
body.mbm-face-page a{text-underline-offset:3px}
body.mbm-face-page img{max-width:100%}
.mf-wrap{width:min(100%,1160px);margin-inline:auto;padding-inline:clamp(.85rem,3vw,1.35rem)}

/* Deep, textured Made by Matt hero. The data-SVG is decorative and local. */
.mf-hero{
  --hero-top:#263261;
  --hero-bottom:#10162F;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:var(--mf-cream);
  background:
    radial-gradient(circle at 16% 4%,rgba(185,230,205,.14),transparent 24rem),
    radial-gradient(circle at 88% 24%,color-mix(in srgb,var(--face-accent) 24%,transparent),transparent 28rem),
    linear-gradient(152deg,var(--hero-top),var(--hero-bottom) 68%);
  border-bottom:1px solid rgba(185,230,205,.18);
}
.mf-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  opacity:.22;
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='260' viewBox='0 0 420 260'%3E%3Cg fill='none' stroke='%23B9E6CD' stroke-opacity='.36' stroke-width='1'%3E%3Ccircle cx='64' cy='62' r='27'/%3E%3Ccircle cx='64' cy='62' r='42'/%3E%3Cpath d='M106 62h73l22 22h70M29 164h92l26-26h95l27 27h122M284 37h52l20 20h36M192 214h73l20-20h78' stroke-dasharray='3 8'/%3E%3Cpath d='M332 93l8 20 20 8-20 8-8 20-8-20-20-8 20-8 8-20Z'/%3E%3Crect x='142' y='31' width='66' height='43' rx='9'/%3E%3Crect x='260' y='172' width='88' height='48' rx='11'/%3E%3C/g%3E%3Cg fill='%23F2A24A' fill-opacity='.45'%3E%3Ccircle cx='121' cy='164' r='2.4'/%3E%3Ccircle cx='271' cy='84' r='2.4'/%3E%3Ccircle cx='363' cy='214' r='2.4'/%3E%3C/g%3E%3C/svg%3E");
  background-size:420px 260px;
}
.mf-hero::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:min(72vw,780px);
  aspect-ratio:1;
  left:-18vw;
  bottom:-64%;
  border-radius:50%;
  border:1px solid rgba(185,230,205,.13);
  box-shadow:0 0 0 42px rgba(185,230,205,.025),0 0 0 96px rgba(242,162,74,.018);
  pointer-events:none;
}
.mf-hero-texture{
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:
    radial-gradient(circle at 50% 55%,transparent 0 28%,rgba(255,255,255,.028) 28.2% 28.4%,transparent 28.6%),
    linear-gradient(90deg,transparent 0 49.9%,rgba(185,230,205,.035) 50%,transparent 50.1%);
}
.mf-hero-grid{
  min-height:clamp(520px,72vh,720px);
  padding-block:clamp(3.2rem,8vw,6.1rem);
  display:grid;
  grid-template-columns:minmax(230px,.82fr) minmax(0,1.18fr);
  align-items:center;
  gap:clamp(2rem,7vw,6rem);
}
.mf-mark-stage{
  position:relative;
  min-height:clamp(260px,35vw,430px);
  display:grid;
  place-items:center;
}
.mf-hero-mark{
  position:relative;
  z-index:2;
  display:block;
  width:clamp(190px,28vw,330px);
  height:auto;
  border-radius:clamp(30px,5vw,58px);
  filter:drop-shadow(0 28px 52px rgba(0,0,0,.42));
}
.mf-halo{
  position:absolute;
  z-index:1;
  border:1px solid rgba(185,230,205,.28);
  border-radius:50%;
  pointer-events:none;
}
.mf-halo-one{width:clamp(245px,36vw,420px);aspect-ratio:1;box-shadow:0 0 70px rgba(185,230,205,.09),inset 0 0 50px rgba(185,230,205,.045)}
.mf-halo-two{width:clamp(300px,44vw,520px);aspect-ratio:1;border-style:dashed;border-color:rgba(242,162,74,.17)}
.mf-audience-badge{
  --badge-accent:var(--face-accent);
  position:absolute;
  z-index:3;
  inset:auto clamp(.2rem,4vw,2.5rem) clamp(.2rem,3vw,1.7rem) auto;
  display:inline-flex;
  align-items:center;
  gap:.55rem;
  max-width:min(260px,76%);
  min-height:48px;
  padding:.52rem .8rem;
  border:1px solid color-mix(in srgb,var(--badge-accent) 60%,#fff);
  border-radius:999px;
  background:rgba(15,21,48,.9);
  color:#fff;
  box-shadow:0 12px 32px rgba(0,0,0,.3);
  font-size:.76rem;
  font-weight:850;
  line-height:1.2;
  backdrop-filter:blur(12px);
}
.mf-audience-badge::before{content:"";position:absolute;inset:4px;border:1px solid rgba(255,255,255,.08);border-radius:inherit;pointer-events:none}
.mf-badge-icon{width:22px;height:22px;flex:0 0 22px;fill:none;stroke:var(--badge-accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.mf-platform-badge{--badge-accent:var(--mf-amber)}
.mf-hero-copy{position:relative;z-index:2;min-width:0}
.mf-kicker{
  margin:0 0 .8rem;
  color:var(--mf-amber);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.22em;
  text-transform:uppercase;
}
.mf-hero h1{
  max-width:19ch;
  margin:0;
  color:#F6F1E4;
  font-size:clamp(2.35rem,5.8vw,5.4rem);
  line-height:.98;
  letter-spacing:-.045em;
  text-wrap:balance;
}
.mf-lead{
  max-width:690px;
  margin:1.25rem 0 0;
  color:#D4D8E5;
  font-size:clamp(1rem,2.1vw,1.22rem);
  line-height:1.65;
}
.mf-actions{display:flex;flex-wrap:wrap;gap:.72rem;margin-top:1.55rem}
.mf-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:.72rem 1.15rem;
  border:1px solid transparent;
  border-radius:999px;
  font-size:.84rem;
  font-weight:875;
  line-height:1.15;
  text-align:center;
  text-decoration:none;
  transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease,border-color .18s ease;
}
.mf-btn.primary{background:var(--mf-amber);border-color:var(--mf-amber);color:var(--mf-navy);box-shadow:0 3px 0 var(--mf-amber-deep),0 12px 24px rgba(0,0,0,.17)}
.mf-btn.secondary{background:rgba(15,21,48,.24);border-color:rgba(185,230,205,.62);color:var(--mf-mint)}
.mf-btn.quiet{background:var(--mf-surface);border-color:var(--mf-line);color:var(--mf-navy)}
.mf-btn:hover{transform:translateY(-2px)}
.mf-btn:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}
.mf-home-links{display:flex;flex-wrap:wrap;gap:.45rem 1rem;margin-top:1.1rem}
.mf-home-links a{display:inline-flex;align-items:center;min-height:44px;color:#D4D8E5;font-size:.78rem;font-weight:750}
.mf-home-links a:hover{color:#fff}

/* Shared section hierarchy and real visual cards. */
.mf-section{position:relative;padding-block:clamp(3.2rem,7vw,6rem);background:var(--mf-canvas)}
.mf-section-tint{background:var(--mf-canvas-alt);border-block:1px solid var(--mf-line)}
.mf-section-head{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.62fr);gap:.4rem clamp(2rem,7vw,6rem);align-items:end;margin-bottom:1.4rem}
.mf-section-head>p{grid-column:1/-1;margin:0;color:#8A5620;font-size:.7rem;font-weight:900;letter-spacing:.2em;text-transform:uppercase}
.mf-section-head h2{margin:0;color:var(--mf-navy);font-size:clamp(1.75rem,4vw,3.25rem);line-height:1.02;letter-spacing:-.035em;text-wrap:balance}
.mf-section-head>span{color:var(--mf-muted);font-size:.95rem;line-height:1.65}
.mf-feature-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1rem}
.mf-feature{grid-column:span 4;min-width:0;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--mf-line);border-radius:var(--mf-radius-md);background:var(--mf-surface);box-shadow:var(--mf-shadow-sm);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.mf-feature-count-2 .mf-feature{grid-column:span 6}
.mf-feature-count-4 .mf-feature{grid-column:span 6}
.mf-media{position:relative;display:block;aspect-ratio:16/9;overflow:hidden;background:linear-gradient(135deg,var(--mf-navy),#2C376B)}
.mf-media::after{content:"";position:absolute;inset:0;border-bottom:1px solid rgba(22,29,61,.12);background:linear-gradient(180deg,transparent 58%,rgba(15,21,48,.16));pointer-events:none}
.mf-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.mf-feature-copy{position:relative;display:flex;flex:1;flex-direction:column;align-items:flex-start;padding:1.08rem 1.08rem 1.16rem}
.mf-feature-copy::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--face-accent-visual)}
.mf-pill{display:inline-flex;align-items:center;min-height:26px;padding:.25rem .55rem;border:1px solid color-mix(in srgb,var(--face-accent) 28%,var(--mf-line));border-radius:999px;background:color-mix(in srgb,var(--face-soft) 68%,var(--mf-surface));color:var(--mf-navy);font-size:.61rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.mf-feature h3{margin:.8rem 0 .45rem;color:var(--mf-navy);font-size:clamp(1.18rem,2.2vw,1.55rem);line-height:1.08;letter-spacing:-.02em}
.mf-feature p{margin:0;color:var(--mf-muted);font-size:.87rem;line-height:1.62}
.mf-text-link{display:inline-flex;align-items:center;gap:.42rem;min-height:44px;margin-top:auto;padding-top:.9rem;color:var(--mf-navy);font-size:.79rem;font-weight:900}
.mf-text-link span{color:var(--face-accent);font-size:1.05rem}
.mf-feature:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--face-accent) 42%,var(--mf-line));box-shadow:var(--mf-shadow-md)}
.mf-feature:hover .mf-media img{transform:scale(1.025)}
.mf-feature:focus-within{outline:3px solid var(--mf-amber);outline-offset:4px}

/* Compact route cards. */
.mf-utility-section{padding-top:clamp(2.8rem,6vw,5rem)}
.mf-utility-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.78rem}
.mf-utility{
  position:relative;
  display:grid;
  grid-template-columns:48px minmax(0,1fr) auto;
  align-items:center;
  gap:.8rem;
  min-height:108px;
  padding:.95rem 1rem;
  border:1px solid var(--mf-line);
  border-radius:var(--mf-radius-sm);
  background:var(--mf-surface);
  color:var(--mf-ink);
  text-decoration:none;
  box-shadow:0 5px 16px rgba(22,29,61,.055);
  transition:transform .17s ease,border-color .17s ease,box-shadow .17s ease;
}
.mf-utility::before{content:"";position:absolute;inset:0 auto 0 0;width:4px;border-radius:inherit;background:var(--face-accent-visual)}
.mf-utility-icon{width:48px;height:48px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--face-accent) 34%,var(--mf-line));border-radius:15px;background:color-mix(in srgb,var(--face-soft) 66%,var(--mf-surface));color:var(--face-accent)}
.mf-line-icon{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round}
.mf-utility strong{display:block;color:var(--mf-navy);font-size:.95rem;line-height:1.25}
.mf-utility small{display:block;margin-top:.26rem;color:var(--mf-muted);font-size:.77rem;line-height:1.45}
.mf-arrow{color:var(--face-accent);font-size:1.25rem;font-weight:900}
.mf-utility:hover{transform:translateY(-2px);border-color:color-mix(in srgb,var(--face-accent) 45%,var(--mf-line));box-shadow:var(--mf-shadow-sm)}
.mf-utility:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}

/* Fact / safeguarding / claims panels. */
.mf-note-section{padding-top:1rem;background:var(--mf-canvas)}
.mf-note{position:relative;display:grid;grid-template-columns:72px minmax(0,1fr);gap:1rem;padding:clamp(1.1rem,3vw,1.65rem);overflow:hidden;border:1px solid color-mix(in srgb,var(--face-accent) 36%,var(--mf-line));border-radius:var(--mf-radius-md);background:linear-gradient(135deg,color-mix(in srgb,var(--face-soft) 64%,var(--mf-surface)),var(--mf-surface));box-shadow:var(--mf-shadow-sm)}
.mf-note::after{content:"";position:absolute;width:210px;aspect-ratio:1;right:-105px;top:-115px;border:1px solid color-mix(in srgb,var(--face-accent) 23%,transparent);border-radius:50%;box-shadow:0 0 0 28px color-mix(in srgb,var(--face-accent) 4%,transparent)}
.mf-note-mark{position:relative;z-index:1;width:64px;height:64px;display:grid;place-items:center;border-radius:20px;background:var(--face-accent);color:#fff;box-shadow:0 12px 24px color-mix(in srgb,var(--face-accent) 24%,transparent)}
.mf-note-kicker{margin:0;color:#7A4A1B;font-size:.65rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.mf-note h2{position:relative;z-index:1;margin:.28rem 0 .48rem;color:var(--mf-navy);font-size:clamp(1.35rem,3vw,2rem);line-height:1.1}
.mf-note p:not(.mf-note-kicker){position:relative;z-index:1;max-width:880px;margin:0;color:var(--mf-muted);font-size:.9rem;line-height:1.67}
.mf-note-links{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.9rem}
.mf-note-links a{display:inline-flex;align-items:center;min-height:42px;padding:.45rem .72rem;border:1px solid color-mix(in srgb,var(--face-accent) 30%,var(--mf-line));border-radius:999px;background:var(--mf-surface);color:var(--mf-navy);font-size:.75rem;font-weight:850;text-decoration:none}
.mf-note-links a:hover{border-color:var(--face-accent)}

/* Homepage switcher. */
.mf-switch{padding-block:clamp(3rem,6vw,5.2rem);border-top:1px solid rgba(185,230,205,.15);background:linear-gradient(145deg,#10162F,#1A2348);color:var(--mf-cream)}
.mf-switch-head p{margin:0;color:var(--mf-amber);font-size:.68rem;font-weight:900;letter-spacing:.18em;text-transform:uppercase}
.mf-switch-head h2{margin:.3rem 0 1rem;color:#F6F1E4;font-size:clamp(1.55rem,4vw,2.6rem);line-height:1.05}
.mf-switch-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem}
.mf-switch-grid a{display:flex;align-items:center;justify-content:center;min-height:68px;padding:.62rem;border:1px solid rgba(185,230,205,.2);border-radius:13px;background:rgba(255,255,255,.035);color:#DDE1EC;font-size:.73rem;font-weight:800;line-height:1.3;text-align:center;text-decoration:none}
.mf-switch-grid a:hover{border-color:var(--mf-mint);background:rgba(185,230,205,.08);color:#fff}
.mf-switch-grid a[aria-current="page"]{border-color:var(--face-accent);background:var(--face-accent);color:#fff;box-shadow:0 9px 24px color-mix(in srgb,var(--face-accent) 28%,transparent)}
.mf-switch-grid a:focus-visible{outline:3px solid var(--mf-amber);outline-offset:3px}
.mf-switch-actions{display:flex;flex-wrap:wrap;gap:.62rem;margin-top:1rem}

/* Root chooser. */
.mbm-face-chooser{--face-accent:#288240;--face-accent-visual:var(--face-accent);--face-soft:#DDEFE5}
.mf-chooser-hero .mf-hero-grid{min-height:clamp(600px,78vh,780px)}
.mf-chooser-hero .mf-hero h1{max-width:15ch}
.mf-main-option{padding:1.25rem 0;background:var(--mf-canvas-alt);border-bottom:1px solid var(--mf-line)}
.mf-main-card{
  position:relative;
  display:grid;
  grid-template-columns:76px minmax(0,1fr) auto;
  align-items:center;
  gap:1rem;
  min-height:118px;
  padding:1rem 1.2rem;
  overflow:hidden;
  border:1px solid rgba(22,29,61,.2);
  border-radius:var(--mf-radius-md);
  background:linear-gradient(135deg,#FFFDF6 0%,#F3EBD9 100%);
  color:var(--mf-navy);
  text-decoration:none;
  box-shadow:var(--mf-shadow-sm);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
.mf-main-card::before{content:"";position:absolute;inset:0 auto 0 0;width:7px;background:linear-gradient(var(--mf-amber),var(--mf-mint-deep))}
.mf-main-card-mark{width:70px;height:70px;display:grid;place-items:center;border-radius:20px;background:var(--mf-navy);box-shadow:0 12px 26px rgba(22,29,61,.2)}
.mf-main-card-mark img{width:56px;height:56px}
.mf-main-card small{display:block;color:#8A5620;font-size:.62rem;font-style:normal;font-weight:900;letter-spacing:.14em;text-transform:uppercase}
.mf-main-card strong{display:block;margin:.2rem 0;color:var(--mf-navy);font-size:clamp(1.15rem,3vw,1.7rem);line-height:1.1}
.mf-main-card em{display:block;color:var(--mf-muted);font-size:.84rem;font-style:normal;line-height:1.5}
.mf-main-card:hover{transform:translateY(-2px);border-color:var(--mf-amber-deep);box-shadow:var(--mf-shadow-md)}
.mf-main-card:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}
.mf-choices{padding-block:clamp(2.8rem,6vw,5.2rem);background:var(--mf-canvas)}
.mf-choice-group+.mf-choice-group{margin-top:clamp(2.8rem,6vw,4.7rem)}
.mf-group-head{margin-bottom:.85rem}
.mf-group-head p{margin:0;color:#8A5620;font-size:.66rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.mf-group-head h2{margin:.22rem 0 0;color:var(--mf-navy);font-size:clamp(1.55rem,4vw,2.45rem);line-height:1.05}
.mf-choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
/* The platform option is one card, not a pair, so it spans the row rather than
   sitting in the left column with a hole beside it. Same spacing as the gap
   between two audience groups, because that is the join it is standing in for. */
.mf-choice-platform{margin-top:clamp(2.8rem,6vw,4.7rem);grid-template-columns:1fr}
.mf-choice{
  --choice-accent:#2F6B4D;
  --choice-soft:#DDEFE5;
  position:relative;
  display:grid;
  grid-template-columns:58px minmax(0,1fr) auto;
  align-items:center;
  gap:.85rem;
  min-height:148px;
  padding:1rem 1.05rem;
  overflow:hidden;
  border:1px solid var(--mf-line);
  border-radius:var(--mf-radius-md);
  background:var(--mf-surface);
  color:var(--mf-ink);
  text-decoration:none;
  box-shadow:var(--mf-shadow-sm);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.mf-choice::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--choice-accent)}
.mf-choice::after{content:"";position:absolute;width:120px;aspect-ratio:1;right:-65px;bottom:-75px;border:1px solid color-mix(in srgb,var(--choice-accent) 16%,transparent);border-radius:50%;pointer-events:none}
.mf-choice-icon{width:56px;height:56px;display:grid;place-items:center;border:1px solid color-mix(in srgb,var(--choice-accent) 32%,var(--mf-line));border-radius:17px;background:linear-gradient(145deg,var(--choice-soft),var(--mf-surface));color:var(--choice-accent)}
.mf-choice-copy{min-width:0}
.mf-choice strong{display:block;color:var(--mf-navy);font-size:1.04rem;line-height:1.25}
.mf-choice small{display:block;margin-top:.34rem;color:var(--mf-muted);font-size:.8rem;line-height:1.52}
.mf-choice:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--choice-accent) 48%,var(--mf-line));box-shadow:var(--mf-shadow-md)}
.mf-choice:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}
.mf-choice.is-last{border-color:var(--choice-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--choice-accent) 17%,transparent),var(--mf-shadow-md)}
.mf-last{display:none;position:absolute;z-index:2;inset:.55rem .65rem auto auto;max-width:60%;padding:.24rem .48rem;border-radius:999px;background:var(--choice-accent);color:#fff;font-size:.54rem;font-weight:900;letter-spacing:.07em;line-height:1.15;text-align:center;text-transform:uppercase}
.mf-choice.is-last .mf-last{display:inline-flex}
.mf-continue{display:none;align-items:center;justify-content:space-between;gap:1rem;margin-top:1rem;padding:1rem;border:1px solid var(--mf-line);border-radius:var(--mf-radius-md);background:var(--mf-surface);box-shadow:var(--mf-shadow-sm)}
.mf-continue.is-visible{display:flex}
.mf-continue b{display:block;color:var(--mf-navy);font-size:.86rem}
.mf-continue small{display:block;max-width:760px;margin-top:.15rem;color:var(--mf-muted);font-size:.72rem;line-height:1.45}
.mf-continue-actions{display:flex;flex:0 0 auto;align-items:center;gap:.5rem;flex-wrap:wrap}
.mf-continue-actions a,.mf-clear{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.5rem .72rem;border:1px solid var(--mf-line);border-radius:999px;background:var(--mf-canvas-alt);color:var(--mf-navy);font:inherit;font-size:.72rem;font-weight:850;cursor:pointer;text-decoration:none}
.mf-continue-actions a{background:var(--mf-amber);border-color:var(--mf-amber)}
.mf-clear:hover{border-color:var(--mf-amber-deep)}
.mf-clear:focus-visible{outline:3px solid var(--mf-amber);outline-offset:3px}

/* Shared footer; platform JS may append the verified adult mailing route. */
.mf-footer .bar{align-items:center;flex-wrap:wrap}
.mf-footer .brand{border-radius:12px}
.mf-footer .muted{color:#AEB6CE;line-height:1.65;text-align:right}
.mf-footer .muted a{color:#DCEFE5;font-weight:750}

/* Adult features are never merely visually deprioritised on the pupil page:
   the platform JavaScript also skips injecting them. This remains a CSS safety net. */
body[data-mbm-adult-features="off"] [data-mbm-account-nav],
body[data-mbm-adult-features="off"] [data-mbm-register-nav],
body[data-mbm-adult-features="off"] [data-mbm-mailing-nav],
body[data-mbm-adult-features="off"] [data-mbm-mailing-cta],
body[data-mbm-adult-features="off"] [data-mbm-adult-link]{display:none!important}

/* Reading themes: one brand, theme-aware surfaces. */
body[data-theme="pink"].mbm-face-page{--mf-canvas:#F9E8EC;--mf-canvas-alt:#FDF2F4;--mf-surface:#FFF9FA;--mf-surface-strong:#fff;--mf-line:#E7CAD4;--mf-ink:#4E1932;--mf-muted:#6F4560}
body[data-theme="blue"].mbm-face-page{--mf-canvas:#E7EEF7;--mf-canvas-alt:#F1F6FC;--mf-surface:#F8FBFF;--mf-surface-strong:#fff;--mf-line:#CCD9E9;--mf-ink:#183653;--mf-muted:#496681}
body[data-theme="light"].mbm-face-page{--mf-canvas:#F7F7F4;--mf-canvas-alt:#FAFAF8;--mf-surface:#FFFFFF;--mf-surface-strong:#fff;--mf-line:#DFDFDA;--mf-ink:#252D47;--mf-muted:#586078}
body[data-theme="dark"].mbm-face-page{--mf-canvas:#121834;--mf-canvas-alt:#161D3D;--mf-surface:#1B234A;--mf-surface-strong:#202953;--mf-line:#303B63;--mf-ink:#E8E2D4;--mf-muted:#AFB7CF;--mf-shadow-sm:0 8px 24px rgba(0,0,0,.22);--mf-shadow-md:0 20px 50px rgba(0,0,0,.32)}
body[data-theme="pink"].mbm-face-page .mf-hero{--hero-top:#682346;--hero-bottom:#351328}
body[data-theme="blue"].mbm-face-page .mf-hero{--hero-top:#244F77;--hero-bottom:#102D4A}
body[data-theme="light"].mbm-face-page .mf-hero{--hero-top:#3C4668;--hero-bottom:#202740}
body[data-theme="dark"].mbm-face-page .mf-hero{--hero-top:#1B2450;--hero-bottom:#090D1E}
body[data-theme="dark"].mbm-face-page .mf-section-head h2,
body[data-theme="dark"].mbm-face-page .mf-feature h3,
body[data-theme="dark"].mbm-face-page .mf-utility strong,
body[data-theme="dark"].mbm-face-page .mf-note h2,
body[data-theme="dark"].mbm-face-page .mf-group-head h2,
body[data-theme="dark"].mbm-face-page .mf-choice strong,
body[data-theme="dark"].mbm-face-page .mf-main-card strong,
body[data-theme="dark"].mbm-face-page .mf-continue b{color:#F1ECDF}
body[data-theme="dark"].mbm-face-page .mf-main-option{background:#161D3D;border-color:#303B63}
body[data-theme="dark"].mbm-face-page .mf-main-card{background:linear-gradient(135deg,#202953,#171E40);border-color:#3B466F;color:#E8E2D4}
body[data-theme="dark"].mbm-face-page .mf-pill{color:#F1ECDF;background:color-mix(in srgb,var(--face-accent) 20%,#1B234A)}
body[data-theme="dark"].mbm-face-page .mf-text-link,
body[data-theme="dark"].mbm-face-page .mf-note-links a,
body[data-theme="dark"].mbm-face-page .mf-continue-actions a,
body[data-theme="dark"].mbm-face-page .mf-clear{color:#F1ECDF}
body[data-theme="dark"].mbm-face-page .mf-continue-actions a{color:#161D3D}
body[data-theme="dark"].mbm-face-page .mf-choice-icon,
body[data-theme="dark"].mbm-face-page .mf-utility-icon{background:#202953}
/* Under the dark theme the icon square becomes #202953 and the card #1B234A,
   but the glyph and the left bar kept painting in the raw accent - measured at
   2.0-2.9:1 for the seven audiences, all of them under the 3:1 bar for non-text
   UI. The platform option made it impossible to leave: its accent is the brand
   navy, which lands at 1.18:1 on that square. The glyph would not have been dim,
   it would have been gone.
   No accent can fix this from the data side - the same colour has to clear
   4.5:1 on the cream surface, which forces it dark - so the theme lifts it
   instead, keeping the hue and moving it toward the dark theme's own ink.
   Measured at 45%: worst 4.03:1 on the icon square and 4.37:1 on the card
   (both the platform option); the seven land between 5.5:1 and 6.4:1. */
body[data-theme="dark"].mbm-face-page .mf-choice{--choice-ink:color-mix(in srgb,var(--choice-accent) 45%,#E8E2D4)}
body[data-theme="dark"].mbm-face-page .mf-choice::before{background:var(--choice-ink)}
body[data-theme="dark"].mbm-face-page .mf-choice-icon{color:var(--choice-ink)}
body[data-theme="dark"].mbm-face-page .mf-note{background:linear-gradient(135deg,color-mix(in srgb,var(--face-accent) 17%,#1B234A),#1B234A)}

/* Legacy /start/ compatibility page. */
.mbm-legacy-start{background:var(--mf-deep)}
.mf-legacy-hero{min-height:100vh;display:grid;place-items:center;text-align:center}
.mf-legacy-hero .mf-wrap{padding-block:3rem}
.mf-legacy-hero .mf-hero-mark{width:min(220px,54vw);margin-inline:auto}
.mf-legacy-hero h1{margin:1.2rem auto 0;max-width:18ch;font-size:clamp(2rem,7vw,4rem)}
.mf-legacy-hero .mf-lead{margin-inline:auto}
.mf-legacy-hero p:last-child{display:flex;flex-wrap:wrap;justify-content:center;gap:.6rem}

@media (max-width:1024px){
  .mf-hero-grid{grid-template-columns:minmax(210px,.72fr) minmax(0,1.28fr);gap:2.4rem}
  .mf-feature{grid-column:span 6}
  .mf-feature-count-3 .mf-feature:last-child{grid-column:3/span 8}
  .mf-switch-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:780px){
  .mf-hero-grid{min-height:auto;grid-template-columns:1fr;gap:1.2rem;padding-block:2.8rem 3.6rem;text-align:center}
  .mf-mark-stage{min-height:250px;order:-1}
  .mf-hero-mark{width:clamp(178px,46vw,240px)}
  .mf-halo-one{width:clamp(225px,62vw,310px)}
  .mf-halo-two{width:clamp(270px,72vw,360px)}
  .mf-audience-badge{inset:auto 50% -.2rem auto;transform:translateX(50%);max-width:88%}
  .mf-hero-copy{display:flex;flex-direction:column;align-items:center}
  .mf-hero h1{max-width:18ch;font-size:clamp(2.25rem,10vw,3.7rem)}
  .mf-lead{font-size:.98rem}
  .mf-actions,.mf-home-links{justify-content:center}
  .mf-section-head{grid-template-columns:1fr;gap:.48rem}
  .mf-section-head>p{grid-column:auto}
  .mf-feature-grid{grid-template-columns:1fr}
  .mf-feature,.mf-feature-count-2 .mf-feature,.mf-feature-count-3 .mf-feature:last-child,.mf-feature-count-4 .mf-feature{grid-column:auto}
  .mf-utility-grid{grid-template-columns:1fr}
  .mf-switch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mf-choice-grid{grid-template-columns:1fr}
  .mf-continue{align-items:flex-start;flex-direction:column}
  .mf-continue-actions{width:100%}
  .mf-footer .muted{text-align:left}
}
@media (max-width:520px){
  .mf-wrap{padding-inline:.8rem}
  .mf-hero-grid{padding-top:2.2rem}
  .mf-mark-stage{min-height:225px}
  .mf-hero-mark{width:176px;border-radius:34px}
  .mf-halo-one{width:220px}.mf-halo-two{width:265px}
  .mf-audience-badge{min-height:44px;font-size:.7rem}
  .mf-hero h1{font-size:clamp(2rem,11vw,3rem)}
  .mf-actions{width:100%;display:grid;grid-template-columns:1fr}
  .mf-btn{width:100%}
  .mf-home-links{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:.35rem}
  .mf-home-links a{justify-content:center;border:1px solid rgba(185,230,205,.22);border-radius:999px;padding:.45rem}
  .mf-main-card{grid-template-columns:58px minmax(0,1fr);padding:.9rem}
  .mf-main-card-mark{width:56px;height:56px;border-radius:16px}.mf-main-card-mark img{width:45px;height:45px}
  .mf-main-card>.mf-arrow{display:none}
  .mf-choice{grid-template-columns:50px minmax(0,1fr);min-height:142px;padding:.9rem}
  .mf-choice-icon{width:48px;height:48px}
  .mf-choice>.mf-arrow{display:none}
  .mf-last{max-width:58%;font-size:.49rem}
  .mf-feature-copy{padding:1rem}
  .mf-utility{grid-template-columns:44px minmax(0,1fr);padding:.85rem}
  .mf-utility-icon{width:44px;height:44px}.mf-utility>.mf-arrow{display:none}
  .mf-note{grid-template-columns:1fr;padding:1rem}
  .mf-note-mark{width:52px;height:52px;border-radius:16px}
  .mf-switch-grid{grid-template-columns:1fr}
  .mf-switch-actions{display:grid;grid-template-columns:1fr}
}
@media (max-width:350px){
  .mf-wrap{padding-inline:.65rem}
  .mf-hero h1{font-size:1.95rem}
  .mf-home-links{grid-template-columns:1fr}
  .mf-choice{grid-template-columns:44px minmax(0,1fr);gap:.65rem;padding:.8rem}
  .mf-choice-icon{width:42px;height:42px;border-radius:13px}
  .mf-choice small{font-size:.75rem}
  .mf-main-card{grid-template-columns:1fr;text-align:center}.mf-main-card-mark{margin-inline:auto}
}
@media (hover:none){.mf-feature:hover,.mf-utility:hover,.mf-choice:hover,.mf-main-card:hover,.mf-btn:hover{transform:none}.mf-feature:hover .mf-media img{transform:none}}
@media (prefers-reduced-motion:reduce){
  .mf-feature,.mf-media img,.mf-utility,.mf-choice,.mf-main-card,.mf-btn{transition:none!important}
  .mf-feature:hover,.mf-utility:hover,.mf-choice:hover,.mf-main-card:hover,.mf-btn:hover{transform:none!important}
  .mf-feature:hover .mf-media img{transform:none!important}
}
@media print{
  .mf-actions,.mf-home-links,.mf-switch,.mf-continue,.mf-footer{display:none!important}
  .mf-hero{background:#fff!important;color:#000!important;border-bottom:2px solid #000}
  .mf-hero::before,.mf-hero::after,.mf-hero-texture,.mf-halo,.mf-audience-badge{display:none!important}
  .mf-hero-grid{min-height:0;grid-template-columns:110px 1fr;padding-block:1.5rem;text-align:left}
  .mf-hero-mark{width:100px;filter:none}.mf-mark-stage{min-height:0}
  .mf-hero h1,.mf-lead,.mf-kicker{color:#000!important}
  .mf-feature,.mf-utility,.mf-note,.mf-choice{break-inside:avoid;box-shadow:none}
}

/* Revision 3 discovery and audience compositions. */
.mf-discovery-hero .mf-hero-grid{min-height:clamp(570px,76vh,760px)}
.mf-root-search{margin-top:1.3rem;max-width:760px;text-align:left}
.mf-root-search .mbm-search-label{color:#F3EBDD}
.mf-root-section-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:.9rem}
.mf-root-section-head p{margin:0;color:#8A5620;font-size:.68rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase}
.mf-root-section-head h2{margin:.2rem 0 0;color:var(--mf-navy);font-size:clamp(1.6rem,4vw,2.7rem)}
.mf-root-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.mf-root-highlight{display:flex;min-width:0;overflow:hidden;flex-direction:column;border:1px solid var(--mf-line);border-radius:18px;background:var(--mf-surface);color:var(--mf-ink);text-decoration:none;box-shadow:var(--mf-shadow-sm)}
.mf-root-highlight img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--mf-navy)}
.mf-root-highlight>span{display:flex;flex:1;flex-direction:column;padding:.9rem}
.mf-root-highlight strong{color:var(--mf-navy);font-size:1rem}.mf-root-highlight small{margin:.35rem 0;color:var(--mf-muted);font-size:.78rem;line-height:1.45}.mf-root-highlight b{margin-top:auto;padding-top:.7rem;color:var(--mf-mint-deep);font-size:.72rem}.mf-root-highlight i{font-style:normal}
.mf-root-highlight:hover{transform:translateY(-2px);box-shadow:var(--mf-shadow-md)}
.mf-root-highlight:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}
.mf-choice-intro{margin-bottom:1.4rem}.mf-choice-intro>p{margin:0;color:#8A5620;font-size:.68rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase}.mf-choice-intro h2{margin:.25rem 0;color:var(--mf-navy);font-size:clamp(1.8rem,4.8vw,3.5rem);letter-spacing:-.035em}.mf-choice-intro>span{display:block;max-width:760px;color:var(--mf-muted);font-size:.92rem;line-height:1.6}.mf-choice-intro nav{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:.9rem}.mf-choice-intro nav a{display:inline-flex;align-items:center;min-height:44px;padding:.5rem .85rem;border:1px solid var(--mf-line);border-radius:999px;background:var(--mf-surface);color:var(--mf-navy);font-size:.74rem;font-weight:850;text-decoration:none}.mf-choice-intro nav a:hover{border-color:var(--mf-amber-deep)}
.mf-group-head h3{margin:.22rem 0 0;color:var(--mf-navy);font-size:clamp(1.55rem,4vw,2.45rem);line-height:1.05}


.mf-route-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.mf-route-card{position:relative;display:flex;flex-direction:column;min-height:155px;padding:1rem 1.05rem;border:1px solid var(--mf-line);border-radius:17px;background:var(--mf-surface);color:var(--mf-ink);text-decoration:none;box-shadow:var(--mf-shadow-sm)}
.mf-route-card::before{content:"";position:absolute;inset:0 auto 0 0;width:5px;border-radius:17px 0 0 17px;background:var(--face-accent)}
.mf-route-copy{display:block}.mf-route-copy strong{display:block;color:var(--mf-navy);font-size:1.08rem}.mf-route-copy small{display:block;margin-top:.35rem;color:var(--mf-muted);font-size:.8rem;line-height:1.52}.mf-route-action{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-top:auto;padding-top:.75rem;color:var(--face-accent);font-size:.72rem;font-weight:900}.mf-route-action b{font-size:1rem}.mf-route-card:hover{transform:translateY(-2px);box-shadow:var(--mf-shadow-md)}.mf-route-card:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}

.mf-task-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.mf-task-card{--task-accent:#2F6B4D;position:relative;display:flex;flex-direction:column;min-height:175px;padding:1rem 1rem .9rem;overflow:hidden;border:1px solid var(--mf-line);border-radius:17px;background:var(--mf-surface);color:var(--mf-ink);text-decoration:none;box-shadow:var(--mf-shadow-sm)}
.mf-task-card::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;background:var(--task-accent)}.mf-task-card>span{color:#8A5620;font-size:.62rem;font-weight:900;letter-spacing:.12em}.mf-task-card strong{margin:.55rem 0 .35rem;color:var(--mf-navy);font-size:1.12rem;line-height:1.15}.mf-task-card small{color:var(--mf-muted);font-size:.79rem;line-height:1.48}.mf-task-card b{margin-top:auto;padding-top:.75rem;color:var(--task-accent);font-size:.7rem}.mf-task-card i{font-style:normal}.mf-task-card:hover{transform:translateY(-3px);box-shadow:var(--mf-shadow-md)}.mf-task-card:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}

.mf-tip-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}.mf-tip{position:relative;min-height:175px;padding:1rem;border:1px solid var(--mf-line);border-radius:17px;background:var(--mf-surface);box-shadow:var(--mf-shadow-sm)}.mf-tip>span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;background:var(--face-soft);color:var(--face-accent);font-size:.66rem;font-weight:900}.mf-tip h3{margin:.72rem 0 .35rem;color:var(--mf-navy);font-size:1rem}.mf-tip p{margin:0;color:var(--mf-muted);font-size:.79rem;line-height:1.5}
.mf-faq-list{display:grid;gap:.6rem;max-width:900px}.mf-faq{border:1px solid var(--mf-line);border-radius:15px;background:var(--mf-surface);box-shadow:var(--mf-shadow-sm)}.mf-faq summary{display:flex;align-items:center;min-height:54px;padding:.75rem 1rem;cursor:pointer;color:var(--mf-navy);font-size:.9rem;font-weight:850;list-style:none}.mf-faq summary::-webkit-details-marker{display:none}.mf-faq summary::after{content:"+";margin-left:auto;color:var(--face-accent);font-size:1.2rem}.mf-faq[open] summary::after{content:"−"}.mf-faq div{padding:0 1rem 1rem}.mf-faq p{margin:0;color:var(--mf-muted);font-size:.82rem;line-height:1.6}.mf-faq summary:focus-visible{outline:3px solid var(--mf-amber);outline-offset:3px;border-radius:12px}

.mf-surprise-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:1rem;padding:clamp(1.2rem,4vw,2rem);border:1px solid color-mix(in srgb,var(--face-accent) 38%,var(--mf-line));border-radius:22px;background:linear-gradient(135deg,var(--face-soft),var(--mf-surface));box-shadow:var(--mf-shadow-md)}.mf-surprise-card p:first-child{margin:0;color:#8A5620;font-size:.66rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.mf-surprise-card h2{margin:.25rem 0;color:var(--mf-navy);font-size:clamp(1.6rem,4vw,2.8rem)}.mf-surprise-card span{display:block;max-width:680px;color:var(--mf-muted);font-size:.84rem;line-height:1.55}.mf-surprise-card .mf-btn{width:auto;min-width:160px}.mf-surprise-result{grid-column:1/-1;margin:0!important;color:var(--mf-navy)!important;font-size:.82rem!important;font-weight:800!important;text-transform:none!important;letter-spacing:0!important}

.mf-recent-head{display:flex;align-items:end;justify-content:space-between;gap:1rem;margin-bottom:.8rem}.mf-recent-head>div>p{margin:0;color:#8A5620;font-size:.66rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.mf-recent-head h2{margin:.25rem 0;color:var(--mf-navy);font-size:clamp(1.6rem,4vw,2.8rem)}.mf-recent-head span{display:block;color:var(--mf-muted);font-size:.84rem;line-height:1.5}.mf-recent-head button{min-height:44px;padding:.5rem .8rem;border:1px solid var(--mf-navy);border-radius:999px;background:transparent;color:var(--mf-navy);font:inherit;font-size:.72rem;font-weight:850;cursor:pointer}.mf-recent-head button:focus-visible{outline:3px solid var(--mf-amber);outline-offset:3px}

.mf-video-shell{max-width:900px}.mf-video-poster{position:relative;display:block;width:100%;overflow:hidden;padding:0;border:2px solid var(--mf-line);border-radius:20px;background:#0F1530;cursor:pointer;box-shadow:var(--mf-shadow-md)}.mf-video-poster img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}.mf-video-poster>span{position:absolute;inset:50% auto auto 50%;display:grid;place-items:center;width:68px;height:68px;border-radius:50%;background:var(--mf-amber);color:var(--mf-navy);font-size:1.5rem;transform:translate(-50%,-50%);box-shadow:0 12px 30px rgba(0,0,0,.35)}.mf-video-poster>b{position:absolute;left:1rem;bottom:1rem;padding:.48rem .72rem;border-radius:999px;background:rgba(15,21,48,.88);color:#fff;font-size:.75rem}.mf-video-poster:focus-visible{outline:3px solid var(--mf-amber);outline-offset:4px}.mf-video-shell>p{margin:.6rem 0 0;color:var(--mf-muted);font-size:.74rem}.mf-video-shell iframe{display:block;width:100%;aspect-ratio:16/9;border:0;border-radius:20px;background:#000}

body[data-theme="dark"].mbm-face-page .mf-root-section-head h2,body[data-theme="dark"].mbm-face-page .mf-choice-intro h2,body[data-theme="dark"].mbm-face-page .mf-group-head h3,body[data-theme="dark"].mbm-face-page .mf-root-highlight strong,body[data-theme="dark"].mbm-face-page .mf-route-copy strong,body[data-theme="dark"].mbm-face-page .mf-task-card strong,body[data-theme="dark"].mbm-face-page .mf-tip h3,body[data-theme="dark"].mbm-face-page .mf-faq summary,body[data-theme="dark"].mbm-face-page .mf-surprise-card h2,body[data-theme="dark"].mbm-face-page .mf-recent-head h2{color:#F1ECDF}
body[data-theme="dark"].mbm-face-page .mf-surprise-card{background:linear-gradient(135deg,color-mix(in srgb,var(--face-accent) 18%,#1B234A),#1B234A)}

@media(max-width:1024px){.mf-tip-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mf-task-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:780px){.mf-root-highlights,.mf-route-grid,.mf-task-grid,.mf-tip-grid{grid-template-columns:1fr}.mf-root-search{width:100%}.mf-surprise-card{grid-template-columns:1fr}.mf-surprise-card .mf-btn{width:100%}.mf-recent-head{align-items:start;flex-direction:column}.mf-root-section-head{align-items:start;flex-direction:column}.mf-root-highlights{width:100%}}
@media(max-width:520px){.mf-root-search .mbm-search-form{grid-template-columns:1fr}.mf-root-search .mbm-search-submit{width:100%}.mf-route-card{min-height:145px}.mf-task-card,.mf-tip{min-height:155px}}

/* Studio band — the compact foot of the chooser. Quiet by construction: text
   links only, no button treatment, no tiers, no amounts. It sits after the
   audience section so the seven front doors are always reached first. */
.mf-studio-band{padding-top:0}
.mf-band{
  max-width:46rem;
  margin:0 auto;
  padding:1.15rem 1.3rem;
  border:1px solid var(--mf-line,#E3DAC5);
  border-radius:16px;
  background:var(--mf-card,#FFFDF6);
  text-align:center;
}
.mf-band-signpost{
  margin:0 0 .4rem;
  color:var(--mf-muted,#4A5170);
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.mf-band-about{margin:0 0 .7rem;color:var(--mf-ink,#1B2140);font-size:.92rem;line-height:1.55}
.mf-band-links{display:flex;flex-wrap:wrap;gap:.9rem;justify-content:center;margin:0}
.mf-band-link{
  color:#8A5620;
  font-size:.82rem;
  font-weight:750;
  text-decoration:underline;
  text-underline-offset:3px;
  min-height:38px;
  display:inline-flex;
  align-items:center;
}
.mf-band-link:focus-visible{outline:3px solid var(--mf-amber,#F2A24A);outline-offset:2px}
body[data-theme="dark"] .mf-band{background:#1B234A;border-color:#2E3860}
body[data-theme="dark"] .mf-band-about{color:#E8E2D4}
body[data-theme="dark"] .mf-band-link{color:#F2A24A}

/* Pupil homepage: the Top Picks rail and the genre accordions.
   Every genre <summary> is a real control, so it carries the 44px floor
   itself rather than relying on its text — measured at 364x25 before this,
   which is a tap target a child has to aim at. The masthead link measured
   186x42 and is floored for the same reason. */
.mf-pupil-rail{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.mf-pupil-genres{display:grid;gap:.6rem}
.mf-pupil-genre{border:1.5px solid rgba(22,29,61,.18);border-radius:14px;overflow:hidden;background:#fff}
.mf-pupil-genre>summary{display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  min-height:56px;padding:.75rem 1rem;cursor:pointer;touch-action:manipulation;font-weight:800}
.mf-pupil-genre>summary:focus-visible{outline:3px solid #161D3D;outline-offset:-3px}
.mf-pupil-gname{font-size:1rem}
.mf-pupil-gnum{font-size:.78rem;font-weight:800;color:#4b5273;white-space:nowrap}
.mf-pupil-genre[open]>summary{border-bottom:1.5px solid rgba(22,29,61,.18)}
.mf-pupil-grid{display:grid;gap:.8rem;padding:.85rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr))}
.mf-pupil-game{border:1.5px solid rgba(22,29,61,.14);border-radius:12px;overflow:hidden;background:#fff;display:flex;flex-direction:column}
.mf-pupil-game .mf-media{display:block;min-height:44px}
.mf-pupil-game img{width:100%;height:auto;display:block}
.mf-pupil-emoji{display:flex;align-items:center;justify-content:center;min-height:96px;font-size:2.4rem}
.mf-pupil-game h3{font-size:1rem;margin:.2rem 0}
.mf-pupil-take{font-size:.86rem;color:#3b4166}
.mf-pupil-game .mf-text-link{min-height:44px;display:inline-flex;align-items:center}
.mf-masthead a.mf-brand,.mf-brand{min-height:44px;display:inline-flex;align-items:center}

/* THE SEARCH ENTRY POINT, IN THE HERO
   These pages all loaded the search engine and none of them showed a box.
   The control sits under the hero actions so it is reachable without scrolling
   on a 390px phone, and it never covers the hero — it is in normal flow, not
   fixed or sticky, so nothing can occlude it and it cannot occlude anything. */
.mf-hero-search,.mf-pupil-search{margin-top:clamp(.9rem,2.4vw,1.25rem);max-width:44rem}
.mf-pupil-search-label,.mf-hero-search .mbm-search-label{display:block;font-weight:700;
  font-size:.95rem;margin-bottom:.4rem}
.mf-pupil-search-field{display:flex}
.mf-pupil-search input{flex:1;min-height:48px;padding:.7rem .9rem;font:inherit;
  border:2px solid var(--face-accent,#2f6b4d);border-radius:12px;background:#fff;color:inherit}
.mf-pupil-search input:focus-visible{outline:3px solid var(--face-accent,#2f6b4d);outline-offset:2px}
.mf-hero-search .mbm-search-field input{min-height:48px}
.mf-hero-search .mbm-search-submit{min-height:48px;min-width:48px}
.mf-pupil-search-status{margin:.55rem 0 0;font-size:.95rem;line-height:1.45}
.mf-pupil-game[hidden],details.mf-pupil-genre[hidden]{display:none}
@media (prefers-reduced-motion: reduce){
  .mf-hero-search,.mf-pupil-search{transition:none}
}

/* The closing line. Editorial, and deliberately quieter than a card grid and
   louder than the boundaries note it sits above: it is the last thing the page
   says in its own voice before it states its limits. */
.mf-closing-section{padding-block:clamp(1.1rem,3vw,1.9rem)}
.mf-closing{max-width:62ch;margin:0;font-size:clamp(1rem,1.6vw,1.12rem);line-height:1.55;color:var(--mf-ink,inherit)}
