:root{--bg:#031429;--panel:#0b2d4b;--accent:#9fb6ff;--accent2:#67f1d2;--text:#eff7ff;--muted:#a8c0d5;--line:rgba(255,255,255,.15);--r:26px;font-family:Georgia,serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);line-height:1.65;overflow-wrap:anywhere}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.site-head{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:28px;min-height:80px;padding:12px 4vw;background:rgba(5,5,8,.91);border-bottom:1px solid var(--line);backdrop-filter:blur(15px)}.logo{font-weight:950;letter-spacing:.06em}.logo small{display:block;color:var(--muted);font-size:9px}.site-head nav{display:flex;gap:22px;margin-left:auto;color:var(--muted);font-size:13px}.head-actions,.hero-actions{display:flex;gap:10px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 22px;border:1px solid var(--line);border-radius:999px;font-weight:900}.primary{background:var(--accent);border-color:var(--accent);color:#08070a;box-shadow:0 0 24px color-mix(in srgb,var(--accent) 30%,transparent)}.ghost{border-color:var(--accent2);color:var(--text)}.large{min-height:54px;padding:0 30px}main{max-width:1500px;margin:auto;padding:0 4vw}.hero{position:relative;min-height:680px;margin:28px 0 18px;overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}.cover-hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.cover-hero:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--bg),color-mix(in srgb,var(--bg) 88%,transparent) 42%,transparent 80%)}.hero-copy{position:relative;z-index:3;width:min(720px,58%);padding:85px 62px}.hero h1{margin:0 0 24px;font-size:clamp(40px,5.3vw,80px);line-height:.98;letter-spacing:-.045em}.hero-copy>p:not(.eyebrow){color:var(--muted);font-size:17px}.eyebrow{margin:0 0 12px;color:var(--accent);font-size:11px;font-weight:900;letter-spacing:.18em}.stats{position:absolute;z-index:4;right:22px;bottom:22px;display:flex;gap:8px}.stats article{min-width:125px;padding:13px 16px;border:1px solid var(--line);border-radius:12px;background:rgba(4,4,8,.76);backdrop-filter:blur(12px)}.stats span{color:var(--accent);font-weight:900}.stats p{margin:0;color:var(--muted);font-size:10px}.split-hero{display:grid;grid-template-columns:53% 47%;min-height:640px}.split-hero figure{margin:0}.split-hero figure img{width:100%;height:100%;object-fit:cover}.split-hero .hero-copy{width:auto;padding:65px 45px}.split-hero .stats{right:35px}.quick{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:70px}.quick a{display:flex;gap:13px;align-items:center;padding:20px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);font-weight:900}.quick span{color:var(--accent);font-size:11px}.section{padding:75px 0;border-top:1px solid var(--line)}.section>header{display:grid;grid-template-columns:70px minmax(0,1fr);gap:25px;max-width:1080px;margin-bottom:32px}.section>header>span{color:var(--accent);font-size:38px;font-weight:900;line-height:1}.section>header p{margin:0;color:var(--accent);font-size:11px;letter-spacing:.18em}.section h2,.faq h2,.final h2{margin:0;font-size:clamp(30px,4vw,52px);line-height:1.05;letter-spacing:-.035em}.intro,.section-copy{color:var(--muted);margin-top:18px}.section-copy{columns:2;column-gap:50px}.section-copy p{margin:0 0 20px}.semantic-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.semantic-grid p{margin:0;padding:19px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel);color:var(--muted)}.query{color:var(--text);font-weight:900}.games{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.game-card{overflow:hidden;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}.game-card img{width:100%;aspect-ratio:1.35;object-fit:cover}.game-card div{padding:16px}.game-card small{color:var(--accent);font-size:9px}.game-card h3{margin:5px 0 0;font-size:19px}.game-card p{margin:0 0 12px;color:var(--muted);font-size:11px}.game-card a,.inline-link{color:var(--accent);font-weight:900}.mechanics{display:grid;grid-template-columns:140px 1fr;gap:25px;margin-top:20px;padding:23px;border-left:4px solid var(--accent);background:var(--panel)}.mechanics span{color:var(--accent);font-weight:900}.mechanics p{margin:0;color:var(--muted)}.editorial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.editorial-grid article{position:relative;min-height:210px;padding:25px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}.editorial-grid article>span{display:block;margin-bottom:14px;color:var(--accent);font-size:12px;font-weight:900;letter-spacing:.15em}.editorial-grid p{margin:0;color:var(--muted)}.faq{display:grid;grid-template-columns:38% 1fr;gap:45px;padding:70px 0;border-top:1px solid var(--line)}details{padding:16px 0;border-bottom:1px solid var(--line)}summary{font-weight:900;cursor:pointer}details p{color:var(--muted)}.final{display:flex;align-items:center;justify-content:space-between;gap:25px;margin:60px 0;padding:40px;border:1px solid var(--line);border-radius:var(--r);background:var(--panel)}footer{display:grid;grid-template-columns:220px 1fr auto;gap:35px;align-items:center;padding:35px 4vw;border-top:1px solid var(--line);color:var(--muted);font-size:12px}.rail{position:fixed;left:0;top:0;bottom:0;z-index:25;width:54px;display:flex;flex-direction:column;align-items:center;gap:28px;padding-top:25px;background:#040404;border-right:1px solid var(--line);color:var(--accent)}.vault,.gallery{padding-left:54px}.medallion-head{border-bottom-color:var(--accent2)}.ticker{margin-left:auto;color:var(--accent);font-size:11px;letter-spacing:.14em}.dashboard .quick,.command .quick{position:relative;z-index:5;transform:translateY(-35px);margin-bottom:30px}.dashboard .quick a,.command .quick a{backdrop-filter:blur(14px)}.refinery .section{border-top-style:dashed}.refinery .semantic-grid{grid-template-columns:1fr}.refinery .semantic-grid p{display:grid;grid-template-columns:38% 62%;border-radius:0}.showroom .games{grid-template-columns:repeat(2,1fr)}.showroom .game-card{display:grid;grid-template-columns:42% 1fr}.showroom .game-card img{height:100%;aspect-ratio:auto}.retro .site-head{background:#1a100b}.retro .section:nth-of-type(even){padding-left:35px;padding-right:35px;background:linear-gradient(135deg,transparent,var(--panel));border-radius:var(--r)}.lab .cover-hero:after{background:linear-gradient(90deg,rgba(237,241,242,.1),rgba(237,241,242,.85) 56%,rgba(237,241,242,.98))}.lab .split-hero{border-color:#b7c2c5}.lab .section{border-top-color:#cbd3d6}.theatre .hero{border-radius:38px 38px 8px 8px}.theatre .section h2{text-transform:uppercase}.gallery .games{grid-template-columns:repeat(2,1fr)}@media(max-width:900px){.site-head nav,.ticker{display:none}.head-actions{margin-left:auto}.hero{min-height:740px}.cover-hero:after{background:linear-gradient(180deg,var(--bg),color-mix(in srgb,var(--bg) 88%,transparent) 65%,transparent)}.hero-copy{width:100%;padding:52px 25px}.split-hero{display:block}.split-hero figure{height:340px}.split-hero .hero-copy{padding:35px 25px}.stats{left:20px;right:20px;overflow:auto}.quick{grid-template-columns:repeat(2,1fr)}.games,.showroom .games,.gallery .games{grid-template-columns:repeat(2,1fr)}.showroom .game-card{display:block}.semantic-grid{grid-template-columns:1fr}.section-copy{columns:1}.editorial-grid{grid-template-columns:1fr 1fr}.faq{grid-template-columns:1fr}.rail{display:none}.vault,.gallery{padding-left:0}footer{grid-template-columns:1fr}}@media(max-width:560px){.head-actions .ghost{display:none}.button{padding:0 15px}.hero h1{font-size:40px}.hero-actions{flex-direction:column}.hero{min-height:820px}.split-hero{min-height:940px}.stats article{min-width:112px}.quick{grid-template-columns:1fr 1fr}.games,.showroom .games,.gallery .games{grid-template-columns:1fr}.editorial-grid{grid-template-columns:1fr}.section{padding:52px 0}.section>header{grid-template-columns:45px 1fr}.mechanics{grid-template-columns:1fr}.final{display:block;padding:25px 20px}.final .hero-actions{margin-top:22px}footer{padding:28px 20px}}

/* mellgamies-inspired-7k-v1 */
.mell-grid {
  --bg: #190127;
  --panel: #2a1b2c;
  --panel-2: #3c2943;
  --panel-3: #482d4b;
  --accent: #b633fe;
  --accent2: #35ec90;
  --text: #ffffff;
  --muted: #c4c4c4;
  --line: rgba(255, 255, 255, .12);
  --r: 16px;
  min-width: 280px;
  background:
    radial-gradient(circle at 79% 8%, rgba(182, 51, 254, .16), transparent 30rem),
    linear-gradient(180deg, #190127 0, #1d1a1c 42rem, #190127 100%);
  color: var(--text);
  font-family: Poppins, Inter, Arial, sans-serif;
}
.mell-grid .rail {
  position: fixed;
  inset: 0 auto 0 0;
  z-index: 30;
  display: flex;
  width: 82px;
  padding: 14px 8px;
  gap: 8px;
  border-right: 1px solid rgba(255, 255, 255, .08);
  background: rgba(25, 1, 39, .96);
  box-shadow: 16px 0 40px rgba(0, 0, 0, .2);
}
.mell-grid .rail a {
  display: flex;
  width: 66px;
  min-height: 62px;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: 7px 4px;
  border-radius: 12px;
  color: #c4c4c4;
}
.mell-grid .rail a:hover { background: #3c2943; color: #fff; }
.mell-grid .rail .rail-icon { color: #b633fe; font-size: 17px; font-weight: 800; }
.mell-grid .rail a small { font-size: 9px; line-height: 1.1; }
.mell-grid .rail .rail-brand {
  min-height: 58px;
  margin-bottom: 18px;
  background: linear-gradient(249deg, #8108e0 31%, #ff39b0 105%);
  color: #fff;
  font-size: 22px;
  font-weight: 950;
}
.mell-grid .site-head,
.mell-grid main,
.mell-grid footer { margin-left: 82px; }
.mell-grid .site-head {
  top: 0;
  min-height: 74px;
  padding: 10px 28px;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  background: rgba(29, 26, 28, .92);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .16);
}
.mell-grid .logo { display: flex; align-items: center; gap: 10px; color: #fff; }
.mell-grid .brand-tile {
  display: inline-flex;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background: linear-gradient(249deg, #8108e0 31%, #ff39b0 105%);
  box-shadow: 0 0 22px rgba(182, 51, 254, .3);
}
.mell-grid .logo small { color: #a1a1a1; }
.mell-grid .site-head nav { color: #c4c4c4; }
.mell-grid .site-head nav a { padding: 8px 12px; border-radius: 10px; }
.mell-grid .site-head nav a:hover { background: #3c2943; color: #fff; }
.mell-grid .button {
  min-height: 44px;
  border-radius: 10px;
  border-color: rgba(255, 255, 255, .16);
  transition: transform .18s ease, filter .18s ease;
}
.mell-grid .button:hover { transform: translateY(-2px); filter: brightness(1.1); }
.mell-grid .button.primary {
  border-color: #35ec90;
  background: linear-gradient(254deg, #adff00 2%, #00ea25 95%);
  color: #07120a;
  box-shadow: 0 10px 24px rgba(0, 234, 37, .18);
}
.mell-grid .button.ghost {
  border-color: #b633fe;
  background: rgba(182, 51, 254, .1);
  color: #fff;
}
.mell-grid main {
  width: auto;
  max-width: none;
  padding: 0 30px;
}
.mell-grid .hero.cover-hero {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-height: 0;
  max-width: 1540px;
  margin: 24px auto 16px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 18px;
  background:
    radial-gradient(circle at 86% 12%, rgba(255, 57, 176, .22), transparent 25rem),
    linear-gradient(118deg, #2e2147 0%, #36212a 102%);
  box-shadow: 0 22px 60px rgba(0, 0, 0, .24);
}
.mell-grid .cover-hero > img {
  filter: saturate(.9) hue-rotate(24deg) contrast(1.08) brightness(.72);
}
.mell-grid .cover-hero::after {
  display: none;
}
.mell-grid .hero-copy {
  width: min(980px, 100%);
  padding: 58px 54px 30px;
}
.mell-grid .hero h1 {
  max-width: 760px;
  margin-bottom: 18px;
  font-size: clamp(38px, 4.8vw, 68px);
  line-height: 1;
}
.mell-grid .hero-copy > p:not(.eyebrow) { color: #d9d2dc; }
.mell-grid .eyebrow { color: #35ec90; }
.mell-grid .stats {
  position: static;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 54px 34px;
}
.mell-grid .stats article {
  min-width: 128px;
  border-color: rgba(255, 255, 255, .12);
  border-radius: 12px;
  background: rgba(42, 27, 44, .88);
}
.mell-grid .stats span { color: #35ec90; }
.mell-grid .stats p { color: #c4c4c4; }
.mell-grid .quick {
  max-width: 1540px;
  margin: 0 auto 24px;
  gap: 8px;
  padding: 10px;
  border: 1px solid rgba(255, 255, 255, .08);
  border-radius: 16px;
  background: #2a1b2c;
}
.mell-grid .quick a {
  min-height: 58px;
  padding: 14px 18px;
  border-color: transparent;
  border-radius: 11px;
  background: #3c2943;
  color: #fff;
}
.mell-grid .quick a:hover { background: #482d4b; }
.mell-grid .quick span { color: #35ec90; }
.mell-grid .section,
.mell-grid .faq,
.mell-grid .final {
  max-width: 1540px;
  margin-right: auto;
  margin-left: auto;
}
.mell-grid .section {
  margin-top: 18px;
  padding: 38px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 18px;
  background: rgba(42, 27, 44, .88);
}
.mell-grid .section > header { margin-bottom: 24px; }
.mell-grid .section > header > span {
  display: inline-flex;
  width: 52px;
  height: 52px;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background: linear-gradient(249deg, rgba(129, 8, 224, .46), rgba(255, 57, 176, .42));
  color: #fff;
  font-size: 20px;
}
.mell-grid .section > header p { color: #35ec90; }
.mell-grid .section h2,
.mell-grid .faq h2,
.mell-grid .final h2 { font-size: clamp(28px, 3.3vw, 48px); }
.mell-grid .intro,
.mell-grid .section-copy { color: #c4c4c4; }
.mell-grid .semantic-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
}
.mell-grid .semantic-grid p {
  padding: 16px;
  border-color: rgba(255, 255, 255, .09);
  border-radius: 12px;
  background: #3c2943;
  color: #c4c4c4;
}
.mell-grid .query { color: #fff; }
.mell-grid .games {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.mell-grid .game-card {
  border-color: rgba(255, 255, 255, .1);
  border-radius: 14px;
  background: #3c2943;
  transition: transform .18s ease, border-color .18s ease;
}
.mell-grid .game-card:hover { transform: translateY(-4px); border-color: rgba(182, 51, 254, .72); }
.mell-grid .game-card img {
  height: 152px;
  aspect-ratio: auto;
  object-fit: cover;
  filter: saturate(1.08) contrast(1.04);
}
.mell-grid .game-card div { padding: 15px; }
.mell-grid .game-card small { color: #35ec90; }
.mell-grid .game-card p { color: #a1a1a1; }
.mell-grid .game-card a,
.mell-grid .inline-link { color: #35ec90; }
.mell-grid .mechanics {
  border: 1px solid rgba(255, 255, 255, .09);
  border-left: 5px solid #b633fe;
  border-radius: 12px;
  background: #3c2943;
}
.mell-grid .mechanics span { color: #35ec90; }
.mell-grid .mechanics p { color: #c4c4c4; }
.mell-grid .editorial-grid { gap: 10px; }
.mell-grid .editorial-grid article {
  min-height: 190px;
  border-color: rgba(255, 255, 255, .09);
  border-radius: 14px;
  background: #3c2943;
}
.mell-grid .editorial-grid article:nth-child(3n + 2) { background: #482d4b; }
.mell-grid .editorial-grid article > span { color: #35ec90; }
.mell-grid .editorial-grid p { color: #c4c4c4; }
.mell-grid .faq {
  margin-top: 18px;
  padding: 38px;
  border: 1px solid rgba(255, 255, 255, .09);
  border-radius: 18px;
  background: #2a1b2c;
}
.mell-grid details { border-bottom-color: rgba(255, 255, 255, .12); }
.mell-grid details p { color: #c4c4c4; }
.mell-grid .final {
  border-color: rgba(182, 51, 254, .4);
  border-radius: 18px;
  background: linear-gradient(249deg, rgba(129, 8, 224, .42), rgba(255, 57, 176, .3));
}
.mell-grid footer {
  border-top-color: rgba(255, 255, 255, .1);
  background: #1d1a1c;
  color: #a1a1a1;
}

@media (min-width: 1380px) {
  .mell-grid .games { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

@media (max-width: 1050px) {
  .mell-grid .semantic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mell-grid .hero-copy { width: 72%; }
}

@media (max-width: 900px) {
  .mell-grid .rail { display: none; }
  .mell-grid .site-head,
  .mell-grid main,
  .mell-grid footer { margin-left: 0; }
  .mell-grid main { padding: 0 16px; }
  .mell-grid .hero.cover-hero { min-height: 0; }
  .mell-grid .hero-copy { width: 100%; padding: 44px 30px 24px; }
  .mell-grid .stats { margin: 0 30px 30px; }
  .mell-grid .games { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 580px) {
  .mell-grid .site-head { padding: 9px 14px; }
  .mell-grid .brand-tile { width: 38px; height: 38px; }
  .mell-grid .hero.cover-hero { min-height: 0; border-radius: 14px; }
  .mell-grid .hero-copy { padding: 36px 20px 22px; }
  .mell-grid .hero h1 { font-size: 39px; }
  .mell-grid .stats { grid-template-columns: 1fr; margin: 0 20px 24px; }
  .mell-grid .quick { grid-template-columns: 1fr 1fr; }
  .mell-grid .section,
  .mell-grid .faq { padding: 24px 18px; border-radius: 14px; }
  .mell-grid .semantic-grid,
  .mell-grid .games { grid-template-columns: 1fr; }
  .mell-grid .game-card { display: grid; grid-template-columns: 124px minmax(0, 1fr); }
  .mell-grid .game-card img { height: 100%; min-height: 138px; }
}
