/* Minecraft font by IdreesInc (SIL OFL 1.1) - https://github.com/IdreesInc/Minecraft-Font
   Files live in assets/fonts/. Regular covers weights up to 500, Bold covers 600+. */
@font-face {
  font-family: 'Minecraft';
  src: url('assets/fonts/Minecraft.otf') format('opentype');
  font-weight: 100 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Minecraft';
  src: url('assets/fonts/Minecraft-Bold.otf') format('opentype');
  font-weight: 600 900;
  font-style: normal;
  font-display: swap;
}

/* Applies the font everywhere. The ":not(#mc-font)" is deliberate: it raises specificity above any
   per-class font-family rule further down, so nothing has to be edited one by one. If the font files
   are missing, the browser falls back to the old Inter stack. */
html body *:not(#mc-font),
html body *:not(#mc-font)::before,
html body *:not(#mc-font)::after,
html body {
  font-family: 'Minecraft', 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

:root {
  --bg: #05080d;
  --panel: #0c121b;
  --panel-glass: rgba(12, 18, 27, .62);
  --panel-border: rgba(163, 205, 228, .18);
  --panel-border-soft: rgba(163, 205, 228, .12);
  --text: #eef3f8;
  --text-dim: #9aaabd;
  --text-faint: #64758a;
  --cyan: #4c9df0;
  --cyan-bright: #4c9df0;
  --blue: #4c9df0;
  --green: #38d68a;
  --red: #f0555f;
  --purple: #8b5cf6;
  --radius-lg: 14px;
  --radius-md: 9px;
  --radius-sm: 6px;
  --mx: 0px;
  --my: 0px;
}

* { box-sizing: border-box; }
html { color-scheme: dark; scroll-behavior: smooth; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }
.lenis.lenis-smooth iframe { pointer-events: none; }
body {
  margin: 0;
  background-color: var(--bg);
  background-image: linear-gradient(rgba(76,157,240,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(76,157,240,.035) 1px, transparent 1px);
  background-size: 32px 32px;
  color: var(--text);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  -webkit-font-smoothing: antialiased;
  position: relative;
  min-height: 100vh;
  overflow-x: hidden;
}

.bg-glow { position: fixed; top: -10%; left: 50%; transform: translateX(calc(-50% + var(--mx))) translateY(var(--my)); width: 900px; height: 700px; background: radial-gradient(ellipse at center, rgba(76,157,240,.14), rgba(47,111,237,.06) 42%, transparent 70%); pointer-events: none; z-index: 0; transition: transform .35s ease-out; }
.bg-orbs { position: fixed; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.orb { position: absolute; width: clamp(240px, 32vw, 560px); aspect-ratio: 1; border-radius: 50%; filter: blur(70px); opacity: .3; will-change: transform; }
.orb-cyan { background: #18c8ef; left: -10%; top: 8%; animation: drift-a 34s ease-in-out infinite alternate; }
.orb-blue { background: #2864ef; right: -12%; top: 25%; animation: drift-b 46s ease-in-out infinite alternate; }
.orb-cyan-small { width: clamp(180px, 25vw, 420px); background: #4c9df0; left: 32%; bottom: -18%; opacity: .22; animation: drift-c 27s ease-in-out infinite alternate; }
.orb-purple { width: clamp(170px, 22vw, 360px); background: #8556d8; right: 22%; top: 52%; opacity: .13; animation: drift-d 58s ease-in-out infinite alternate; }
@keyframes drift-a { to { transform: translate(12vw, 8vh) scale(1.08); } }
@keyframes drift-b { to { transform: translate(-10vw, 12vh) scale(.92); } }
@keyframes drift-c { to { transform: translate(8vw, -12vh) scale(1.12); } }
@keyframes drift-d { to { transform: translate(-9vw, 10vh) scale(1.1); } }
.bg-grain { position: fixed; inset: 0; z-index: 3; pointer-events: none; opacity: .035; mix-blend-mode: overlay; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }

.wrap { position: relative; z-index: 1; max-width: 940px; margin: 0 auto; padding: 54px 24px 48px; }
.js main.wrap { opacity: 0; transform: translateY(10px); transition: opacity .28s ease, transform .32s ease; }
.js main.wrap.page-ready { opacity: 1; transform: translateY(0); }
.js main.wrap.page-exit { opacity: 0; transform: translateY(-10px); transition: opacity .2s ease, transform .2s ease; }

.navbar { position: sticky; top: 12px; z-index: 20; max-width: 940px; margin: 12px auto 0; padding: 0 24px; }
.navbar-inner { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 11px 14px; border: 1px solid rgba(163,205,228,.22); border-radius: 14px; background: rgba(12,18,27,.7); box-shadow: 0 12px 35px rgba(0,0,0,.25), 0 0 28px rgba(76,157,240,.08); backdrop-filter: blur(20px) saturate(160%); -webkit-backdrop-filter: blur(20px) saturate(160%); }
.navbar-inner::before, .glass::before, .card::before, .join-box::before, .trailer-box::before, .changelog-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 1px; background: linear-gradient(90deg, transparent, rgba(255,255,255,.55), rgba(76,157,240,.5), transparent); opacity: .75; pointer-events: none; }
.navbar-brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--text); }
.navbar-icon { width:26px; filter:drop-shadow(0 0 10px rgba(76,157,240,.45)); transition:filter .3s ease; }
.navbar-brand:hover .navbar-icon { filter:drop-shadow(0 0 16px rgba(76,157,240,.75)); }
.navbar-brand-text { font-size:16px; font-weight:800; letter-spacing:-.01em; }
.navbar-links { display:flex; align-items:center; gap:3px; }
.navbar-link { padding:8px 11px; color:var(--text-dim); font-size:14px; font-weight:600; text-decoration:none; border-radius:8px; transition:color .2s ease, background .2s ease; }
.navbar-link:hover { color:var(--text); background:rgba(255,255,255,.06); }
.navbar-link.active { color:var(--cyan-bright); background:rgba(76,157,240,.1); }

.hero { text-align:center; margin: 34px 0 46px; }
.hero-logo { width:min(560px,92%); height:auto; filter:drop-shadow(0 0 42px rgba(76,157,240,.35)); transition:transform .35s ease, filter .35s ease; cursor:pointer; animation: hero-float 6s ease-in-out infinite; }
.hero-logo:hover, .hero-logo:focus-visible { filter:drop-shadow(0 0 70px rgba(76,157,240,.75)) drop-shadow(0 0 110px rgba(76,157,240,.4)); }
@keyframes hero-float { 0%,100% { translate:0 0; } 50% { translate:0 -7px; } }
.hero-tagline { margin:18px 0 16px; color:var(--text-dim); font-size:17px; font-weight:500; letter-spacing:.01em; }
.copy-address { position:relative; display:inline-flex; align-items:center; gap:9px; padding:10px 17px; border:1px solid rgba(76,157,240,.42); border-radius:999px; color:var(--cyan-bright); background:rgba(12,18,27,.58); box-shadow:0 0 24px rgba(76,157,240,.16), inset 0 1px rgba(255,255,255,.35); backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%); cursor:pointer; font:600 13px Inter,sans-serif; transition:transform .2s ease, box-shadow .2s ease; }
.copy-address::before { content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1px; background:conic-gradient(from 0deg, transparent, rgba(76,157,240,.9), transparent 30%, rgba(47,111,237,.8), transparent 60%); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:spin-border 7s linear infinite; pointer-events:none; }
.copy-address::after { content:""; position:absolute; inset:1px 18% auto; height:1px; background:rgba(255,255,255,.65); filter:blur(.5px); }
.copy-address svg { width:15px; height:15px; }
@keyframes spin-border { to { transform:rotate(360deg); } }

.grid { display:grid; grid-template-columns:1fr 1.05fr 1fr; gap:18px; margin-bottom:22px; }
.card, .join-box, .trailer-box, .changelog-card { position:relative; overflow:hidden; background:rgba(12,18,27,.62); border:1px solid var(--panel-border); border-top-color:rgba(224,247,255,.34); border-radius:var(--radius-lg); box-shadow:0 16px 38px rgba(0,0,0,.22), 0 0 25px rgba(76,157,240,.08), inset 0 1px rgba(255,255,255,.08); backdrop-filter:blur(20px) saturate(160%); -webkit-backdrop-filter:blur(20px) saturate(160%); }
.card::after, .join-box::after, .trailer-box::after, .changelog-card::after { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at var(--spot-x,50%) var(--spot-y,0%), rgba(255,255,255,.15), rgba(76,157,240,.06) 16%, transparent 42%); opacity:0; transition:opacity .35s ease; }
.card { padding:26px 24px; display:flex; flex-direction:column; transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--scale,1)); transition:transform .45s cubic-bezier(.2,.8,.2,1), border-color .2s ease, box-shadow .25s ease; }
.card-featured { padding:0; cursor:pointer; text-align:left; min-height:220px; }
.card-featured img { width:100%; height:100%; object-fit:cover; display:block; border-radius:inherit; }
.card-title { font-size:19px; font-weight:700; margin:14px 0 0; }
.card-caption { margin:12px 0 0; font-size:13px; color:var(--text-faint); }
.card-ip { align-items:center; justify-content:center; padding:0 0 16px; min-height:220px; }
.d-icon { width:60%; max-width:220px; filter:drop-shadow(0 0 24px rgba(76,157,240,.5)); }
.status-pill, .field { background:rgba(5,10,16,.52); }
.status-pill { display:inline-flex; align-items:center; gap:9px; margin-top:6px; border:1px solid var(--panel-border-soft); border-radius:var(--radius-md); padding:9px 16px; font-size:13px; font-weight:600; color:var(--text-dim); }
.status-dot { width:8px; height:8px; border-radius:50%; background:var(--text-faint); flex-shrink:0; }
.status-dot.online { background:var(--green); box-shadow:0 0 8px rgba(56,214,138,.7); }
.status-dot.offline { background:var(--red); box-shadow:0 0 8px rgba(240,85,95,.6); }
.status-dot.pulse { animation:status-pulse 1.4s ease-in-out infinite; }
@keyframes status-pulse { 0%,100%{opacity:1} 50%{opacity:.35} }

.lightbox { position:fixed; inset:0; z-index:50; background:rgba(3,6,10,.92); display:none; align-items:center; justify-content:center; padding:32px; }
.lightbox:not([hidden]) { display:flex; }
.lightbox-img { max-width:100%; max-height:100%; border-radius:var(--radius-md); box-shadow:0 20px 60px -20px #000; }
.lightbox-close { position:absolute; top:20px; right:20px; width:40px; height:40px; border-radius:50%; border:1px solid var(--panel-border-soft); background:var(--panel); color:var(--text); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.lightbox-close svg { width:18px; height:18px; }

.join-box { padding:28px 28px 30px; margin-bottom:22px; transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--scale,1)); transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease; }
.join-title, .trailer-title { margin:0; font-size:21px; font-weight:700; display:flex; align-items:center; gap:10px; }
.join-title::before, .trailer-title::before, .page-title::before { content:""; display:inline-block; width:9px; height:9px; flex-shrink:0; background:linear-gradient(135deg,var(--cyan-bright),var(--blue)); transform:rotate(45deg); border-radius:2px; }
.join-subtitle { margin:6px 0 22px; color:var(--text-faint); font-size:14px; }
.join-fields { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; }
.field { position:relative; overflow:hidden; border:1px solid var(--panel-border-soft); border-radius:var(--radius-md); padding:13px 16px; display:flex; flex-direction:column; gap:5px; justify-content:center; transform:perspective(800px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--scale,1)); transition:transform .4s ease, border-color .2s ease, box-shadow .2s ease; }
.field-copy { flex-direction:row; align-items:center; justify-content:space-between; gap:10px; }
.field-copy-text { display:flex; flex-direction:column; gap:5px; min-width:0; }
.field-label { font-size:11px; font-weight:700; letter-spacing:.06em; color:var(--text-faint); text-transform:uppercase; }
.field-value { font-size:15px; font-weight:600; color:var(--text); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.copy-btn { flex-shrink:0; width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; background:transparent; border:1px solid var(--panel-border-soft); border-radius:var(--radius-sm); color:var(--text-dim); cursor:pointer; }
.copy-btn svg { width:15px; height:15px; }

.trailer-box { padding:26px 26px 28px; margin-bottom:40px; transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--scale,1)); transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease; }
.trailer-head { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:18px; flex-wrap:wrap; }
.trailer-eyebrow { display:flex; align-items:center; gap:7px; margin:0; color:var(--cyan); font-size:13px; font-weight:700; }
.trailer-eyebrow svg { width:13px; height:13px; }
.trailer-title { margin-top:6px; }
.trailer-link { display:inline-flex; align-items:center; gap:6px; color:var(--text-dim); font-size:14px; font-weight:600; text-decoration:none; }
.trailer-link:hover { color:var(--cyan-bright); }
.trailer-link svg { width:14px; height:14px; }
.trailer-frame { position:relative; width:100%; aspect-ratio:16/9; border-radius:var(--radius-md); overflow:hidden; border:1px solid var(--panel-border-soft); background:#000; }
.trailer-frame iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }

.page-hero { text-align:center; margin:34px 0 30px; }
.page-title { margin:0; display:inline-flex; align-items:center; gap:13px; font-size:32px; font-weight:800; letter-spacing:-.02em; }
.page-title::before { width:13px; height:13px; }
.page-subtitle { margin:10px auto 0; color:var(--text-dim); font-size:15px; }
.changelog-toolbar { display:flex; justify-content:flex-end; margin-bottom:16px; }
.toggle-all-btn { display:inline-flex; align-items:center; gap:8px; background:rgba(12,18,27,.62); border:1px solid var(--panel-border); color:var(--text-dim); font:600 13px Inter,sans-serif; padding:9px 16px; border-radius:var(--radius-md); cursor:pointer; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.toggle-all-btn:hover { border-color:rgba(76,157,240,.5); color:var(--cyan-bright); }
.toggle-all-btn .chevron { width:14px; height:14px; transition:transform .3s ease; }
.changelog-list { display:flex; flex-direction:column; gap:16px; margin-bottom:44px; }
.changelog-card { transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) scale(var(--scale,1)); transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease; }
.changelog-header { position:relative; z-index:1; width:100%; display:flex; align-items:center; justify-content:space-between; gap:14px; padding:20px 24px; background:none; border:0; cursor:pointer; text-align:left; color:inherit; font-family:inherit; }
.changelog-header-left { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.changelog-version { font-size:17px; font-weight:800; }
.changelog-badge-latest { display:inline-flex; background:rgba(76,157,240,.14); border:1px solid rgba(76,157,240,.5); color:var(--cyan-bright); font-size:10.5px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; padding:2px 8px; border-radius:var(--radius-sm); }
.changelog-date { font-size:13px; color:var(--text-faint); font-weight:500; }
.chevron { width:18px; height:18px; flex-shrink:0; color:var(--text-faint); transition:transform .35s ease,color .35s ease; }
.changelog-card.open .chevron { transform:rotate(180deg); color:var(--cyan-bright); }
.changelog-body-wrap { display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s ease; position:relative; z-index:1; }
.changelog-card.open .changelog-body-wrap { grid-template-rows:1fr; }
.changelog-body-inner { overflow:hidden; min-height:0; }
.changelog-body { padding:20px 24px 24px; margin-top:2px; border-top:1px solid var(--panel-border-soft); display:grid; grid-template-columns:1fr 1fr; gap:20px 30px; }
.changelog-category h3 { display:flex; align-items:center; gap:8px; margin:0 0 10px; font-size:12.5px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--text-dim); }
.cat-dot { width:8px; height:8px; border-radius:2px; transform:rotate(45deg); flex-shrink:0; background:linear-gradient(135deg,var(--cyan-bright),var(--blue)); }
.cat-new .cat-dot { background:linear-gradient(135deg,#8dffcf,var(--green)); } .cat-fix .cat-dot { background:linear-gradient(135deg,#ff9aa1,var(--red)); } .cat-perf .cat-dot { background:linear-gradient(135deg,var(--cyan-bright),var(--cyan)); }
.changelog-category ul { margin:0; padding:0; list-style:none; display:flex; flex-direction:column; gap:8px; }
.changelog-category li { position:relative; padding-left:15px; font-size:14px; line-height:1.5; color:var(--text); }
.changelog-category li::before { content:""; position:absolute; left:0; top:8px; width:5px; height:5px; border-radius:50%; background:var(--text-faint); }
.tag-new { display:inline-flex; margin-left:7px; background:rgba(56,214,138,.12); border:1px solid rgba(56,214,138,.5); color:var(--green); font-size:10px; font-weight:800; padding:1px 6px; border-radius:var(--radius-sm); }
.site-footer { text-align:center; padding-top:8px; }
.footer-links { display:flex; justify-content:center; align-items:center; gap:10px; margin-bottom:10px; }
.footer-links a { color:var(--text-dim); font-size:14px; font-weight:600; text-decoration:none; } .footer-links a:hover { color:var(--cyan-bright); } .footer-links .dot { color:var(--text-faint); }
.footer-fine { margin:0; color:var(--text-faint); font-size:12.5px; }
.toast { position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(20px); background:rgba(16,24,34,.82); border:1px solid rgba(76,157,240,.35); color:var(--cyan-bright); font-size:13px; font-weight:600; padding:10px 18px; border-radius:var(--radius-md); opacity:0; pointer-events:none; transition:opacity .2s ease,transform .2s ease; z-index:60; backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

@supports not ((backdrop-filter: blur(20px))) { .navbar-inner, .copy-address, .card, .join-box, .trailer-box, .changelog-card, .toggle-all-btn, .toast { background:var(--panel); } }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) { .card:hover, .join-box:hover, .trailer-box:hover, .changelog-card:hover { --scale:1.02; border-color:rgba(76,157,240,.42); box-shadow:0 20px 50px rgba(0,0,0,.3), 0 0 34px rgba(76,157,240,.18), inset 0 1px rgba(255,255,255,.22); } .card:hover::after, .join-box:hover::after, .trailer-box:hover::after, .changelog-card:hover::after { opacity:1; } .field:hover { border-color:rgba(76,157,240,.45); box-shadow:0 0 18px rgba(76,157,240,.16); } }
@media (max-width:820px) { .grid { grid-template-columns:1fr; } .changelog-body { grid-template-columns:1fr; } }
@media (max-width:620px) { .wrap { padding:32px 16px 36px; } .navbar { padding:0 16px; } .navbar-inner { padding:10px 12px; } .navbar-brand-text { font-size:14px; } .navbar-link { padding:7px 9px; font-size:13px; } .join-fields { grid-template-columns:1fr; } .hero { margin-bottom:40px; } .card,.join-box,.trailer-box { padding:22px 20px; } .card-featured { padding:0; } .changelog-header { padding:17px 18px; } .changelog-body { padding:18px 18px 20px; } .changelog-header-left { gap:8px; } .page-title { font-size:27px; } }
@media (prefers-reduced-motion:reduce) { *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.001ms !important; } .bg-orbs { display:none; } .bg-glow { transform:translateX(-50%); } .card,.join-box,.trailer-box,.changelog-card,.field { transform:none !important; } }
@media (pointer:coarse) { .hero-logo { animation:none; } }
:focus-visible { outline:2px solid var(--cyan-bright); outline-offset:3px; }
button { font-family:inherit; }

/* A tiny, low-cost glint layer for the hero mark. */
.hero::after { content:""; position:absolute; pointer-events:none; width:90px; height:2px; left:calc(50% - 170px); top:145px; background:linear-gradient(90deg,transparent,rgba(255,255,255,.85),transparent); transform:rotate(-24deg); filter:blur(.4px); opacity:0; animation:glint 8s 1.4s ease-in-out infinite; }
@keyframes glint { 0%,74%,100% { opacity:0; translate:-120px 15px; } 78% { opacity:.8; } 87% { opacity:0; translate:120px -15px; } }
.hero { position:relative; }
@media (prefers-reduced-motion:reduce) { .hero::after { display:none; } }


/* ---------- Website-level navigation and footer ---------- */
html { scroll-padding-top: 96px; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .38s; }
::view-transition-old(root) { animation-name: page-out; }
::view-transition-new(root) { animation-name: page-in; }
@keyframes page-out { to { opacity: 0; filter: blur(7px); transform: translateY(-8px) scale(.985); } }
@keyframes page-in { from { opacity: 0; filter: blur(7px); transform: translateY(10px) scale(.985); } }

.site-footer { position:relative; margin-top:56px; padding:30px 0 10px; border-top:1px solid rgba(163,205,228,.16); text-align:left; }
.site-footer::before { content:""; position:absolute; top:-1px; left:10%; right:10%; height:1px; background:linear-gradient(90deg,transparent,rgba(76,157,240,.65),transparent); box-shadow:0 0 18px rgba(76,157,240,.5); }
.footer-topline { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-bottom:24px; }
.footer-topline > p { margin:0; color:var(--text-faint); font-size:13px; }
.footer-brand { display:inline-flex; align-items:center; gap:9px; color:var(--text); text-decoration:none; font-weight:800; }
.footer-brand img { width:25px; filter:drop-shadow(0 0 10px rgba(76,157,240,.45)); }
.footer-grid { display:grid; grid-template-columns:1fr 1fr 1.35fr; gap:28px; padding:24px 0; border-top:1px solid rgba(163,205,228,.1); border-bottom:1px solid rgba(163,205,228,.1); }
.footer-grid h2 { margin:0 0 13px; color:var(--text-faint); font-size:11px; font-weight:800; letter-spacing:.09em; text-transform:uppercase; }
.footer-links { display:flex; flex-direction:column; align-items:flex-start; gap:9px; margin:0; }
.footer-links a { color:var(--text-dim); font-size:13px; font-weight:600; text-decoration:none; transition:color .2s ease, transform .2s ease; }
.footer-links a:hover { color:var(--cyan-bright); transform:translateX(3px); }
.footer-address { display:flex; align-items:center; justify-content:space-between; gap:20px; width:100%; max-width:270px; padding:10px 12px; color:var(--cyan-bright); background:rgba(12,18,27,.58); border:1px solid rgba(76,157,240,.24); border-radius:var(--radius-md); font:600 12px Inter,sans-serif; cursor:pointer; }
.footer-address span { color:var(--text-faint); font-size:11px; text-transform:uppercase; letter-spacing:.05em; }
.footer-address:hover { border-color:rgba(76,157,240,.55); box-shadow:0 0 18px rgba(76,157,240,.14); }
.footer-bottom { display:flex; justify-content:space-between; align-items:center; gap:18px; padding-top:18px; }
.back-top { display:inline-flex; align-items:center; gap:8px; color:var(--text-dim); font-size:12px; font-weight:700; text-decoration:none; }
.back-top:hover { color:var(--cyan-bright); }
.back-top span { color:var(--cyan); font-size:16px; }

@media (max-width:620px) {
  .footer-topline, .footer-bottom { align-items:flex-start; flex-direction:column; }
  .footer-topline { gap:10px; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:26px 18px; }
  .footer-join { grid-column:1 / -1; }
  .footer-address { max-width:none; }
}
@media (prefers-reduced-motion:reduce) {
  ::view-transition-old(root), ::view-transition-new(root) { animation:none; }
}

/* The address pill keeps its glass border without the stray solid highlight bar. */
.copy-address::after { display:none; }


/* ---------- Editorial polish ---------- */
/* Less neon, more material contrast: the accent earns attention instead of
   appearing on every surface. */
:root { --panel-glass: rgba(12,18,27,.68); }
.bg-glow { opacity:.72; }
.orb { opacity:.19; filter:blur(84px); }
.orb-purple { opacity:.08; }
.navbar-inner { box-shadow:0 10px 26px rgba(0,0,0,.22); }
.card, .join-box, .trailer-box, .changelog-card { box-shadow:0 14px 30px rgba(0,0,0,.2), 0 0 16px rgba(76,157,240,.055), inset 0 1px rgba(255,255,255,.07); }
.card::after, .join-box::after, .trailer-box::after, .changelog-card::after { background:radial-gradient(circle at var(--spot-x,50%) var(--spot-y,0%), rgba(255,255,255,.1), transparent 36%); }

.reveal-section, .reveal-item { opacity:0; transform:translateY(24px); }
.reveal-section.is-visible, .reveal-item.is-visible { opacity:1; transform:translateY(0); }
.reveal-section { transition:opacity .8s ease, transform .8s cubic-bezier(.2,.75,.2,1); }
.reveal-item { transition:opacity .7s ease, transform .7s cubic-bezier(.2,.75,.2,1); }
.reveal-item:nth-child(2) { transition-delay:.08s; }
.reveal-item:nth-child(3) { transition-delay:.16s; }
.reveal-section + .reveal-section { transition-delay:.08s; }

/* A quiet eyebrow gives the page hierarchy without adding another decorative
   component or a wall of badges. */
.join-box::before, .trailer-box::before, .changelog-card::before { opacity:.48; }
.join-title, .trailer-title, .page-title { letter-spacing:-.025em; }
.join-subtitle, .page-subtitle { max-width:52ch; line-height:1.6; }
.footer-grid h2 { letter-spacing:.13em; }

@media (prefers-reduced-motion:reduce) {
  .reveal-section, .reveal-item, .reveal-section.is-visible, .reveal-item.is-visible { opacity:1; transform:none; transition:none; }
}


/* ---------- Store and policy pages ---------- */
.navbar-link-muted { color:var(--text-faint); font-size:12px; }
.navbar-link-muted:hover { color:var(--text-dim); }
.section-kicker, .eyebrow { margin:0 0 12px; color:var(--cyan); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.store-hero { display:grid; grid-template-columns:minmax(180px,.72fr) 1.28fr; gap:48px; align-items:center; padding:54px 46px; margin-bottom:22px; background:rgba(12,18,27,.68); border:1px solid var(--panel-border); border-top-color:rgba(224,247,255,.34); border-radius:var(--radius-lg); box-shadow:0 18px 42px rgba(0,0,0,.22); backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%); }
.store-copy h2 { max-width:13ch; margin:0; font-size:clamp(30px,5vw,52px); line-height:1.02; letter-spacing:-.055em; }
.store-copy > p:not(.eyebrow) { max-width:48ch; margin:20px 0 0; color:var(--text-dim); line-height:1.7; font-size:15px; }
.store-meta { display:flex; align-items:center; gap:16px; margin-top:26px; color:var(--text-faint); font-size:12px; font-weight:600; }
.status-live { display:inline-flex; align-items:center; gap:7px; color:var(--green); }
.status-live i { width:7px; height:7px; border-radius:50%; background:var(--green); box-shadow:0 0 10px rgba(56,214,138,.6); }
.store-mark { position:relative; width:min(220px,100%); aspect-ratio:1; margin:auto; border:1px solid rgba(76,157,240,.28); border-radius:50%; transform:rotate(-22deg); background:radial-gradient(circle at 34% 30%,rgba(76,157,240,.28),rgba(47,111,237,.1) 42%,transparent 68%); box-shadow:0 0 46px rgba(76,157,240,.16), inset 0 0 32px rgba(76,157,240,.08); }
.store-mark::before, .store-mark::after { content:""; position:absolute; inset:17%; border:1px solid rgba(76,157,240,.24); transform:rotate(45deg); }
.store-mark::after { inset:29%; border-color:rgba(76,157,240,.42); }
.store-mark span { position:absolute; width:7px; height:7px; border-radius:50%; background:var(--cyan-bright); box-shadow:0 0 14px var(--cyan); }
.store-mark span:nth-child(1) { top:16%; left:54%; } .store-mark span:nth-child(2) { bottom:22%; left:19%; background:var(--blue); } .store-mark span:nth-child(3) { right:10%; bottom:35%; background:var(--green); }
.store-notes { display:grid; grid-template-columns:1fr 1fr; gap:1px; margin-bottom:44px; background:rgba(163,205,228,.14); border:1px solid rgba(163,205,228,.14); border-radius:var(--radius-lg); overflow:hidden; }
.store-notes > div { padding:26px 28px; background:rgba(12,18,27,.54); }
.note-number { color:var(--cyan); font:800 11px Inter,sans-serif; letter-spacing:.1em; }
.store-notes h2 { margin:22px 0 9px; font-size:17px; letter-spacing:-.02em; } .store-notes p { margin:0; color:var(--text-dim); font-size:13px; line-height:1.65; }
.legal-wrap { max-width:820px; }
.legal-card { padding:38px clamp(24px,5vw,58px); background:rgba(12,18,27,.68); border:1px solid var(--panel-border); border-top-color:rgba(224,247,255,.3); border-radius:var(--radius-lg); box-shadow:0 18px 42px rgba(0,0,0,.22); }
.legal-updated { margin:0 0 34px; color:var(--cyan); font-size:11px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.legal-card h2 { margin:30px 0 9px; font-size:18px; letter-spacing:-.02em; } .legal-card h2:first-of-type { margin-top:0; }
.legal-card p { margin:0; color:var(--text-dim); font-size:14px; line-height:1.78; } .legal-card a { color:var(--cyan-bright); }
.legal-actions { display:flex; justify-content:space-between; gap:20px; margin:18px 0 44px; } .legal-actions a { color:var(--text-dim); font-size:13px; font-weight:700; text-decoration:none; } .legal-actions a:hover { color:var(--cyan-bright); }
.footer-legal { display:inline-flex; align-items:center; gap:16px; } .footer-legal > a:not(.back-top) { color:var(--text-faint); font-size:12px; font-weight:600; text-decoration:none; } .footer-legal > a:not(.back-top):hover { color:var(--cyan-bright); }

@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .store-hero, .legal-card { transition:transform .45s cubic-bezier(.2,.75,.2,1), border-color .25s ease, box-shadow .3s ease; }
  .store-hero:hover, .legal-card:hover { transform:translateY(-3px); border-color:rgba(76,157,240,.3); box-shadow:0 24px 54px rgba(0,0,0,.27), 0 0 22px rgba(76,157,240,.07); }
  .store-mark { transition:transform .7s cubic-bezier(.2,.8,.2,1); }
  .store-hero:hover .store-mark { transform:rotate(-10deg) scale(1.035); }
}
@media (max-width:820px) { .store-hero { grid-template-columns:1fr; gap:28px; padding:36px 28px; } .store-mark { width:150px; } }
@media (max-width:620px) { .navbar-link-muted { display:none; } .footer-legal { flex-wrap:wrap; gap:12px; } .footer-bottom { gap:12px; } .store-notes { grid-template-columns:1fr; } .legal-actions { flex-direction:column; } }


/* Simple Store page */
.simple-store { max-width:820px; }
.coming-card { position:relative; overflow:hidden; max-width:680px; margin:28px auto 100px; padding:58px clamp(28px,7vw,72px); text-align:center; background:rgba(12,18,27,.68); border:1px solid var(--panel-border); border-top-color:rgba(224,247,255,.34); border-radius:var(--radius-lg); box-shadow:0 18px 42px rgba(0,0,0,.22); backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%); }
.coming-card::before { content:""; position:absolute; inset:0 12% auto; height:1px; background:linear-gradient(90deg,transparent,rgba(76,157,240,.72),transparent); }
.coming-card::after { content:""; position:absolute; width:220px; height:220px; left:50%; top:-150px; transform:translateX(-50%); border-radius:50%; background:rgba(76,157,240,.12); filter:blur(40px); pointer-events:none; }
.coming-card-top { position:relative; z-index:1; display:inline-flex; align-items:center; gap:8px; color:var(--cyan); font-size:11px; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.coming-dot { width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 11px rgba(76,157,240,.65); }
.coming-card h2 { position:relative; z-index:1; margin:25px 0 12px; font-size:clamp(32px,6vw,54px); letter-spacing:-.06em; line-height:1; }
.coming-card p { position:relative; z-index:1; max-width:40ch; margin:0 auto; color:var(--text-dim); font-size:15px; line-height:1.7; }
.coming-link { position:relative; z-index:1; display:inline-flex; align-items:center; gap:8px; margin-top:28px; color:var(--text); font-size:13px; font-weight:700; text-decoration:none; border-bottom:1px solid rgba(76,157,240,.36); padding-bottom:5px; transition:color .2s ease, border-color .2s ease, transform .2s ease; }
.coming-link span { color:var(--cyan); font-size:16px; }
.coming-link:hover { color:var(--cyan-bright); border-color:var(--cyan-bright); transform:translateY(-2px); }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) { .coming-card { transition:transform .5s cubic-bezier(.2,.75,.2,1), box-shadow .3s ease, border-color .25s ease; } .coming-card:hover { transform:translateY(-5px); border-color:rgba(76,157,240,.34); box-shadow:0 26px 58px rgba(0,0,0,.27), 0 0 24px rgba(76,157,240,.08); } }
@media (max-width:620px) { .coming-card { margin-bottom:64px; padding:48px 24px; } }


/* ---------- Anti-template pass ----------
   Keep the dark identity and cyan accent, but remove the visual shortcuts that
   make the site feel generated: no orb field, no dot grid, no universal glass,
   no rainbow borders, and no shadow on every component. */
:root { --radius-lg:8px; --radius-md:6px; --radius-sm:4px; }
html { scroll-behavior:auto; }
body { background-image:none; font-family:ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.bg-glow, .bg-orbs, .bg-grain { display:none; }
.navbar { top:0; margin-top:0; }
.navbar-inner { border-radius:0 0 6px 6px; background:rgba(5,8,13,.96); border-color:rgba(163,205,228,.13); box-shadow:0 4px 12px rgba(0,0,0,.14); backdrop-filter:none; -webkit-backdrop-filter:none; }
.navbar-inner::before, .card::before, .join-box::before, .trailer-box::before, .changelog-card::before { display:none; }
.navbar-link { border-radius:4px; }
.navbar-link:hover { background:rgba(255,255,255,.035); }
.hero-logo { filter:none; animation:none; }
.hero-logo:hover, .hero-logo:focus-visible { filter:none; }
.hero::after { display:none; }
.copy-address { border-radius:5px; background:var(--panel); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.copy-address::before { display:none; }
.card, .join-box, .trailer-box, .changelog-card { background:var(--panel); border-color:var(--panel-border); border-top-color:var(--panel-border); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.card::after, .join-box::after, .trailer-box::after, .changelog-card::after { display:none; }
.d-icon, .navbar-icon, .footer-brand img { filter:none; }
.field, .status-pill { background:#090e15; }
.trailer-frame { box-shadow:none; }
.site-footer::before { display:none; }
.footer-address, .toggle-all-btn, .toast { background:var(--panel); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.store-hero, .legal-card, .coming-card { background:var(--panel); border-color:var(--panel-border); border-top-color:var(--panel-border); box-shadow:none; backdrop-filter:none; -webkit-backdrop-filter:none; }
.store-hero::before, .store-hero::after, .coming-card::before, .coming-card::after, .store-mark { display:none; }
.store-notes { background:var(--panel-border); border-color:var(--panel-border); }
.store-notes > div { background:var(--panel); }
.coming-card-top { color:var(--text-dim); }
.coming-dot { background:var(--text-dim); box-shadow:none; }
.status-live i { box-shadow:none; }

/* Keep interaction, but use one quiet response per element instead of a stack
   of scale, glow, tilt, and sheen effects. */
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .card:hover, .join-box:hover, .trailer-box:hover, .changelog-card:hover { --scale:1; border-color:rgba(76,157,240,.42); box-shadow:none; }
  .field:hover { box-shadow:none; border-color:rgba(76,157,240,.42); }
  .store-hero:hover, .legal-card:hover, .coming-card:hover { transform:translateY(-2px); box-shadow:none; border-color:rgba(76,157,240,.36); }
  .coming-link:hover, .footer-links a:hover { transform:none; }
}
@media (prefers-reduced-motion:reduce) { .store-hero, .legal-card, .coming-card { transform:none !important; } }


/* ---------- Final balance: character without the template overload ---------- */
:root { --radius-lg:12px; --radius-md:8px; --radius-sm:5px; }
body { background:var(--bg); }
.navbar { top:12px; margin-top:12px; }
.navbar-inner { border-radius:12px; background:rgba(12,18,27,.9); box-shadow:0 8px 22px rgba(0,0,0,.2); }
.navbar-link { border-radius:7px; transition:color .22s ease, background-color .22s ease, transform .22s ease; }
.navbar-link:hover { transform:translateY(-1px); background:rgba(76,157,240,.08); }
.navbar-link.active { background:rgba(76,157,240,.1); }
.hero-logo { transition:transform .45s cubic-bezier(.2,.8,.2,1), filter .3s ease; }
.hero-logo:hover, .hero-logo:focus-visible { transform:translateY(-4px) scale(1.025); filter:drop-shadow(0 8px 18px rgba(76,157,240,.22)); }
.copy-address { border-radius:999px; border-color:rgba(76,157,240,.34); transition:transform .25s ease, border-color .25s ease, background-color .25s ease, box-shadow .25s ease; }
.copy-address:hover, .copy-address:focus-visible { transform:translateY(-2px); border-color:rgba(76,157,240,.7); background:#101a25; box-shadow:0 8px 18px rgba(0,0,0,.18); }
.card, .join-box, .trailer-box, .changelog-card { border-radius:12px; transition:transform .38s cubic-bezier(.2,.8,.2,1), border-color .25s ease, box-shadow .3s ease, background-color .25s ease; }
.card-featured { overflow:hidden; }
.card-featured img { transition:transform .6s cubic-bezier(.2,.8,.2,1), filter .4s ease; }
.join-box, .trailer-box { transition:transform .38s cubic-bezier(.2,.8,.2,1), border-color .25s ease, box-shadow .3s ease; }
.field { border-radius:8px; transition:transform .25s ease, border-color .22s ease, background-color .22s ease; }
.copy-btn, .footer-address, .toggle-all-btn { border-radius:7px; transition:transform .22s ease, color .22s ease, border-color .22s ease, background-color .22s ease; }
.copy-btn:hover, .footer-address:hover, .toggle-all-btn:hover { transform:translateY(-2px); background:#101a25; }
.changelog-card { overflow:hidden; }

@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .card:hover, .join-box:hover, .trailer-box:hover, .changelog-card:hover { --scale:1.015; border-color:rgba(76,157,240,.42); box-shadow:0 14px 28px rgba(0,0,0,.2); }
  .card-featured:hover img { transform:scale(1.035); filter:saturate(1.08) contrast(1.03); }
  .field:hover { transform:translateY(-2px); border-color:rgba(76,157,240,.48); background:#0c141e; }
  .footer-links a:hover { transform:translateX(3px); }
  .coming-card:hover { transform:translateY(-4px); box-shadow:0 14px 28px rgba(0,0,0,.2); }
}
@media (prefers-reduced-motion:reduce) {
  .hero-logo, .card, .join-box, .trailer-box, .changelog-card, .field, .card-featured img, .copy-address, .copy-btn, .footer-address, .toggle-all-btn { transition:none; }
}

/* A single quiet tonal shift gives the canvas depth without decorative background art. */
body { background-image:linear-gradient(180deg, #080e16 0%, var(--bg) 34%, var(--bg) 100%); }


/* ---------- Selective atmosphere ---------- */
/* One quiet light source behind the hero adds depth without recreating the
   earlier orb field. */
.bg-glow { display:block; top:-12%; left:50%; width:760px; height:420px; opacity:.34; filter:blur(10px); background:radial-gradient(ellipse at center, rgba(76,157,240,.13) 0%, rgba(47,111,237,.045) 38%, transparent 72%); }
.navbar-inner { background:rgba(12,18,27,.82); backdrop-filter:blur(14px) saturate(125%); -webkit-backdrop-filter:blur(14px) saturate(125%); box-shadow:0 8px 24px rgba(0,0,0,.2), 0 0 18px rgba(76,157,240,.04); }
.card, .join-box, .trailer-box, .changelog-card { background:rgba(12,18,27,.88); }
.join-box, .trailer-box, .coming-card, .legal-card { backdrop-filter:blur(10px) saturate(118%); -webkit-backdrop-filter:blur(10px) saturate(118%); }
.hero-logo { filter:drop-shadow(0 8px 22px rgba(76,157,240,.18)); }
.copy-address { background:rgba(12,18,27,.82); box-shadow:0 0 18px rgba(76,157,240,.08), inset 0 1px rgba(255,255,255,.08); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.status-pill { box-shadow:0 0 14px rgba(76,157,240,.05); }
.footer-address { background:rgba(12,18,27,.78); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }

@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .navbar-link.active { box-shadow:0 0 14px rgba(76,157,240,.1); }
  .card:hover, .join-box:hover, .trailer-box:hover, .changelog-card:hover { box-shadow:0 14px 28px rgba(0,0,0,.2), 0 0 18px rgba(76,157,240,.1); }
  .copy-address:hover, .copy-address:focus-visible { box-shadow:0 8px 18px rgba(0,0,0,.18), 0 0 18px rgba(76,157,240,.14); }
  .footer-address:hover { box-shadow:0 0 16px rgba(76,157,240,.1); }
}
@media (prefers-reduced-motion:reduce) { .bg-glow { display:none; } }
@supports not ((backdrop-filter: blur(10px))) { .navbar-inner, .join-box, .trailer-box, .coming-card, .legal-card, .copy-address, .footer-address { background:var(--panel); } }


/* ---------- Cursor response ---------- */
.cursor-aura { position:fixed; z-index:0; left:-24px; top:-24px; width:48px; height:48px; border-radius:50%; pointer-events:none; opacity:0; background:rgba(76,157,240,.12); filter:blur(14px); transition:opacity .25s ease; will-change:transform; }
.cursor-aura.is-active { opacity:1; }

@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .card::after, .join-box::after, .trailer-box::after, .changelog-card::after { display:block; opacity:0; background:radial-gradient(circle at var(--spot-x,50%) var(--spot-y,50%), rgba(76,157,240,.1), transparent 32%); transition:opacity .3s ease; }
  .card:hover::after, .join-box:hover::after, .trailer-box:hover::after, .changelog-card:hover::after { opacity:1; }
  .navbar-link, .footer-links a, .trailer-link, .legal-actions a, .coming-link { position:relative; }
  .navbar-link::after, .footer-links a::after, .trailer-link::after, .legal-actions a::after, .coming-link::after { content:""; position:absolute; left:0; right:100%; bottom:-3px; height:1px; background:var(--cyan); transition:right .25s ease; }
  .navbar-link::after { bottom:3px; left:10px; right:calc(100% - 10px); }
  .navbar-link:hover::after, .footer-links a:hover::after, .trailer-link:hover::after, .legal-actions a:hover::after, .coming-link:hover::after { right:0; }
  .copy-btn:active, .footer-address:active, .copy-address:active { transform:translateY(0) scale(.97); }
  .d-icon { transition:transform .35s ease, filter .35s ease; }
  .card-ip:hover .d-icon { transform:translateY(-4px) rotate(2deg); filter:drop-shadow(0 8px 18px rgba(76,157,240,.3)); }
}
@media (prefers-reduced-motion:reduce) { .cursor-aura { display:none; } }

.cursor-aura { z-index:2; }


/* ---------- Motion layer ---------- */
@keyframes halo-breathe { 0%,100% { opacity:.24; transform:translateX(-50%) scale(.96); } 50% { opacity:.42; transform:translateX(-50%) scale(1.04); } }
@keyframes nav-arrive { from { opacity:0; transform:translateY(-12px); } to { opacity:1; transform:translateY(0); } }
@keyframes cyan-breathe { 0%,100% { box-shadow:0 0 0 rgba(56,214,138,0); } 50% { box-shadow:0 0 12px rgba(56,214,138,.34); } }
.bg-glow { animation:halo-breathe 8s ease-in-out infinite; }
.navbar { animation:nav-arrive .65s cubic-bezier(.2,.8,.2,1) both; }
.status-dot.online { animation:cyan-breathe 2.4s ease-in-out infinite; }
.hero-tagline { animation:fade-word-in .8s .25s both; }
@keyframes fade-word-in { from { opacity:0; letter-spacing:.08em; } to { opacity:1; letter-spacing:.01em; } }
@media (prefers-reduced-motion:reduce) { .bg-glow, .navbar, .status-dot.online, .hero-tagline { animation:none; } }

/* ---------- Diamond+ membership card ---------- */
.diamondplus-card { max-width:680px; margin:36px auto 0; padding:44px clamp(28px,7vw,60px); text-align:left; }
.diamondplus-card h2 { margin:16px 0 10px; font-size:clamp(26px,4.5vw,36px); letter-spacing:-.05em; }
.diamondplus-card > p { color:var(--text-dim); font-size:14.5px; line-height:1.7; max-width:52ch; margin:0 0 18px; }
.diamondplus-steps { margin:0 0 22px; padding-left:20px; color:var(--text-dim); font-size:14px; line-height:1.9; }
.diamondplus-steps code { color:var(--cyan-bright); background:rgba(76,157,240,.12); padding:1px 6px; border-radius:5px; font-size:13px; }
.diamondplus-form { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; }
.diamondplus-field { flex:1 1 180px; min-width:150px; }
.diamondplus-input { background:transparent; border:none; outline:none; color:var(--text); font:700 17px/1.2 Inter,sans-serif; letter-spacing:.08em; text-transform:uppercase; width:100%; }
.diamondplus-input::placeholder { color:var(--text-faint); letter-spacing:.08em; }
.diamondplus-btn { flex:0 0 auto; padding:14px 22px; border:1px solid rgba(76,157,240,.42); border-radius:999px; color:#04141c; background:linear-gradient(135deg,var(--cyan-bright),var(--cyan)); font:800 13px Inter,sans-serif; letter-spacing:.02em; cursor:pointer; box-shadow:0 0 24px rgba(76,157,240,.28), inset 0 1px rgba(255,255,255,.4); transition:transform .2s ease, box-shadow .2s ease; }
.diamondplus-btn:hover { transform:translateY(-2px); box-shadow:0 8px 26px rgba(76,157,240,.34), inset 0 1px rgba(255,255,255,.4); }
.diamondplus-btn:disabled { opacity:.6; cursor:default; transform:none; }
.diamondplus-error { margin:14px 0 0; color:var(--red); font-size:13.5px; }
.diamondplus-status { color:var(--text-dim); font-size:14px; margin:0 0 18px; display:flex; align-items:center; gap:8px; }

.navbar-avatar { width:20px; height:20px; border-radius:5px; display:inline-block; vertical-align:middle; margin-right:7px; image-rendering:pixelated; }
.navbar-account { display:flex; align-items:center; }

.link-card { max-width:480px; margin:36px auto 0; padding:44px clamp(28px,7vw,60px); text-align:left; }
.link-card h2 { margin:16px 0 10px; font-size:clamp(24px,4.2vw,32px); letter-spacing:-.05em; }
.link-card > p { color:var(--text-dim); font-size:14.5px; line-height:1.7; margin:0 0 22px; }
.link-form { display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end; margin-bottom:6px; }
.link-error { margin:14px 0 0; color:var(--red); font-size:13.5px; }
.link-linked { display:flex; align-items:center; gap:12px; padding:14px 16px; border-radius:12px; background:rgba(76,157,240,.08); border:1px solid rgba(76,157,240,.2); margin-bottom:18px; }
.link-linked img { width:40px; height:40px; border-radius:9px; image-rendering:pixelated; }
.link-linked strong { color:var(--text); font-size:15.5px; }
.link-actions { display:flex; gap:14px; align-items:center; margin-top:6px; }
.link-actions a { color:var(--text-dim); font-size:13.5px; text-decoration:underline; }
.link-actions a:hover { color:var(--text); }
.link-actions { flex-wrap:wrap; }
/* .card sets display:flex, which beats the browser's [hidden] rule - restore it for the link page. */
.link-card[hidden], .link-actions [hidden] { display:none !important; }
.link-linked strong.is-unlinked { color:var(--text-dim); font-weight:600; font-style:italic; }
/* The generic ".link-actions a" rule above was washing out the primary button's text - pin it to black. */
.link-actions a.diamondplus-btn, .link-actions a.diamondplus-btn:hover { color:#000; text-decoration:none; }
.link-unlink { display:inline-flex; align-items:center; padding:9px 16px; border:1px solid rgba(255,107,107,.4); border-radius:999px; background:rgba(255,107,107,.08); color:#ff8f8f; font:700 13px Inter,sans-serif; cursor:pointer; transition:background .2s ease, border-color .2s ease, color .2s ease, opacity .45s ease, padding .25s ease; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.link-unlink:hover { background:rgba(255,107,107,.18); border-color:rgba(255,107,107,.7); color:#ffb0b0; }
.link-unlink:focus-visible { outline:2px solid rgba(255,107,107,.7); outline-offset:2px; }
.link-unlink:disabled { opacity:.6; cursor:default; }
/* Hold-to-confirm: the ring is collapsed until the button is "armed" by a first tap. */
.unlink-ring { width:0; height:22px; margin-right:0; opacity:0; overflow:hidden; flex:none; transition:width .25s ease, margin .25s ease, opacity .25s ease; }
.unlink-ring svg { width:22px; height:22px; display:block; }
.unlink-ring circle { fill:none; }
.unlink-ring .ring-track { stroke:rgba(255,143,143,.25); stroke-width:3; }
.unlink-ring .ring-fill { stroke:#ff8f8f; stroke-width:3; stroke-linecap:round; stroke-dasharray:69.115; stroke-dashoffset:69.115; transform:rotate(-90deg); transform-origin:50% 50%; transition:stroke-dashoffset .25s ease; }
.unlink-ring .ring-dot { fill:#ff8f8f; opacity:.55; transition:opacity .2s ease, transform .2s ease; transform-origin:50% 50%; }
.link-unlink.is-armed { padding:9px 18px 9px 12px; background:rgba(255,107,107,.16); border-color:rgba(255,107,107,.7); color:#ffb0b0; }
.link-unlink.is-armed .unlink-ring { width:22px; margin-right:9px; opacity:1; }
.link-unlink.is-holding .ring-fill { transition:none; }
.link-unlink.is-holding .ring-dot { opacity:1; transform:scale(1.15); }
.link-unlink.is-fading { opacity:0; }
.sr-only { position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (max-width:620px) {
  .diamondplus-card { padding:32px 22px; }
  .diamondplus-form { flex-direction:column; align-items:stretch; }
}


/* ---------- DiamondSMP store refresh: material, accessible, CSP-safe ---------- */
@font-face { font-family:"Site Sans"; src:url("assets/fonts/DejaVuSans.ttf") format("truetype"); font-weight:400 500; font-style:normal; font-display:swap; }
@font-face { font-family:"Site Sans"; src:url("assets/fonts/DejaVuSans-Bold.ttf") format("truetype"); font-weight:600 900; font-style:normal; font-display:swap; }
:root { --bg:#070b11; --panel:#101821; --line:#2b3b49; --text:#f1f6f8; --text-dim:#afbec7; --text-faint:#82939f; --cyan:#4c9df0; --cyan-bright:#4c9df0; --green:#67e39a; --red:#f07878; --bevel:inset 0 -3px 0 rgba(0,0,0,.28); }
html,body { font-family:"Site Sans",ui-sans-serif,system-ui,sans-serif; }
body { background:linear-gradient(180deg,#0d1721 0,var(--bg) 44%); font-size:16px; line-height:1.55; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.18; background-image:linear-gradient(rgba(76,157,240,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(76,157,240,.08) 1px,transparent 1px); background-size:32px 32px; mask-image:linear-gradient(to bottom,#000,transparent 68%); }
.skip-link { position:fixed; left:16px; top:10px; z-index:100; padding:10px 14px; color:#041416; background:var(--cyan-bright); font-weight:800; transform:translateY(-150%); transition:transform .2s ease; }
.skip-link:focus { transform:translateY(0); }
.navbar { max-width:980px; padding-inline:20px; }
.navbar-inner { border:1px solid var(--line); border-bottom-color:#385463; background:rgba(10,17,24,.94); box-shadow:0 10px 28px rgba(0,0,0,.28); }
.nav-toggle { display:none; min-height:42px; padding:8px 12px; color:var(--cyan-bright); background:transparent; border:1px solid var(--line); border-radius:6px; font-family:inherit; font-size:16px; font-weight:700; line-height:1; letter-spacing:.02em; touch-action:manipulation; -webkit-tap-highlight-color:transparent; position:relative; z-index:2; cursor:pointer; }
.navbar-link:focus-visible,button:focus-visible,a:focus-visible,input:focus-visible { outline:3px solid var(--cyan-bright); outline-offset:3px; }
.wrap { max-width:900px; padding:56px 20px 56px; }
.page-hero { margin:30px 0 36px; }
.page-title { font-size:clamp(32px,6vw,48px); }
.page-subtitle { max-width:55ch; font-size:17px; }
.diamondplus-card { max-width:700px; margin:0 auto 22px; padding:40px clamp(26px,7vw,66px); border:1px solid #385463; border-radius:8px; background:linear-gradient(145deg,#172a37,#0d1720); box-shadow:var(--bevel),0 20px 44px rgba(0,0,0,.28); text-align:left; }
.diamondplus-card h2 { margin:18px 0 12px; font-size:clamp(28px,5vw,42px); letter-spacing:-.035em; }
.diamondplus-card > p:not(.diamondplus-status):not(.diamondplus-error) { max-width:52ch; color:var(--text-dim); font-size:16px; line-height:1.72; }
.diamondplus-status { min-height:30px; color:var(--text-dim); }
.diamondplus-btn { min-height:46px; padding:12px 20px; border:1px solid var(--cyan-bright); border-radius:5px; color:#041416 !important; background:var(--cyan); box-shadow:var(--bevel),0 8px 20px rgba(76,157,240,.14); font:800 14px inherit; text-decoration:none; cursor:pointer; }
.diamondplus-btn:hover,.diamondplus-btn:focus-visible { background:var(--cyan-bright); transform:translateY(-2px); }
.diamondplus-error,.link-error { padding:11px 13px; border:1px solid rgba(240,120,120,.35); border-radius:5px; background:rgba(120,26,26,.2); color:#ffb0b0; }
.coming-card { border:1px solid var(--line); border-radius:8px; background:linear-gradient(145deg,rgba(23,36,49,.96),rgba(12,19,27,.96)); box-shadow:var(--bevel),0 16px 34px rgba(0,0,0,.24); }
.link-card { max-width:620px; margin:0 auto 22px; padding:34px clamp(22px,6vw,48px); border:1px solid var(--line); border-radius:8px; background:linear-gradient(145deg,#172a37,#0d1720); box-shadow:var(--bevel),0 20px 44px rgba(0,0,0,.28); }
.link-card h2 { font-size:clamp(26px,5vw,38px); }
.link-card > p { font-size:16px; line-height:1.72; }
.link-linked { padding:14px; border-color:#385463; background:#0a131c; }
.link-linked img { width:48px; height:48px; border-radius:6px; }
.link-form { gap:12px; }
.diamondplus-field { min-height:68px; border:1px solid #456170; border-radius:6px; background:#0a131c; box-shadow:var(--bevel); }
.diamondplus-input { font-family:inherit; font-size:18px; }
.link-actions { gap:12px; }
.link-unlink { min-height:44px; border-radius:5px; box-shadow:var(--bevel); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@keyframes rise-in { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.reveal-section,.reveal-item { opacity:1; transform:none; }
.js .reveal-section,.js .reveal-item { animation:rise-in .65s ease both; }
@media (max-width:700px) { .navbar { padding-inline:12px; } .navbar-inner { padding:9px 10px; } .nav-toggle { display:block; } .navbar-links { display:none; position:absolute; left:10px; right:10px; top:calc(100% + 8px); padding:8px; flex-direction:column; align-items:stretch; background:#0b141c; border:1px solid var(--line); border-radius:7px; box-shadow:0 16px 28px rgba(0,0,0,.35); } .navbar-links.is-open { display:flex; } .navbar-link { min-height:44px; display:flex; align-items:center; } .diamondplus-card,.link-card { padding:28px 20px; } .diamondplus-form,.link-form { flex-direction:column; align-items:stretch; } .diamondplus-btn { width:100%; text-align:center; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.01ms !important; } .js .reveal-section,.js .reveal-item { animation:none; } }

/* ---------- Checkout result pages (success.html / cancelled.html) ---------- */
.result-card { text-align:center; }
.result-card h2 { margin:0 0 12px; }
.result-card > p { max-width:46ch; margin:0 auto 8px; }
.result-card .diamondplus-status { justify-content:center; }
.result-card .link-actions { justify-content:center; margin-top:18px; }
.result-icon { width:58px; height:58px; margin:0 auto 18px; border-radius:50%; display:flex; align-items:center; justify-content:center; }
.result-icon svg { width:26px; height:26px; }
.result-icon.is-success { background:rgba(103,227,154,.14); border:1px solid rgba(103,227,154,.4); color:var(--green); }
.result-icon.is-cancelled { background:rgba(240,120,120,.14); border:1px solid rgba(240,120,120,.4); color:var(--red); }
.result-note { margin:16px 0 0 !important; font-size:13px; color:var(--text-faint); max-width:48ch; margin-left:auto !important; margin-right:auto !important; }

/* ---------- Manage/cancel subscription + subscribe fine print ---------- */
.diamondplus-manage { display:inline-block; margin:12px 0 0; padding:0; border:none; background:none; color:var(--text-dim); font:700 13.5px inherit; text-decoration:underline; cursor:pointer; }
.diamondplus-manage:hover,.diamondplus-manage:focus-visible { color:var(--text); }
.diamondplus-manage:disabled { opacity:.6; cursor:default; }
.diamondplus-fineprint { margin:16px 0 0; font-size:12.5px; line-height:1.6; color:var(--text-faint); }
.diamondplus-fineprint a { color:var(--text-dim); text-decoration:underline; }
.diamondplus-fineprint a:hover { color:var(--cyan-bright); }

/* Unified blue: every former cyan/teal accent now uses the same blue */
:root { --cyan:#4c9df0; --cyan-bright:#4c9df0; --cyan-soft:#b9d9fb; --blue:#4c9df0; --diamond:#4c9df0; --diamond-d:#2f72bd; --sand:#4c9df0; }