/* ==========================================================================
   METAFLIGHT HUD - LEGAL PAGES, prefix mf-lg-
   Terms of Service (2114, Breakdance) and Privacy Policy (3, classic content
   printed by a Breakdance CodeBlock in template 13).
   Load order: mf-hud-tokens.css, mf-hud-chrome.css, then this file.

   PRIORITY HERE IS READING, NOT EFFECT. The starfield stays visible around the
   document but the document itself sits on a dense scrim, so a 12,000 word
   contract is comfortable to read. Legal copy is NEVER restyled in a way that
   changes meaning: no truncation, no collapsing, no hiding.
   ========================================================================== */

body.breakdance.mf-legal{
  background:transparent;color:var(--mf-text);
  font-family:'Rajdhani',sans-serif;-webkit-font-smoothing:antialiased;
}
/* SCOPE, LEARNED THE HARD WAY: never target .bde-section on a page layer.
   The site header and footer ARE sections, and body.breakdance.mf-legal
   .bde-section outweighs .mf-bd-hd, so this block was overriding the header's
   own padding (64px instead of .85rem, a 170px tall header) and its
   position:sticky. Page layers address their OWN section classes only. */
body.breakdance.mf-legal .mf-lg-hero,
body.breakdance.mf-legal .mf-lg-sec,
body.breakdance.mf-legal.page-id-3 .bde-section:not(.mf-bd-hd):not(.mf-bd-ft){position:relative;z-index:2;padding:0;background:transparent}
body.breakdance.mf-legal .mf-lg-hero > .section-container,
body.breakdance.mf-legal .mf-lg-sec > .section-container,
body.breakdance.mf-legal.page-id-3 .bde-section:not(.mf-bd-hd):not(.mf-bd-ft) > .section-container{
  align-items:stretch;max-width:1240px;margin:0 auto;width:100%;padding:4rem 2rem;
}
body.breakdance.mf-legal .mf-lg-hero > .section-container{padding:9rem 2rem 2.5rem}

/* --------------------------------------------------------------------------
   HERO
   -------------------------------------------------------------------------- */
body.breakdance.mf-legal .mf-lg-h1,
body.breakdance.mf-legal h1{
  font-family:'Orbitron',sans-serif;font-weight:900;
  font-size:clamp(1.9rem,4.4vw,3rem);line-height:1.06;
  letter-spacing:.03em;text-transform:uppercase;color:var(--mf-text);
  margin:0 0 1rem;
}
body.breakdance.mf-legal .mf-lg-upd{
  display:inline-flex;align-items:center;gap:.5rem;width:auto;align-self:flex-start;
  font-family:var(--mf-mono);font-size:.56rem;font-weight:500;letter-spacing:.22em;
  text-transform:uppercase;color:var(--mf-cyan);
  padding:.42rem .8rem;margin:0 0 1.4rem;
  background-color:rgba(0,212,255,.07);
  box-shadow:inset 0 0 0 1px rgba(0,212,255,.32);
  border-radius:0;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
}
body.breakdance.mf-legal .mf-lg-lead{
  font-size:1rem;line-height:1.65;color:var(--mf-muted);max-width:70ch;margin:0;
}

/* --------------------------------------------------------------------------
   LAYOUT: sticky table of contents beside the document.
   The TOC is sticky under the site header, which is position:sticky top:0.
   The header height is reserved as padding-top rather than a top offset, so
   the pin travel is not shortened.
   -------------------------------------------------------------------------- */
