:root {
  --site-font: "Vazirmatn", Tahoma, "Segoe UI", sans-serif;
  --navy: #07101f;
  --panel: rgba(14, 24, 43, 0.92);
  --line: rgba(149, 196, 229, 0.35);
  --cyan: #35d6f2;
  --mint: #47f6b1;
  --text: #eaf3ff;
  --muted: #acb7ca;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  color: var(--text);
  background: #050b17;
  font-family: var(--site-font);
}
button, a { font: inherit; }
button { color: inherit; }
.page-shell {
  min-height: 100vh;
  overflow: hidden;
  background:
    linear-gradient(180deg, rgba(4, 12, 30, .44) 0, rgba(4, 11, 26, .08) 37%, rgba(5, 11, 25, .88) 82%, #060c19 100%),
    url("assets/minecraft-world.webp") center top / max(100%, 1680px) auto no-repeat,
    #07101e;
}

.site-header {
  width: min(1140px, calc(100% - 48px));
  height: 134px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  position: relative;
  z-index: 10;
  padding-top: 24px;
  direction: ltr;
}
.brand { display: flex; align-items: center; gap: 12px; color: white; text-decoration: none; filter: drop-shadow(0 5px 2px #020817); }
.brand-image { width: 72px; height: 72px; object-fit: cover; border: 2px solid rgba(112, 225, 247, .55); border-radius: 17px; box-shadow: 0 0 19px rgba(53, 214, 242, .34), 0 7px 15px rgba(1, 7, 18, .55); }
.brand-mark { width: 70px; height: 78px; position: relative; display: grid; place-items: center; }
.brand-mark b { font: italic 800 66px/1 Impact, sans-serif; color: #36d8ef; -webkit-text-stroke: 2px #071f42; transform: skew(-8deg); text-shadow: inset 0 0 6px white, 0 4px 0 #0a4f83; }
.brand-mark i { position: absolute; width: 10px; height: 61px; right: 10px; top: -5px; transform: rotate(38deg); background: linear-gradient(90deg, #193153, #a1efff 45%, #1d7291 50%, #071326); border: 2px solid #071323; z-index: 2; }
.brand-mark i::before { content: ""; position: absolute; width: 30px; height: 8px; background: #287ca2; border: 2px solid #061a2f; left: -10px; bottom: 8px; }
.brand-copy { display: flex; flex-direction: column; padding-top: 12px; font-family: var(--site-font); letter-spacing: 1px; line-height: .9; }
.brand-copy strong { font-size: 27px; text-shadow: 0 3px 0 #0b1730; }
.brand-copy em { font-style: normal; font-size: 29px; color: #31c4ef; text-shadow: 0 3px 0 #0a2a55; }

.main-nav { display: flex; gap: 12px; padding-top: 15px; align-items: center; direction: rtl; }
.main-nav a {
  text-decoration: none;
  color: #d6dbea;
  font: 900 19px/1 var(--site-font);
  letter-spacing: 1px;
  padding: 11px 14px;
  text-shadow: 0 3px 2px #03091a;
  transition: .2s ease;
}
.main-nav a:hover, .main-nav a.active { color: #52def4; transform: translateY(-2px); }
.main-nav a.active { border: 1px solid rgba(60, 210, 244, .35); border-radius: 10px; background: linear-gradient(180deg, rgba(36, 176, 211, .33), rgba(21, 91, 135, .23)); box-shadow: 0 0 18px rgba(21, 220, 255, .42), inset 0 0 13px rgba(67, 226, 255, .16); }
.menu-toggle { display: none; background: rgba(7,17,34,.9); border: 1px solid var(--line); border-radius: 8px; width: 44px; height: 42px; padding: 9px; }
.menu-toggle span { display: block; height: 3px; background: #77e5f9; margin: 4px 0; }

.hero { min-height: 425px; display: grid; place-items: start center; text-align: center; position: relative; }
.hero-copy { width: min(950px, 96%); padding-top: 18px; }
h1, h2, h3 { margin: 0; font-family: var(--site-font); font-weight: 900; letter-spacing: .4px; }
.hero h1 { font-size: clamp(38px, 4vw, 58px); line-height: 1; color: #eef8ff; -webkit-text-stroke: 2px #081b3b; text-shadow: 0 5px 0 #135a9e, 0 9px 9px #071127; }
.hero h1 span { color: #d8f6ff; }
.status-strip {
  width: fit-content;
  min-height: 47px;
  margin: 22px auto 29px;
  padding: 5px 12px;
  display: flex;
  align-items: center;
  gap: 12px;
  border: 2px solid rgba(143, 204, 229, .65);
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(31, 44, 60, .96), rgba(11, 19, 32, .94));
  box-shadow: 0 5px 10px #07101d, 0 0 16px rgba(47, 223, 249, .7);
  font: 900 21px/1 var(--site-font);
  white-space: nowrap;
  color: #d9e0ea;
  text-shadow: 0 2px 0 #060a12;
  direction: ltr;
}
.status-strip strong { direction: rtl; }
.faces { display: flex; margin-right: -4px; }
.faces i { font-style: normal; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: #263246; border: 2px solid #a6c8d6; margin-left: -6px; font-size: 22px; overflow: hidden; }
.pulse { width: 26px; height: 26px; border-radius: 50%; background: #41e278; border: 3px solid #71ffae; box-shadow: 0 0 13px #21ff75; animation: pulse 1.7s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 4px #21ff75; transform: scale(.94); } }
.status-strip b { color: #4be373; }
.status-strip mark { color: #ffe17c; background: none; }
.status-strip .right { margin-left: 6px; }

.join-panel {
  width: min(470px, calc(100% - 26px));
  margin: 0 auto;
  padding: 9px;
  position: relative;
  border: 1px solid rgba(139, 198, 217, .65);
  border-radius: 14px;
  background: rgba(6, 20, 31, .81);
  box-shadow: 0 9px 22px #04101f, 0 0 17px rgba(47, 215, 241, .4);
}
.join-button {
  width: 100%;
  height: 70px;
  border: 2px solid #56e4ed;
  border-radius: 10px;
  background: linear-gradient(100deg, rgba(12, 165, 128, .82), rgba(7, 105, 164, .87));
  box-shadow: inset 0 0 22px rgba(109,255,250,.45), 0 0 16px rgba(41, 233, 241, .52);
  font: 900 35px/1 var(--site-font);
  letter-spacing: 1px;
  text-shadow: 0 4px 2px #092334;
  cursor: pointer;
  transition: .18s ease;
}
.join-button:hover { filter: brightness(1.15); transform: translateY(-2px); }
.ip-row { display: grid; grid-template-columns: 1fr 108px; gap: 7px; margin-top: 9px; }
.ip-row code { display: grid; place-items: center; min-height: 45px; background: #0b1426; border: 1px solid #1d3455; border-radius: 7px; font: 900 18px/1 var(--site-font); letter-spacing: .7px; }
.copy-button, .category-card button, .category-link, .news-card button {
  border: 1px solid #4f8ead;
  border-radius: 7px;
  background: linear-gradient(#29627a, #15344f);
  box-shadow: inset 0 0 10px rgba(91,211,239,.16), 0 2px 5px #07101b;
  cursor: pointer;
  font-weight: 900;
}
.category-link { display: grid; place-items: center; min-height: 37px; margin-top: auto; padding: 0 22px; color: var(--text); text-decoration: none; font-size: 13px; font-weight: 900; }
.copy-button { font: 900 19px var(--site-font); border-color: #75daba; background: linear-gradient(#3b9b76, #1c5c4b); }
.copy-hint { position: absolute; right: -78px; bottom: 14px; padding: 8px 15px; font: 900 14px var(--site-font); background: #154e44; border: 1px solid #4fb48e; border-radius: 7px; transform: rotate(-2deg); }
.copy-hint::before { content: ""; position: absolute; left: -12px; top: 11px; border: 7px solid transparent; border-right-color: #4fb48e; }

.dashboard {
  width: min(1952px, calc(100% - 48px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 355px minmax(0, 1fr);
  gap: 28px;
  align-items: start;
  position: relative;
  z-index: 3;
}
.dashboard::before { content: ""; position: absolute; inset: -30px -50px -80px; z-index: -1; background: linear-gradient(180deg, transparent, rgba(6,13,29,.55) 18%, #07101f 85%); pointer-events: none; }
.dashboard h2, .updates h2 { font-size: 28px; color: #e8e9ed; text-shadow: 0 3px 0 #141824; margin-bottom: 14px; }
.news-panel { border-right: 1px solid rgba(79, 178, 216, .3); padding-right: 28px; }
.news-card { min-height: 154px; margin-bottom: 14px; padding: 14px; display: grid; grid-template-columns: 108px 1fr; gap: 14px; border: 1px solid rgba(130, 159, 202, .32); border-radius: 10px; background: linear-gradient(145deg, rgba(27, 39, 64, .96), rgba(19, 28, 49, .96)); box-shadow: 0 7px 12px rgba(2, 8, 17, .35); }
.news-thumb, .update-thumb { background-image: url("assets/minecraft-world.webp"); background-size: 600px auto; border-radius: 6px; border: 1px solid rgba(110,202,231,.3); }
.thumb-one { background-position: 25% 52%; }
.thumb-two { background-position: 82% 49%; }
.news-card h3 { font-family: inherit; font-size: 17px; line-height: 1.22; letter-spacing: 0; }
.news-card p { color: var(--muted); line-height: 1.15; margin: 8px 0; font-size: 14px; }
.news-card button { height: 35px; padding: 0 14px; font-size: 13px; }
.news-card time { color: #8995aa; font-size: 13px; margin-left: 14px; }

.section-heading { display: flex; justify-content: space-between; align-items: center; }
.slider-controls { display: flex; gap: 6px; direction: ltr; }
.slider-controls button { width: 34px; height: 34px; border: 1px solid #32607a; border-radius: 7px; background: #13253a; color: #d7f8ff; font-size: 26px; cursor: pointer; }
.slider-controls button:hover, .slider-controls button:focus-visible { background: #1d536d; border-color: #6fc7e0; outline: none; }
.category-grid { display: grid; grid-template-columns: repeat(4, minmax(185px, 1fr)); gap: 24px; }
.category-card {
  min-height: 318px;
  padding: 22px 18px 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  border: 1px solid rgba(173, 200, 222, .45);
  border-radius: 11px;
  background: radial-gradient(circle at 50% 30%, rgba(59, 75, 96, .6), rgba(21, 30, 51, .97) 70%);
  box-shadow: 0 9px 16px rgba(1, 7, 16, .44);
  transition: transform .25s, filter .25s;
}
.category-card:hover { transform: translateY(-8px); filter: brightness(1.08); }
.category-card.featured-card { transform: rotate(-3deg) translateY(1px); border: 2px solid #6bd2e5; box-shadow: 0 0 22px rgba(44,216,239,.55), 0 10px 15px #06101c; background: radial-gradient(circle at 50% 35%, rgba(44, 130, 145, .55), rgba(27, 39, 58, .98) 68%); }
.category-card.featured-card:hover { transform: rotate(-1deg) translateY(-8px); }
.item-icon { height: 130px; display: grid; place-items: center; font-family: Georgia, serif; font-weight: 900; text-shadow: 0 4px 0 #6d3516, 0 0 13px currentColor; }
.crown { color: #ffc128; font-size: 118px; transform: rotate(180deg); }
.key { color: #b67a40; font-size: 125px; transform: rotate(-39deg); }
.armor { color: #2fe4ed; font-size: 112px; text-shadow: 9px 0 0 #b929d4, -8px 0 0 #ffd935, 0 4px 0 #06283b; }
.coins { color: #ffbd23; font-size: 128px; text-shadow: 20px 7px 0 #ffd64e, -24px 12px 0 #ffa90c, 0 4px 0 #7b3c04, 0 0 13px #ffb51d; }
.category-card h3 { font-size: 26px; text-shadow: 0 3px 0 #0b101c; }
.category-card p { min-height: 57px; color: #b8c0d0; margin: 10px 0 15px; font-size: 14px; line-height: 1.25; }
.category-card button { margin-top: auto; height: 37px; padding: 0 26px; font-size: 14px; }

.seo-content {
  width: min(1120px, calc(100% - 48px));
  margin: 75px auto 0;
  position: relative;
  z-index: 3;
  content-visibility: auto;
  contain-intrinsic-size: auto 720px;
}
.seo-intro { padding: 30px 32px; border: 1px solid rgba(86, 184, 215, .36); border-radius: 16px; background: linear-gradient(135deg, rgba(17, 37, 61, .94), rgba(9, 22, 40, .96)); box-shadow: 0 16px 34px rgba(1,7,17,.34); }
.seo-intro > span { color: #61dff4; font-size: 12px; font-weight: 900; letter-spacing: 2px; }
.seo-intro h2, .seo-faq h2 { margin: 8px 0 13px; font-size: clamp(25px, 3vw, 34px); }
.seo-intro p { max-width: 980px; margin: 8px 0; color: #b2c0d1; font-size: 15px; line-height: 2; }
.seo-intro a { color: #62dff1; font-weight: 800; text-underline-offset: 4px; }
.seo-features { margin: 18px 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.seo-features article { padding: 20px; border: 1px solid rgba(92, 151, 188, .3); border-radius: 13px; background: rgba(12, 27, 48, .9); }
.seo-features b { color: #eaf8ff; font-size: 17px; }.seo-features p { margin: 7px 0 0; color: #8fa3ba; line-height: 1.8; font-size: 13px; }
.seo-faq { margin-top: 35px; }.seo-faq h2 { margin-bottom: 16px; }
.seo-faq details { margin-bottom: 10px; border: 1px solid #28455f; border-radius: 11px; background: rgba(10, 25, 44, .94); }
.seo-faq summary { padding: 17px 20px; color: #e7f2fb; cursor: pointer; font-weight: 800; }
.seo-faq details[open] summary { color: #60dfef; border-bottom: 1px solid #213d57; }
.seo-faq details p { margin: 0; padding: 16px 20px 19px; color: #9fb0c3; line-height: 1.9; }

.home-cta {
  width: min(1120px, calc(100% - 48px));
  min-height: 165px;
  margin: 70px auto 45px;
  padding: 28px 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  position: relative;
  z-index: 3;
  overflow: hidden;
  border: 1px solid rgba(89, 213, 234, .5);
  border-radius: 17px;
  background: radial-gradient(circle at 85% 30%, rgba(40, 184, 194, .27), transparent 36%), linear-gradient(120deg, rgba(20, 46, 74, .97), rgba(8, 23, 43, .97));
  box-shadow: 0 20px 45px rgba(1, 7, 17, .44), inset 0 0 32px rgba(56, 217, 239, .06);
}
.home-cta::after { content: "V"; position: absolute; left: 28px; top: -37px; color: rgba(83, 220, 241, .05); font: italic 900 190px/1 Impact, sans-serif; transform: rotate(-8deg); }
.home-cta > div { position: relative; z-index: 2; }.home-cta span { color: #62deef; font-size: 12px; font-weight: 900; letter-spacing: 2px; }
.home-cta h2 { margin: 8px 0 4px; font-size: clamp(24px, 3vw, 35px); }.home-cta p { margin: 0; color: #9fb0c3; }
.home-cta > a { min-height: 49px; padding: 0 23px; display: flex; align-items: center; gap: 9px; position: relative; z-index: 2; flex: 0 0 auto; border: 1px solid #63e1e9; border-radius: 9px; color: white; background: linear-gradient(110deg, #168e83, #156fa0); box-shadow: inset 0 0 14px rgba(131,255,246,.16), 0 6px 16px rgba(1,9,18,.38); text-decoration: none; font-weight: 900; transition: .2s ease; }
.home-cta > a:hover { transform: translateY(-3px); filter: brightness(1.15); }

.home-footer { min-height: 120px; padding: 20px max(24px, calc((100% - 1180px)/2)); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; position: relative; z-index: 3; border-top: 1px solid #1b2e49; color: #8fa0b5; background: rgba(5,11,24,.96); }
.footer-brand { display: flex; align-items: center; gap: 11px; color: white; text-decoration: none; direction: ltr; }
.footer-brand img { width: 52px; height: 52px; object-fit: cover; border: 1px solid #3b748f; border-radius: 11px; }
.footer-brand span { display: grid; }.footer-brand b { letter-spacing: 1px; }.footer-brand small { color: #55d7eb; }
.home-footer p { margin: 0; }.footer-store-link { justify-self: end; color: #8bddec; text-decoration: none; font-weight: 800; }
.home-cta, .home-footer { content-visibility: auto; contain-intrinsic-size: auto 180px; }
.back-to-top { position: fixed; right: 28px; bottom: 24px; width: 44px; height: 44px; border-radius: 7px; border: 1px solid #3c708c; background: #15314c; color: #fff; font-weight: 900; font-size: 23px; cursor: pointer; z-index: 12; }
.toast { position: fixed; left: 50%; bottom: 36px; z-index: 30; transform: translate(-50%, 90px); opacity: 0; padding: 11px 22px; background: #1a6f55; border: 1px solid #5ce6b0; border-radius: 7px; box-shadow: 0 0 18px #36dca3; font: 900 16px var(--site-font); transition: .3s ease; }
.toast.show { transform: translate(-50%, 0); opacity: 1; }

@media (max-width: 1500px) {
  .dashboard { grid-template-columns: 300px minmax(0, 1fr); gap: 18px; }
  .news-panel { padding-right: 18px; }
  .category-grid { gap: 14px; }.category-card { padding-inline: 12px; }
  .dashboard h2 { font-size: 23px; }
}
@media (max-width: 1180px) {
  .site-header { width: calc(100% - 30px); }
  .main-nav { gap: 0; }.main-nav a { padding-inline: 10px; font-size: 17px; }
  .dashboard { grid-template-columns: 1fr; width: calc(100% - 30px); }
  .news-panel { grid-column: 1 / -1; border-right: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 14px; padding: 0; }
  .news-panel h2 { grid-column: 1/-1; }
  .category-grid { grid-template-columns: repeat(2, 1fr); }
  .category-card { min-height: 300px; }
}
@media (max-width: 820px) {
  .page-shell { background-size: auto 840px; }
  .site-header { height: 112px; padding-top: 14px; }
  .brand-image { width: 58px; height: 58px; border-radius: 13px; }.brand-copy strong,.brand-copy em { font-size: 21px; }
  .menu-toggle { display: block; margin-top: 12px; }
  .main-nav { position: absolute; top: 72px; right: 0; width: 210px; padding: 10px; border: 1px solid #31536d; border-radius: 9px; background: rgba(6,14,29,.97); display: none; flex-direction: column; align-items: stretch; }
  .main-nav.open { display: flex; }
  .main-nav a { text-align: center; }
  .hero { min-height: 460px; }.hero-copy { padding-top: 8px; }
  .hero h1 { font-size: clamp(31px, 8vw, 49px); }
  .status-strip { transform: scale(.85); transform-origin: center; max-width: 115%; margin-left: -7.5%; }
  .copy-hint { display: none; }
  .dashboard { grid-template-columns: 1fr; }
  .seo-content { width: calc(100% - 30px); }.seo-features { grid-template-columns: 1fr; }
  .home-cta { width: calc(100% - 30px); padding: 25px; }
  .home-footer { grid-template-columns: 1fr 1fr; }.home-footer p { display: none; }
}
@media (max-width: 560px) {
  .hero h1 span { display: none; }
  .status-strip { width: 116%; white-space: normal; flex-wrap: wrap; justify-content: center; gap: 7px; font-size: 17px; margin-bottom: 22px; }
  .status-strip .right, .status-strip .divider { display: none; }
  .join-button { font-size: 27px; height: 62px; }.ip-row { grid-template-columns: 1fr; }.ip-row code { font-size: 16px; }.copy-button { height: 43px; }
  .news-panel { grid-template-columns: 1fr; }.news-panel h2 { grid-column: auto; }
  .category-grid { grid-template-columns: 1fr; }.category-card.featured-card { transform: none; }
  .news-card { grid-template-columns: 90px 1fr; }.news-thumb { background-size: 500px auto; }
  .seo-intro { padding: 23px 20px; }.seo-intro p { font-size: 14px; }.seo-faq summary { padding-inline: 16px; }
  .home-cta { flex-direction: column; align-items: stretch; text-align: center; }.home-cta > a { justify-content: center; }
  .home-footer { grid-template-columns: 1fr; text-align: center; }.footer-brand, .footer-store-link { justify-self: center; }
}
