/* ZEDROX MC — black and red, with quiet motion and crisp surfaces. */
:root { color-scheme: dark; --zx-accent: #b73543; --zx-accent-soft: #da5965; --zx-canvas: #0b090a; --zx-surface: #151113; --zx-border: #3b272c; --zx-bubble: 183 53 67; --zx-red: var(--zx-accent); }
[data-theme="green"] { --zx-accent: #289c70; --zx-accent-soft: #57bd90; --zx-canvas: #08110e; --zx-surface: #111c17; --zx-border: #29463a; --zx-bubble: 40 156 112; --zx-image-hue: 150deg; }
[data-theme="purple"] { --zx-accent: #8e55bd; --zx-accent-soft: #b17bd3; --zx-canvas: #100b15; --zx-surface: #19141e; --zx-border: #483350; --zx-bubble: 142 85 189; --zx-image-hue: 235deg; }
[data-theme="blue"] { --zx-accent: #3b80c4; --zx-accent-soft: #78a9da; --zx-canvas: #090f17; --zx-surface: #131922; --zx-border: #304259; --zx-bubble: 59 128 196; --zx-image-hue: 190deg; }
[data-theme="orange"] { --zx-accent: #be6342; --zx-accent-soft: #e29169; --zx-canvas: #130d0a; --zx-surface: #201713; --zx-border: #50382e; --zx-bubble: 190 99 66; --zx-image-hue: 345deg; }
@font-face { font-family: "Vazir"; src: url("/assets/Vazir-Variable.woff2") format("woff2"); font-style: normal; font-weight: 100 900; font-display: swap; }
html { background: #09090b; scroll-behavior: smooth; }
body {
  margin: 0;
  background: #09090b !important;
  color: #ede9ea;
  font-family: "Vazir", Tahoma, sans-serif !important;
  direction: rtl;
}
body > #root > div { position: relative; isolation: isolate; min-height: 100vh; background: var(--zx-canvas); }
body > #root > div::before,
body > #root > div::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .38;
  background-image: radial-gradient(circle at 48px 53px, transparent 17px, rgb(var(--zx-bubble) / .32) 18px, rgb(var(--zx-bubble) / .08) 20px, transparent 22px), radial-gradient(circle at 153px 161px, transparent 9px, rgb(var(--zx-bubble) / .23) 10px, transparent 12px);
  background-size: 220px 240px;
  animation: zx-rise 19s linear infinite;
}
body > #root > div::after {
  opacity: .25;
  background-image: radial-gradient(circle at 118px 79px, transparent 29px, rgb(var(--zx-bubble) / .28) 30px, transparent 33px), radial-gradient(circle at 290px 255px, transparent 12px, rgb(var(--zx-bubble) / .28) 13px, transparent 16px);
  background-size: 390px 400px;
  background-position: 120px 0;
  animation-duration: 31s;
}
@keyframes zx-rise { from { background-position-y: 0; } to { background-position-y: -240px; } }
@keyframes zx-rise-wide { from { background-position-y: 0; } to { background-position-y: -400px; } }
body > #root > div::after { animation-name: zx-rise-wide; }
::selection { background: #a62d3b; color: #fff; }
bdi, [dir="ltr"] { unicode-bidi: isolate; }
.font-mono, input[type="email"], input[type="url"] { direction: ltr; unicode-bidi: isolate; }
input[type="email"], input[type="url"] { text-align: left; }
button, a, input, select, textarea { font-family: inherit !important; }
input, select, textarea { color: #eee !important; background: var(--zx-surface) !important; border-color: var(--zx-border) !important; }
input:focus, select:focus, textarea:focus { border-color: var(--zx-red) !important; box-shadow: none !important; }
[class*="text-amber"], [class*="text-yellow"] { color: var(--zx-accent-soft) !important; }
[class*="border-amber"], [class*="border-yellow"] { border-color: var(--zx-border) !important; }
[class*="bg-amber"], [class*="bg-yellow"] { background-color: rgb(var(--zx-bubble) / .16) !important; }
[class*="from-amber"], [class*="from-yellow"] { --tw-gradient-from: var(--zx-accent) var(--tw-gradient-from-position) !important; }
[class*="via-amber"], [class*="via-yellow"] { --tw-gradient-via: var(--zx-accent-soft) var(--tw-gradient-via-position) !important; }
[class*="to-amber"], [class*="to-yellow"] { --tw-gradient-to: var(--zx-accent) var(--tw-gradient-to-position) !important; }
.gold-shimmer { color: var(--zx-accent-soft) !important; background: none !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; animation: none !important; }
button[class*="bg-amber"], button[class*="from-amber"], a[class*="bg-amber"], a[class*="from-amber"] {
  color: #fff !important;
  background: var(--zx-accent) !important;
  border: 1px solid var(--zx-accent-soft) !important;
  box-shadow: none !important;
}
button[class*="bg-amber"]:hover, button[class*="from-amber"]:hover,
a[class*="bg-amber"]:hover, a[class*="from-amber"]:hover { background: var(--zx-accent-soft) !important; }
body > #root > div > nav {
  background: var(--zx-surface) !important;
  border-bottom: 2px solid var(--zx-accent) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
body > #root > div > nav .hidden.lg\:flex.items-center.gap-1 { background: none !important; border: 0 !important; }
body > #root > div > nav [id^="nav-item-"] { border-radius: 3px !important; }
body > #root > div > nav [id^="nav-item-"]:hover,
body > #root > div > nav [id^="mobile-nav-item-"]:hover { background: var(--zx-border) !important; color: #fff !important; }
#brand-logo-btn > img { display: block !important; flex: none; }
#brand-logo-btn > div:first-child { background: var(--zx-accent) !important; border: 0 !important; color: #fff !important; transform: none !important; box-shadow: none !important; }
body > #root > div > main section, body > #root > div > main article { background-color: transparent; }
body > #root > div > .bg-cover { filter: hue-rotate(var(--zx-image-hue, 0deg)) !important; }
body > #root > div > main :is(.grid, .flex) > * { min-width: 0; }
body > #root > div > main :is(h1, h2, h3, h4, p, span, a, button, td, th) { overflow-wrap: anywhere; }
body > #root > div > main :is(img, video) { max-width: 100%; }
#site-footer { background: var(--zx-surface) !important; border-top: 2px solid var(--zx-accent) !important; position: relative; z-index: 1; }
#footer-discord {
  color: #f0e9eb;
  background: var(--zx-canvas);
  border: 1px solid var(--zx-accent);
  border-radius: 3px !important;
  font-family: inherit;
  cursor: pointer;
  appearance: none;
  transition: background-color .18s ease, border-color .18s ease;
}
#footer-discord:hover { color: #fff; background: var(--zx-border); border-color: var(--zx-accent-soft); }
.zx-footer-inner { max-width: 1200px; margin: auto; padding: 34px 24px 24px; display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 22px 40px; align-items: center; }
.zx-footer-about h2 { color: #f3e9eb; font-size: 18px; font-weight: 800; margin: 0 0 8px; }
.zx-footer-about p { max-width: 610px; font-size: 12px; line-height: 1.9; color: #a99ea2; margin: 0; }
.zx-footer-links { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.zx-footer-links a, .zx-footer-links button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 11px 14px; font-size: 12px; font-weight: 700; text-decoration: none; }
#footer-enamad { color: #f0e9eb; border: 1px solid var(--zx-border); border-radius: 3px; min-height: 75px; }
#footer-enamad img { display: block; width: 54px; height: 60px; object-fit: contain; }
.zx-footer-copyright { grid-column: 1 / -1; border-top: 1px solid var(--zx-border); padding-top: 15px; margin: 0; color: #827a7e; font-size: 11px; }
@media (max-width: 640px) {
  body { font-size: 14px; }
  body > #root > div::before { background-size: 150px 180px; animation-name: zx-rise-mobile; }
  body > #root > div::after { background-size: 270px 280px; animation-name: zx-rise-mobile-wide; }
  .zx-footer-inner { padding: 26px 18px 22px; grid-template-columns: minmax(0,1fr); gap: 20px; }
  .zx-footer-links { align-items: stretch; }
  #footer-enamad { flex: 1; }
  #footer-discord { flex-wrap: wrap; justify-content: center; text-align: center; }
  body > #root > div .text-xl { font-size: 1.13rem !important; }
  body > #root > div .text-lg { font-size: 1.05rem !important; }
  body > #root > div .text-base { font-size: .94rem !important; }
}
@keyframes zx-rise-mobile { from { background-position-y: 0; } to { background-position-y: -180px; } }
@keyframes zx-rise-mobile-wide { from { background-position-y: 0; } to { background-position-y: -280px; } }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

/* Hand-built landing layout: editorial type and useful server data. */
body { font-family: "Vazir", Tahoma, sans-serif !important; }
.font-sans, .font-display, .ql-container, .ql-editor { font-family: "Vazir", Tahoma, sans-serif !important; }
body > #root > div > main header.zx-hero {
  min-height: 0 !important;
  padding: 91px 24px 44px !important;
  background: transparent !important;
  border-bottom: 1px solid var(--zx-border);
  display: flex;
  align-items: center;
}
body > #root > div > main header.zx-hero::before {
  content: "";
  display: block;
  position: absolute;
  inset: 0 0 0 auto;
  width: 5px;
  background: var(--zx-accent);
  opacity: 1;
}
body > #root > div > main header.zx-hero::after { display: none; }
.zx-hero-inner {
  width: min(100%, 1200px);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(255px, 320px);
  align-items: center;
  gap: clamp(24px, 4vw, 64px);
  position: relative;
  z-index: 1;
}
.zx-hero-copy { text-align: right; min-width: 0; }
.zx-hero-logo { width: 82px; height: 82px; object-fit: contain; display: block; margin: 0 0 12px; }
.zx-hero-kicker {
  color: var(--zx-accent-soft);
  font-size: 12px;
  font-weight: 800;
  border-right: 3px solid var(--zx-accent);
  padding: 3px 12px 3px 0;
  margin-bottom: 16px;
  line-height: 1.6;
}
body > #root > div > main header.zx-hero h1 {
  max-width: none !important;
  font-size: clamp(34px, 4.3vw, 61px) !important;
  line-height: 1.28 !important;
  font-weight: 900 !important;
  letter-spacing: -.025em;
  margin: 0;
  color: #f4f0ef;
}
.zx-hero h1 span, .zx-hero h1 strong { display: block; }
.zx-hero h1, .zx-hero-description, .zx-hero-kicker { overflow-wrap: anywhere; word-break: normal; }
.zx-hero h1 strong { color: var(--zx-accent-soft); font-weight: 900; }
body > #root > div > main header.zx-hero .zx-hero-description {
  max-width: 650px;
  color: #aca6a8;
  font-size: 15px;
  line-height: 2;
  margin: 15px 0 0;
  text-align: right;
}
.zx-hero-actions { display: flex; flex-wrap: wrap; align-items: stretch; gap: 12px; margin-top: 20px; }
.zx-hero-actions button {
  min-height: 55px;
  border-radius: 3px !important;
  padding: 12px 20px;
  font-weight: 800;
  font-size: 13px;
  cursor: pointer;
  transition: background-color .18s ease, border-color .18s ease;
}
.zx-ip-button {
  display: flex;
  align-items: center;
  gap: 16px;
  background: var(--zx-accent);
  border: 1px solid var(--zx-accent);
  color: #fff;
}
.zx-ip-button:hover { background: var(--zx-accent-soft); border-color: var(--zx-accent-soft); }
.zx-ip-button bdi { font: 800 14px/1.2 Consolas, monospace; color: #fff; }
.zx-shop-button { background: transparent; border: 1px solid #594047; color: #f0e6e8; }
.zx-shop-button:hover { background: var(--zx-surface); border-color: var(--zx-accent); }
.zx-server-panel {
  background: var(--zx-surface);
  border: 1px solid var(--zx-border);
  border-top: 3px solid var(--zx-accent);
  border-radius: 2px;
  padding: 27px 28px 22px;
  box-shadow: none;
  text-align: right;
  min-width: 0;
}
.zx-server-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.zx-server-top > span:first-child {
  color: #797274;
  direction: ltr;
  unicode-bidi: isolate;
  font: 700 10px/1.5 Consolas, monospace;
  letter-spacing: .11em;
}
.zx-online, .zx-offline { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 700; color: #c4b9bb; }
.zx-online i, .zx-offline i { width: 7px; height: 7px; border-radius: 50%; background: #63a47b; }
.zx-offline i { background: #bd4a52; }
.zx-server-number { color: #f4eeee; font: 800 78px/1.05 Consolas, monospace; margin-top: 36px; letter-spacing: -.07em; }
.zx-server-caption { font-size: 12px; color: #b3a9ab; margin: 10px 0 32px; }
.zx-server-details { display: grid; gap: 0; border-top: 1px solid #382b2e; }
.zx-server-details > div {
  display: flex; justify-content: space-between; align-items: baseline; gap: 12px;
  padding: 13px 0; border-bottom: 1px solid #382b2e;
  font-size: 12px; color: #91888b;
}
.zx-server-details bdi { color: #eee5e6; font: 700 12px/1.5 Consolas, monospace; }

/* Other pages use solid surfaces and clear labels instead of glassy panels. */
body > #root > div > main [class*="backdrop-blur"] { backdrop-filter: none !important; }
body > #root > div > main [class*="shadow-"] { box-shadow: none !important; }
body > #root > div > main [class*="rounded-2xl"][class*="border"],
body > #root > div > main [class*="rounded-3xl"][class*="border"] {
  background-color: var(--zx-surface) !important;
  border-color: var(--zx-border) !important;
  border-radius: 3px !important;
}
body > #root > div > main [class*="rounded-2xl"][class*="border"]:hover,
body > #root > div > main [class*="rounded-3xl"][class*="border"]:hover {
  border-color: var(--zx-accent) !important;
}
body > #root > div > main .animate-pulse,
body > #root > div > main .animate-bounce,
body > #root > div > main .animate-super-float { animation: none !important; }
@media (max-width: 900px) {
  body > #root > div > main header.zx-hero { min-height: 0 !important; padding: 91px 20px 38px !important; }
  .zx-hero-inner { grid-template-columns: 1fr; gap: 26px; }
  .zx-server-panel { max-width: 100%; }
  .zx-server-number { margin-top: 22px; font-size: 56px; }
}
@media (max-width: 640px) {
  body > #root > div > main header.zx-hero { padding: 88px 18px 32px !important; }
  .zx-hero-logo { width: 62px; height: 62px; margin-bottom: 10px; }
  .zx-hero-kicker { margin-bottom: 12px; font-size: 10px; }
  body > #root > div > main header.zx-hero h1 { font-size: clamp(29px, 8.2vw, 41px) !important; line-height: 1.4 !important; }
  body > #root > div > main header.zx-hero .zx-hero-description { font-size: 13px; line-height: 1.9; margin-top: 18px; }
  .zx-hero-actions { gap: 10px; margin-top: 18px; }
  .zx-hero-actions button { min-height: 50px; padding: 10px 13px; font-size: 12px; }
  .zx-ip-button { gap: 9px; }
  .zx-ip-button bdi { font-size: 11px; }
  .zx-server-panel { padding: 18px 20px 12px; }
  .zx-server-number { font-size: 48px; margin-top: 18px; }
  .zx-server-caption { margin-bottom: 17px; }
}

/* Keep secondary pages as restrained as the landing page. */
body > #root > div > main [class*="bg-gradient-to"]:not(button):not(a) {
  background-image: none !important;
  background-color: var(--zx-surface) !important;
}
body > #root > div > main [class*="rounded-3xl"],
body > #root > div > main [class*="rounded-2xl"] { border-radius: 3px !important; }
body > #root > div > main [class*="shadow-"] { box-shadow: none !important; }
body > #root > div > main [class*="backdrop-blur"] { backdrop-filter: none !important; }
body > #root > div > main [class*="drop-shadow"] { filter: none !important; }
body > #root > div > main .animate-pulse,
body > #root > div > main .animate-bounce,
body > #root > div > main .animate-super-float { animation: none !important; }
@media (max-width: 640px) {
  body > #root > div > main section,
  body > #root > div > main article { overflow-wrap: anywhere; }
}