body.breakdance.mf-legal .mf-lg-cols{
  display:grid;grid-template-columns:minmax(0,270px) minmax(0,1fr);
  align-items:start;gap:2.5rem;width:100%;
}
body.breakdance.mf-legal .mf-lg-side{position:relative;width:auto;min-width:0}
body.breakdance.mf-legal .mf-lg-toc{
  position:sticky;top:0;box-sizing:border-box;padding-top:78px;
  display:flex;flex-direction:column;align-items:stretch;width:100%;
}
body.breakdance.mf-legal .mf-lg-toc-h{
  font-family:var(--mf-mono);font-size:.58rem;font-weight:500;letter-spacing:.24em;
  text-transform:uppercase;color:var(--mf-cyan);
  margin:0 0 .9rem;padding:0;background:none;border-radius:0;
}
body.breakdance.mf-legal .mf-lg-toc-list{
  width:100%;max-height:62vh;overflow-y:auto;
  padding:1.1rem 1rem;
  background-color:rgba(8,10,14,.6);
  box-shadow:inset 0 0 0 1px var(--mf-hair);
  clip-path:polygon(var(--mf-ch-sm) 0,100% 0,100% calc(100% - var(--mf-ch-sm)),calc(100% - var(--mf-ch-sm)) 100%,0 100%,0 var(--mf-ch-sm));
  scrollbar-width:thin;
}
body.breakdance.mf-legal .mf-lg-toc-list ul,
body.breakdance.mf-legal .mf-lg-toc-list ol{list-style:none;margin:0;padding:0}
body.breakdance.mf-legal .mf-lg-toc-list li{list-style:none;margin:0}
body.breakdance.mf-legal .mf-lg-toc-list a{
  display:block;padding:.4rem 0 .4rem .8rem !important;
  font-family:'Rajdhani',sans-serif;font-size:.86rem;line-height:1.35;
  color:var(--mf-muted);text-decoration:none;
  box-shadow:inset 2px 0 0 0 rgba(160,225,255,.18);
  transition:color .25s var(--mf-ease),box-shadow .25s var(--mf-ease);
}
body.breakdance.mf-legal .mf-lg-toc-list a:hover{
  color:var(--mf-cyan);box-shadow:inset 2px 0 0 0 var(--mf-cyan);
}
body.breakdance.mf-legal .mf-lg-main{width:auto;min-width:0}

/* --------------------------------------------------------------------------
   THE DOCUMENT PANEL
   Both the Breakdance RichText on Terms and the CodeBlock that prints the
   classic Privacy content get the identical treatment, so the two legal pages
   read as one system.
   -------------------------------------------------------------------------- */
body.breakdance.mf-legal .mf-lg-doc,
body.breakdance.mf-legal .mf-lg-rt,
body.breakdance.mf-legal .bde-code-block{
  width:100%;max-width:none;
}
body.breakdance.mf-legal .mf-lg-doc,
body.breakdance.mf-legal .bde-code-block{
  padding:2.6rem 2.4rem;
  background-color:rgba(8,10,14,.72);
  background-image:linear-gradient(180deg,var(--mf-veil-top),var(--mf-veil-bot));
  backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);
  box-shadow:inset 0 0 0 1px var(--mf-hair);
  clip-path:polygon(var(--mf-ch) 0,100% 0,100% calc(100% - var(--mf-ch)),calc(100% - var(--mf-ch)) 100%,0 100%,0 var(--mf-ch));
}

/* running text */
body.breakdance.mf-legal .mf-lg-rt,
body.breakdance.mf-legal .bde-code-block{
  font-family:'Rajdhani',sans-serif;font-size:1.02rem;line-height:1.85;
  color:#C9D8E8;
}
body.breakdance.mf-legal .mf-lg-rt p,
body.breakdance.mf-legal .bde-code-block p{margin:0 0 1.15rem;max-width:78ch}
body.breakdance.mf-legal .mf-lg-rt h2,
body.breakdance.mf-legal .bde-code-block h2{
  font-family:'Orbitron',sans-serif;font-weight:700;font-size:1.15rem;
  letter-spacing:.04em;text-transform:uppercase;color:var(--mf-text);
  margin:2.6rem 0 1rem;padding-top:1.1rem;
  box-shadow:inset 0 1px 0 var(--mf-hair);
}
body.breakdance.mf-legal .mf-lg-rt h3,
body.breakdance.mf-legal .bde-code-block h3{
  font-family:'Orbitron',sans-serif;font-weight:700;font-size:.95rem;
  letter-spacing:.04em;text-transform:uppercase;color:var(--mf-cyan-lit);
  margin:2rem 0 .8rem;
}
body.breakdance.mf-legal .mf-lg-rt h4,
body.breakdance.mf-legal .bde-code-block h4{
  font-family:var(--mf-mono);font-weight:500;font-size:.72rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mf-muted);margin:1.6rem 0 .6rem;
}
body.breakdance.mf-legal .mf-lg-rt strong,
body.breakdance.mf-legal .bde-code-block strong{color:var(--mf-text);font-weight:600}
body.breakdance.mf-legal .mf-lg-rt a,
body.breakdance.mf-legal .bde-code-block a{
  color:var(--mf-cyan);text-decoration:none;
  box-shadow:inset 0 -1px 0 rgba(0,212,255,.4);
  transition:box-shadow .25s var(--mf-ease);
}
body.breakdance.mf-legal .mf-lg-rt a:hover,
body.breakdance.mf-legal .bde-code-block a:hover{box-shadow:inset 0 -1px 0 var(--mf-cyan)}

