/* mod-legal — shared styling for gamoid public legal/about pages.
   Standalone (these render outside the app shell, served at /_m/legal/*.html).
   Palette mirrors the gamoid splash/gate: dark #080810, neon pink #ff3997,
   cyan #00e6d2, Bungee headings, Inter body. */
@import url('https://fonts.googleapis.com/css2?family=Bungee&family=Inter:wght@400;500;600;700&display=swap');

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  color: #e8e8f0;
  line-height: 1.65;
  background:
    radial-gradient(1200px 600px at 50% -10%, rgba(255,57,151,.16), transparent 60%),
    radial-gradient(900px 500px at 50% 120%, rgba(0,230,210,.12), transparent 60%),
    #080810;
  min-height: 100vh;
}

.lg-nav {
  display: flex; align-items: center; gap: 20px;
  padding: 18px 28px;
  border-bottom: 1px solid #1e1e30;
  position: sticky; top: 0;
  background: rgba(8,8,16,.82);
  backdrop-filter: blur(8px);
  z-index: 10;
}
.lg-wm {
  font-family: Bungee, sans-serif; font-size: 24px; letter-spacing: 1px;
  color: #ff3997; text-shadow: 0 0 24px rgba(255,57,151,.45);
  text-decoration: none; line-height: 1;
}
.lg-nav a.lg-link {
  color: #9a9aad; text-decoration: none; font-size: 14px; font-weight: 500;
  transition: color .15s;
}
.lg-nav a.lg-link:hover { color: #00e6d2; }
.lg-nav .lg-spacer { flex: 1; }

.lg-wrap { max-width: 820px; margin: 0 auto; padding: 44px 24px 90px; }

.lg-wrap h1 {
  font-family: Bungee, sans-serif; font-weight: 400;
  font-size: clamp(28px, 5vw, 42px); letter-spacing: .5px;
  color: #fff; margin: 0 0 6px; line-height: 1.1;
}
.lg-meta { color: #7a7a8c; font-size: 13px; text-transform: uppercase; letter-spacing: .5px; margin-bottom: 34px; }
.lg-wrap h2 {
  font-family: Bungee, sans-serif; font-weight: 400;
  font-size: 19px; color: #00e6d2; letter-spacing: .3px;
  margin: 40px 0 12px;
}
.lg-wrap p, .lg-wrap li { color: #c7c7d6; font-size: 16px; }
.lg-wrap a { color: #ff3997; text-decoration: none; }
.lg-wrap a:hover { text-decoration: underline; }
.lg-wrap ul { padding-left: 22px; }
.lg-wrap li { margin-bottom: 7px; }
.lg-card {
  background: rgba(19,19,31,.7); border: 1px solid #23233a;
  border-radius: 14px; padding: 20px 24px; margin: 24px 0;
}
.lg-foot {
  margin-top: 60px; padding-top: 22px; border-top: 1px solid #1e1e30;
  color: #6a6a7c; font-size: 13px; display: flex; gap: 18px; flex-wrap: wrap; align-items: center;
}
.lg-foot a { color: #9a9aad; text-decoration: none; }
.lg-foot a:hover { color: #00e6d2; }
.lg-foot .lg-spacer { flex: 1; }

/* ── About page ── */
.lg-hero { text-align: center; padding: 20px 0 8px; }
.lg-hero .lg-brand {
  font-family: Bungee, sans-serif; font-size: clamp(44px, 9vw, 84px);
  color: #ff3997; text-shadow: 0 0 40px rgba(255,57,151,.5); letter-spacing: 1px;
  line-height: 1; margin: 0;
}
.lg-hero .lg-tag {
  font-size: clamp(16px, 2.4vw, 21px); color: #d4d4e2; max-width: 620px;
  margin: 18px auto 0; font-weight: 500;
}
.lg-shot {
  display: block; width: 100%; max-width: 760px; margin: 40px auto 10px;
  border-radius: 16px; border: 1px solid #23233a;
  box-shadow: 0 30px 80px rgba(0,0,0,.6);
}
.lg-feats { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; margin: 48px 0; }
.lg-feat { background: rgba(19,19,31,.7); border: 1px solid #23233a; border-radius: 14px; padding: 22px; }
.lg-feat h3 { font-family: Bungee, sans-serif; font-weight: 400; font-size: 15px; color: #00e6d2; margin: 0 0 8px; }
.lg-feat p { color: #b4b4c6; font-size: 15px; margin: 0; }
.lg-cta {
  display: inline-block; margin: 10px auto 0; padding: 14px 30px;
  background: #00e6d2; color: #06121a; font-weight: 700; font-size: 16px;
  border-radius: 12px; text-decoration: none; transition: filter .15s;
}
.lg-cta:hover { filter: brightness(1.08); text-decoration: none; }
.lg-center { text-align: center; }