@font-face {
  font-family: "VaultPlayerFont";
  src: url("/vaultplayer-font.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Jayscript";
  src: url("/jayscript-font.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --bg: #0d0f12;
  --surface: #161a20;
  --border: #2a3140;
  --text: #e8eaed;
  --muted: #9aa0a6;
  --accent: #f5c518;
  --accent-dim: #c49b12;
  --accent-rgb: 245, 197, 24;
  --brand: #2f80ff;
  --brand-rgb: 47, 128, 255;
  --brand-soft: #9fc5ff;
  --vp-nf-bg: #141414;
}

html.vp-theme-red { --bg:#16090a; --surface:#261214; --border:#4d2a2e; --accent:#ff8b7a; --accent-dim:#d96a5c; --accent-rgb:255,139,122; --brand:#e23d3d; --brand-rgb:226,61,61; --brand-soft:#ff9a9a; --vp-nf-bg:#160b0c; }
html.vp-theme-red-orange { --bg:#160c08; --surface:#26180f; --border:#4d3324; --accent:#ffb08a; --accent-dim:#d8885c; --accent-rgb:255,176,138; --brand:#ff5a2e; --brand-rgb:255,90,46; --brand-soft:#ffb199; --vp-nf-bg:#17100b; }
html.vp-theme-orange { --bg:#161008; --surface:#261c10; --border:#4d3a24; --accent:#ffc07a; --accent-dim:#d89a52; --accent-rgb:255,192,122; --brand:#ff7a1a; --brand-rgb:255,122,26; --brand-soft:#ffc48a; --vp-nf-bg:#17120b; }
html.vp-theme-yellow-orange { --bg:#161408; --surface:#262010; --border:#4d4324; --accent:#ffd56a; --accent-dim:#d8b04a; --accent-rgb:255,213,106; --brand:#ff9f1a; --brand-rgb:255,159,26; --brand-soft:#ffe08a; --vp-nf-bg:#17140b; }
html.vp-theme-yellow { --bg:#151408; --surface:#242010; --border:#4a4324; --accent:#ffe38a; --accent-dim:#d4bc4a; --accent-rgb:255,227,138; --brand:#f5c518; --brand-rgb:245,197,24; --brand-soft:#ffe9a3; --vp-nf-bg:#16140b; }
html.vp-theme-yellow-green { --bg:#101408; --surface:#1c2210; --border:#364824; --accent:#d6ef7a; --accent-dim:#a8c44a; --accent-rgb:214,239,122; --brand:#b5d433; --brand-rgb:181,212,51; --brand-soft:#ddf08a; --vp-nf-bg:#12160b; }
html.vp-theme-green { --bg:#08140c; --surface:#102018; --border:#244833; --accent:#8eefb0; --accent-dim:#4dbf78; --accent-rgb:142,239,176; --brand:#3dcc6e; --brand-rgb:61,204,110; --brand-soft:#9af0b8; --vp-nf-bg:#0b1610; }
html.vp-theme-blue-green { --bg:#081414; --surface:#102022; --border:#24484a; --accent:#7eefe6; --accent-dim:#3cbcb2; --accent-rgb:126,239,230; --brand:#20c4b0; --brand-rgb:32,196,176; --brand-soft:#8af0e4; --vp-nf-bg:#0b1616; }
html.vp-theme-blue { --bg:#081018; --surface:#101a28; --border:#243a55; --accent:#8ec8ff; --accent-dim:#4a90d8; --accent-rgb:142,200,255; --brand:#1e90ff; --brand-rgb:30,144,255; --brand-soft:#9fd4ff; --vp-nf-bg:#0b1218; }
html.vp-theme-blue-indigo { --bg:#0a0e1a; --surface:#141a2c; --border:#2c3658; --accent:#9ab6ff; --accent-dim:#5c78e0; --accent-rgb:154,182,255; --brand:#4b6fff; --brand-rgb:75,111,255; --brand-soft:#adc2ff; --vp-nf-bg:#0d1220; }
html.vp-theme-indigo { --bg:#0d0c1a; --surface:#18162c; --border:#322e58; --accent:#b4a8ff; --accent-dim:#7a6ce0; --accent-rgb:180,168,255; --brand:#5b4bff; --brand-rgb:91,75,255; --brand-soft:#c2b8ff; --vp-nf-bg:#100f1c; }
html.vp-theme-indigo-violet { --bg:#120c1a; --surface:#1e162c; --border:#3e2e58; --accent:#c8a8ff; --accent-dim:#966ce0; --accent-rgb:200,168,255; --brand:#7a3dff; --brand-rgb:122,61,255; --brand-soft:#d2b8ff; --vp-nf-bg:#140f1c; }
html.vp-theme-violet { --bg:#140c18; --surface:#22162a; --border:#442e52; --accent:#d8a8ff; --accent-dim:#a66ce0; --accent-rgb:216,168,255; --brand:#9b3dff; --brand-rgb:155,61,255; --brand-soft:#e0b8ff; --vp-nf-bg:#160f1a; }
html.vp-theme-pussy-pink { --bg:#170d12; --surface:#271820; --border:#4d3340; --accent:#ff8ec8; --accent-dim:#e56aa8; --accent-rgb:255,142,200; --brand:#ff5fa8; --brand-rgb:255,95,168; --brand-soft:#ffb7d9; --vp-nf-bg:#1a1016; }
html.vp-theme-baby-pink,
html.vp-theme-baby-pink-jade { --bg:#161012; --surface:#24181d; --border:#4a3840; --accent:#f7c6d2; --accent-dim:#c98ea0; --accent-rgb:247,198,210; --brand:#e8a0b4; --brand-rgb:232,160,180; --brand-soft:#f6d4de; --vp-nf-bg:#181114; }
html.vp-theme-sirius-black { --bg:#000000; --surface:#121212; --border:#2e2e2e; --accent:#d0d0d0; --accent-dim:#8d8d8d; --accent-rgb:208,208,208; --brand:#cfcfcf; --brand-rgb:207,207,207; --brand-soft:#b8b8b8; --vp-nf-bg:#050505; }
html.vp-theme-with-great-power { --bg:#0c1018; --surface:#161c28; --border:#2a3a58; --accent:#4a7cff; --accent-dim:#2f5ad0; --accent-rgb:74,124,255; --brand:#e11d2e; --brand-rgb:225,29,46; --brand-soft:#ff8a94; --vp-nf-bg:#0a0e16; }
html.vp-theme-i-am-iron-man { --bg:#120a08; --surface:#221410; --border:#4d3224; --accent:#e23d3d; --accent-dim:#b42a2a; --accent-rgb:226,61,61; --brand:#d4a017; --brand-rgb:212,160,23; --brand-soft:#f0d48a; --vp-nf-bg:#140c08; }
html.vp-theme-holy-hex-codes { --bg:#0a0a0a; --surface:#161616; --border:#3a3a22; --accent:#ffe566; --accent-dim:#c9b12a; --accent-rgb:255,229,102; --brand:#f4d03f; --brand-rgb:244,208,63; --brand-soft:#ffe566; --vp-nf-bg:#080808; }
html.vp-theme-up-up-and-away { --bg:#081018; --surface:#101c2c; --border:#2a4060; --accent:#e3232b; --accent-dim:#b41c22; --accent-rgb:227,35,43; --brand:#1c4fd8; --brand-rgb:28,79,216; --brand-soft:#f5d76e; --vp-nf-bg:#0a121c; }
html.vp-theme-mischief-managed { --bg:#140a0c; --surface:#241418; --border:#4d2e24; --accent:#8b1e3f; --accent-dim:#6a1730; --accent-rgb:139,30,63; --brand:#c9a227; --brand-rgb:201,162,39; --brand-soft:#e8d48a; --vp-nf-bg:#160c0e; }
html.vp-theme-meddling-kids { --bg:#0a1410; --surface:#14241c; --border:#2d4a38; --accent:#ff8c1a; --accent-dim:#d06e10; --accent-rgb:255,140,26; --brand:#2eb87a; --brand-rgb:46,184,122; --brand-soft:#8aefc0; --vp-nf-bg:#0c1612; }
html.vp-theme-arent-the-hexes { --bg:#05060a; --surface:#10141c; --border:#1e3a55; --accent:#5eb4ff; --accent-dim:#2e7ad0; --accent-rgb:94,180,255; --brand:#2e96ff; --brand-rgb:46,150,255; --brand-soft:#9fd4ff; --vp-nf-bg:#06080e; }
html.vp-theme-lack-of-theme { --bg:#0a0505; --surface:#1a1010; --border:#4a2020; --accent:#ff4d4d; --accent-dim:#c42a2a; --accent-rgb:255,77,77; --brand:#e32636; --brand-rgb:227,38,54; --brand-soft:#ff8a90; --vp-nf-bg:#0c0606; }
html.vp-theme-make-it-so { --bg:#080c14; --surface:#101828; --border:#2a3850; --accent:#4a7cff; --accent-dim:#2f5ad0; --accent-rgb:74,124,255; --brand:#d4a84b; --brand-rgb:212,168,75; --brand-soft:#f0d48a; --vp-nf-bg:#0a1018; }
html.vp-theme-you-shall-not-pass { --bg:#101010; --surface:#1c1c1c; --border:#4a3828; --accent:#ffb347; --accent-dim:#d8882a; --accent-rgb:255,179,71; --brand:#ff6a1a; --brand-rgb:255,106,26; --brand-soft:#ffb07a; --vp-nf-bg:#121212; }
html.vp-theme-who-you-gonna-call { --bg:#12100c; --surface:#221e16; --border:#4a4030; --accent:#c4b07a; --accent-dim:#9a8858; --accent-rgb:196,176,122; --brand:#e23b2e; --brand-rgb:226,59,46; --brand-soft:#f0c48a; --vp-nf-bg:#14120e; }
html.vp-theme-cowabunga { --bg:#0a140c; --surface:#142018; --border:#2a4830; --accent:#ff7a1a; --accent-dim:#d06010; --accent-rgb:255,122,26; --brand:#3d9b4a; --brand-rgb:61,155,74; --brand-soft:#8aef9a; --vp-nf-bg:#0c160e; }
html.vp-theme-hades-of-the-underworld {
  --bg:#070506;
  --surface:#141010;
  --border:#3a2a26;
  --accent:#e4c9a0;
  --accent-dim:#a88862;
  --accent-rgb:228,201,160;
  --brand:#c4452d;
  --brand-rgb:196,69,45;
  --brand-soft:#e8c4a8;
  --vp-nf-bg:#080607;
}

* { box-sizing: border-box; }

html, body {
  min-height: 100%;
}

body {
  margin: 0;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: "VaultPlayerFont", system-ui, "Segoe UI", Roboto, sans-serif;
  background: var(--bg);
  color: var(--text);
  line-height: 1.45;
}

html.vp-has-color-theme body {
  background:
    radial-gradient(circle at 50% 0%, rgba(var(--brand-rgb), 0.18), transparent 28rem),
    var(--bg);
}

@media (min-width: 640px) {
  html.vp-has-color-theme body {
    background: var(--vp-nf-bg) !important;
  }
}

html.vp-theme-hades-of-the-underworld body {
  background-color: var(--bg) !important;
  background-image:
    radial-gradient(ellipse at 50% 118%, rgba(196,69,45,0.22), transparent 44%),
    radial-gradient(ellipse at 16% -10%, rgba(70,60,68,0.3), transparent 40%) !important;
  background-repeat: no-repeat !important;
}

html.vp-font-jayscript {
  font-size: 128%;
}

html.vp-font-jayscript,
html.vp-font-jayscript body {
  font-family: "Jayscript", "VaultPlayerFont", system-ui, "Segoe UI", Roboto, sans-serif !important;
  line-height: 1.55;
}

.wrap {
  flex: 1 0 auto;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  padding: 1.25rem 1rem 2rem;
}

@media (max-width: 639px) {
  .wrap {
    padding-left: 1.35rem;
    padding-right: 1.35rem;
  }
}

.legal-home {
  display: block;
  text-decoration: none;
}

.logo {
  display: block;
  margin: 0 auto 1rem;
  max-width: 240px;
  height: auto;
  opacity: 0;
  transform: translateY(10px) scale(0.98);
  animation: logoFadeIn 0.65s ease forwards;
  transition: transform 0.2s ease;
}

.legal-home:hover .logo {
  transform: scale(1.02);
}

@keyframes logoFadeIn {
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

img.vp-logo-court {
  display: none !important;
}

html.vp-court-brand img.logo,
html.vp-pink-logos img.logo {
  mix-blend-mode: screen;
}

html.vp-court-brand img.vp-logo-default,
html.vp-pink-logos img.vp-logo-default {
  display: none !important;
}

html.vp-court-brand img.vp-logo-court,
html.vp-pink-logos img.vp-logo-court {
  display: block !important;
}

.legal-nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.35rem 0.85rem;
  margin: 0 0 1.5rem;
  font-size: 0.78rem;
}

.legal-nav a {
  color: var(--muted);
  text-decoration: none;
}

.legal-nav a:hover {
  color: var(--text);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.legal-nav a[aria-current="page"] {
  color: var(--accent);
  font-weight: 600;
}

.legal-main h1 {
  margin: 0 0 0.35rem;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.25;
  color: var(--text);
  text-align: center;
}

.legal-updated {
  margin: 0 0 1.5rem;
  color: var(--muted);
  font-size: 0.88rem;
  text-align: center;
}

.legal-main h2 {
  margin: 1.75rem 0 0.5rem;
  font-size: 1.05rem;
  font-weight: 600;
  letter-spacing: -0.01em;
}

.legal-main p,
.legal-main li {
  color: var(--text);
  font-size: 0.95rem;
}

.legal-main p {
  margin: 0 0 1rem;
}

.legal-main a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.legal-main a:hover {
  color: var(--text);
}

.legal-main ul {
  margin: 0.5rem 0 1rem;
  padding-left: 1.25rem;
}

.legal-main li { margin: 0.35rem 0; }

.legal-box {
  margin: 1.25rem 0;
  padding: 1rem 1.1rem;
  border: 1px solid var(--border);
  background: var(--surface);
  border-radius: 10px;
}

.contact-email {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.92rem;
  word-break: break-all;
}

.footer {
  flex-shrink: 0;
  margin-top: 2rem;
  padding: 1rem;
  border-top: 1px solid var(--border);
  background: var(--bg);
}

.footer-inner {
  max-width: 1100px;
  margin: 0 auto;
  text-align: center;
}

.footer p {
  margin: 0;
  font-size: 0.75rem;
  color: var(--muted);
  line-height: 1.4;
}

.footer a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.footer a:hover {
  color: var(--text);
}

.footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.35rem 0.85rem;
  margin: 0 0 0.85rem;
  font-size: 0.78rem;
}

.footer-links a {
  color: var(--muted);
  text-decoration: none;
}

.footer-links a:hover {
  color: var(--text);
  text-decoration: underline;
}

.footer-links a[aria-current="page"] {
  color: var(--text);
}

.footer-operator {
  margin: 0 0 0.65rem;
}

.sync-stack {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.legal-main ul.sync-benefits,
.sync-benefits {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.7rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.sync-benefits li {
  margin: 0;
  padding: 0.9rem 1rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}

.sync-benefits strong {
  display: block;
  margin: 0 0 0.25rem;
  color: var(--text);
}

.sync-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.86em;
}

.sync-panel {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  margin: 1.25rem 0 0;
  padding: 0.9rem 1rem 1.05rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  box-sizing: border-box;
}

.sync-panel h2 {
  margin-top: 0;
}

.sync-form {
  display: grid;
  gap: 0.45rem;
}

.sync-label {
  font-size: 0.86rem;
  color: var(--muted);
}

.sync-input {
  width: 100%;
  padding: 0.75rem 0.85rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg);
  color: var(--text);
  font: inherit;
}

.sync-input:focus {
  outline: 2px solid rgba(var(--brand-rgb), 0.45);
  outline-offset: 1px;
}

.sync-submit {
  margin-top: 0.35rem;
  padding: 0.8rem 1rem;
  border: 0;
  border-radius: 10px;
  background: var(--brand);
  color: #fff;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.sync-submit:hover {
  filter: brightness(1.08);
}

.sync-submit:disabled {
  opacity: 0.65;
  cursor: wait;
}

a.sync-submit--link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  color: #fff;
}

.sync-signed-in-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: center;
  width: 100%;
  min-width: 0;
}

.sync-signed-in-actions > * {
  min-width: 0;
  max-width: 100%;
}

.sync-signout {
  padding: 0.75rem 0.2rem;
  border: 0;
  background: none;
  color: var(--muted);
  font: inherit;
  font-weight: 650;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 0.14em;
}

.sync-signout:hover {
  color: var(--text);
}

.sync-status {
  margin: 0.85rem 0 0;
  font-size: 0.92rem;
}

.sync-status.is-error {
  color: #ff8b8b;
}

.sync-status.is-success {
  color: #6ee7a8;
}

.sync-pair {
  margin: 0 0 1.15rem;
  padding: 0.95rem 1rem 1.05rem;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: color-mix(in srgb, var(--brand) 10%, var(--bg));
}

.sync-pair h3 {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
}

.sync-pair-copy {
  margin: 0 0 0.75rem;
  color: var(--muted);
  font-size: 0.95rem;
}

.sync-pair-code {
  display: flex;
  justify-content: center;
  margin: 0 0 0.55rem;
  letter-spacing: 0.18em;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: clamp(2.1rem, 8vw, 3.2rem);
  font-weight: 800;
  line-height: 1.1;
}

.sync-pair-meta {
  margin: 0 0 0.75rem;
  color: var(--muted);
  font-size: 0.9rem;
  text-align: center;
}

.sync-pair-refresh {
  display: block;
  width: 100%;
  padding: 0.7rem 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-weight: 650;
  cursor: pointer;
}

.sync-pair-refresh:hover {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border));
}

.sync-pair-refresh:disabled {
  opacity: 0.65;
  cursor: wait;
}

.sync-tv-home,
.sync-tv-lead {
  display: none;
}

html.vp-sync-tv,
html.vp-sync-tv body {
  height: 100%;
  overflow: auto;
  scroll-padding-top: 1.25rem;
  scroll-padding-bottom: 1.25rem;
}

html.vp-sync-tv .sync-tv-home {
  display: flex;
  align-items: center;
  justify-content: center;
  position: sticky;
  top: 0;
  z-index: 6;
  min-height: 3.6rem;
  margin: 0;
  padding: 0.85rem 1.25rem;
  background: color-mix(in srgb, var(--brand) 88%, #000);
  color: #fff;
  font-size: 1.2rem;
  font-weight: 800;
  text-decoration: none;
  letter-spacing: 0.01em;
}

html.vp-sync-tv .legal-home,
html.vp-sync-tv .legal-nav,
html.vp-sync-tv .sync-benefits,
html.vp-sync-tv .sync-web-copy,
html.vp-sync-tv .legal-updated,
html.vp-sync-tv .footer {
  display: none !important;
}

html.vp-sync-tv .sync-tv-lead {
  display: block;
  margin: 0 0 1rem;
  color: var(--muted);
  font-size: 1.15rem;
  line-height: 1.4;
  text-align: left;
}

html.vp-sync-tv .wrap {
  max-width: none;
  padding: 1.1rem 2rem 3rem;
}

html.vp-sync-tv .legal-main h1 {
  font-size: 2rem;
  text-align: left;
}

html.vp-sync-tv .sync-panel {
  margin-top: 0.6rem;
  padding: 1.1rem 1.2rem 1.3rem;
}

html.vp-sync-tv .sync-input,
html.vp-sync-tv .sync-submit,
html.vp-sync-tv .sync-pair-refresh,
html.vp-sync-tv .sync-signout {
  min-height: 3.6rem;
  font-size: 1.2rem;
}

html.vp-sync-tv .sync-signout {
  padding: 0.85rem 1rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  text-decoration: none;
  color: var(--text);
  background: var(--bg);
}

html.vp-sync-tv .sync-pair-code {
  min-height: 4.2rem;
  align-items: center;
  font-size: clamp(2.4rem, 9vw, 4rem);
}

html.vp-sync-tv .sync-signed-in-actions {
  display: grid;
  gap: 0.75rem;
}

html.vp-sync-tv [data-tv-focus] {
  scroll-margin-top: 4.4rem;
  scroll-margin-bottom: 1.5rem;
}

html.vp-sync-tv [data-tv-focus]:focus {
  outline: 3px solid #fff;
  outline-offset: 4px;
  box-shadow: 0 0 0 6px rgba(var(--brand-rgb), 0.5);
}