/* lists: cyan hairline markers instead of default bullets */
body.breakdance.mf-legal .mf-lg-rt ul,
body.breakdance.mf-legal .bde-code-block ul{list-style:none;margin:0 0 1.2rem;padding:0}
body.breakdance.mf-legal .mf-lg-rt ul li,
body.breakdance.mf-legal .bde-code-block ul li{
  position:relative;list-style:none;padding:.2rem 0 .2rem 1.35rem;max-width:78ch;
}
body.breakdance.mf-legal .mf-lg-rt ul li::before,
body.breakdance.mf-legal .bde-code-block ul li::before{
  content:'';position:absolute;left:0;top:.95em;width:8px;height:1px;background:var(--mf-cyan);
}
body.breakdance.mf-legal .mf-lg-rt ol,
body.breakdance.mf-legal .bde-code-block ol{margin:0 0 1.2rem;padding-left:1.4rem}
body.breakdance.mf-legal .mf-lg-rt ol li,
body.breakdance.mf-legal .bde-code-block ol li{padding:.2rem 0;max-width:78ch}
body.breakdance.mf-legal .mf-lg-rt ol li::marker,
body.breakdance.mf-legal .bde-code-block ol li::marker{color:var(--mf-cyan);font-family:var(--mf-mono);font-size:.8em}

/* tables inside the legal copy - hairlines, no slab, no radius */
body.breakdance.mf-legal .bde-code-block figure,
body.breakdance.mf-legal .mf-lg-rt figure{margin:1.6rem 0;max-width:100%;overflow-x:auto}
body.breakdance.mf-legal .bde-code-block table,
body.breakdance.mf-legal .mf-lg-rt table{
  width:100%;border-collapse:collapse;background:transparent;border:none;
  font-size:.95rem;
}
body.breakdance.mf-legal .bde-code-block table td,
body.breakdance.mf-legal .bde-code-block table th,
body.breakdance.mf-legal .mf-lg-rt table td,
body.breakdance.mf-legal .mf-lg-rt table th{
  border:none;box-shadow:inset 0 -1px 0 var(--mf-hair);
  padding:.75rem .9rem;text-align:left;vertical-align:top;color:#C9D8E8;
}
body.breakdance.mf-legal .bde-code-block table th,
body.breakdance.mf-legal .mf-lg-rt table th{
  font-family:var(--mf-mono);font-size:.6rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--mf-muted);
}
body.breakdance.mf-legal .bde-code-block table tbody{background:transparent}

/* Privacy has no Breakdance canvas: its section gets the hero rhythm here */
body.breakdance.mf-legal.page-id-3 .bde-section:not(.mf-bd-hd):not(.mf-bd-ft) > .section-container{padding:8rem 2rem 5rem;max-width:1000px}

/* --------------------------------------------------------------------------
   LEFTOVER BUILDER STYLING
   The Terms page was built before the design system and carried 20px and 25px
   radii, #FFFFFF05 fills and gfont-inter typography set through the builder UI.
   Those were stripped at the elements, not overridden here. These two rules
   only guarantee the result if a design property is ever set again by mistake.
   -------------------------------------------------------------------------- */
body.breakdance.mf-legal .mf-lg-toc,
body.breakdance.mf-legal .mf-lg-doc,
body.breakdance.mf-legal .mf-lg-toc-h{border-radius:0;border:none}
body.breakdance.mf-legal .mf-lg-toc{background:none}

/* thin instrument scrollbar on the contents panel */
body.breakdance.mf-legal .mf-lg-toc-list{scrollbar-color:rgba(0,212,255,.45) transparent}
body.breakdance.mf-legal .mf-lg-toc-list::-webkit-scrollbar{width:4px}
body.breakdance.mf-legal .mf-lg-toc-list::-webkit-scrollbar-track{background:transparent}
body.breakdance.mf-legal .mf-lg-toc-list::-webkit-scrollbar-thumb{background:rgba(0,212,255,.45)}

/* --------------------------------------------------------------------------
   PRIVACY POLICY (page 3) has no Breakdance canvas and therefore no hero: the
   document opens with its own title row, a one-cell table in the classic
   content. It is promoted to the page title here rather than by editing the
   legal text, which stays untouched.
   -------------------------------------------------------------------------- */
body.breakdance.mf-legal.page-id-3 .bde-code-block > figure:first-child{
  margin:0 0 2.2rem;padding:0 0 1.4rem;overflow:visible;
  box-shadow:inset 0 -1px 0 var(--mf-hair);
}
body.breakdance.mf-legal.page-id-3 .bde-code-block > figure:first-child table,
body.breakdance.mf-legal.page-id-3 .bde-code-block > figure:first-child td{
  box-shadow:none;padding:0;
}
body.breakdance.mf-legal.page-id-3 .bde-code-block > figure:first-child strong{
  display:block;font-family:'Orbitron',sans-serif;font-weight:900;
  font-size:clamp(1.5rem,3.4vw,2.3rem);line-height:1.1;letter-spacing:.03em;
  text-transform:uppercase;color:var(--mf-text);
}
body.breakdance.mf-legal.page-id-3 .bde-code-block > figure:first-child strong + strong{
  margin-top:.7rem;font-family:var(--mf-mono);font-weight:500;
  font-size:.56rem;letter-spacing:.22em;color:var(--mf-cyan);
}
/* ===== MOBILE, KEEP LAST IN THIS FILE ===== */
@media (max-width:1023px){
body.breakdance.mf-legal .mf-lg-hero > .section-container,
body.breakdance.mf-legal .mf-lg-sec > .section-container{padding:3rem 1.25rem}
body.breakdance.mf-legal .mf-lg-hero > .section-container{padding:7rem 1.25rem 2rem}
body.breakdance.mf-legal.page-id-3 .bde-section:not(.mf-bd-hd):not(.mf-bd-ft) > .section-container{padding:7rem 1.25rem 3.5rem}
body.breakdance.mf-legal .mf-lg-cols{grid-template-columns:1fr;gap:1.6rem}
body.breakdance.mf-legal .mf-lg-toc{position:static;padding-top:0}
body.breakdance.mf-legal .mf-lg-toc-list{max-height:230px}
body.breakdance.mf-legal .mf-lg-doc,
body.breakdance.mf-legal .bde-code-block{padding:1.5rem 1.2rem}
}

/* EARLY ACCESS CLAUSE ANCHOR (2026-10-07). Every Early Access notice links to
   #early-access in section 6. Clear the sticky header on arrival and mark the
   clause briefly so the reader lands on the right paragraph. */
body.breakdance.mf-legal #early-access{scroll-margin-top:7.5rem}
body.breakdance.mf-legal #early-access:target{
  box-shadow:inset 3px 0 0 rgba(0,212,255,.55);padding-left:1rem;
  transition:box-shadow .4s var(--mf-ease),padding .4s var(--mf-ease);
}