/* Enyaar — soft pastel theme with dot, stripe and wave patterns */
:root{
  --bg:#fbf7f0;
  --dot:#e7dccb;
  --surface:#ffffff;
  --ink:#21242d;
  --muted:#545a66;
  --line:#ece3d4;
  --accent:#b8432a;          /* links, highlights (5:1 on cream) */
  --btn:#21242d;--btn-ink:#fffaf2;
  --peach:#ffdccb;--mint:#cfeedf;--lav:#e3ddff;--butter:#fff0b8;--sky:#d4e9ff;
  --peach-2:#ffb99a;--mint-2:#8fd6b4;--lav-2:#b9adff;--butter-2:#ffd864;--sky-2:#9cc9f5;
  --shadow:0 1px 0 rgba(255,255,255,.8) inset,0 24px 48px -28px rgba(70,45,20,.35),0 2px 6px -2px rgba(70,45,20,.08);
  --shadow-sm:0 12px 24px -16px rgba(70,45,20,.35),0 1px 3px rgba(70,45,20,.08);
  --focus:#3b5bdb;
  --r-lg:32px;--r:24px;--r-sm:14px;
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#161821;--dot:#272a37;--surface:#1f222d;--ink:#f1eee8;--muted:#b7b9c3;--line:#2e3241;
    --accent:#ff9f80;--btn:#f1eee8;--btn-ink:#161821;
    --peach:#3d2a26;--mint:#1f3a31;--lav:#2c2a48;--butter:#3b3420;--sky:#1f3049;
    --peach-2:#a8634c;--mint-2:#3f8c6b;--lav-2:#6f63c4;--butter-2:#a88a2e;--sky-2:#4479ad;
    --shadow:0 24px 48px -28px rgba(0,0,0,.8),0 2px 6px rgba(0,0,0,.3);
    --shadow-sm:0 12px 24px -16px rgba(0,0,0,.8);
    --focus:#9db4ff;color-scheme:dark;
  }
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:clip}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
body{margin:0;color:var(--ink);background-color:var(--bg);
  background-image:radial-gradient(var(--dot) 1.3px,transparent 1.4px);background-size:22px 22px;
  font:16px/1.65 "Nunito","Avenir Next","Segoe UI Variable","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;overflow-x:clip}
h1,h2,h3,.brand{font-family:"Avenir Next","Nunito","Segoe UI Variable Display","Segoe UI",system-ui,sans-serif}
a{color:var(--accent);text-underline-offset:3px}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:12px}
.skip{position:absolute;left:-999px;top:12px;background:var(--btn);color:var(--btn-ink);padding:10px 16px;border-radius:12px;z-index:10}
.skip:focus{left:16px}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px;position:relative}
@media (min-width:720px){.wrap{padding:0 32px}}

/* Header */
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:20px 0;position:relative;z-index:2}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink);font-weight:800;font-size:21px;letter-spacing:-.02em}
.brand-mark{width:42px;height:42px;display:block;border-radius:13px;box-shadow:var(--shadow-sm)}
.nav{display:flex;gap:2px;flex-wrap:wrap;background:color-mix(in srgb,var(--surface) 80%,transparent);border:1px solid var(--line);border-radius:999px;padding:4px;box-shadow:var(--shadow-sm);backdrop-filter:blur(8px)}
.nav a{color:var(--ink);text-decoration:none;font-weight:700;font-size:14px;padding:8px 14px;border-radius:999px;min-height:40px;display:inline-flex;align-items:center}
.nav a:hover{background:var(--butter)}
.nav a[aria-current="page"]{background:var(--btn);color:var(--btn-ink)}
@media (max-width:600px){.nav .hide-sm{display:none}.nav a{padding:8px 11px}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 24px;border-radius:999px;font-weight:800;font-size:16px;text-decoration:none;border:2px solid var(--btn);transition:transform .18s,box-shadow .18s}
.btn-primary{background:var(--btn);color:var(--btn-ink);box-shadow:4px 4px 0 var(--peach-2)}
.btn-primary:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--peach-2)}
.btn-soft{background:var(--surface);color:var(--ink)}
.btn-soft:hover{background:var(--butter)}

/* Decorative blobs */
.blob{position:absolute;border-radius:50%;filter:blur(50px);opacity:.7;z-index:0;pointer-events:none}
.b1{width:340px;height:340px;background:var(--peach);top:40px;right:-60px}
.b2{width:280px;height:280px;background:var(--lav);top:300px;left:-120px}
.b3{width:240px;height:240px;background:var(--mint);top:420px;right:28%}

/* Hero */
.hero{position:relative;z-index:1;display:grid;gap:44px;align-items:center;padding:32px 0 72px}
@media (min-width:920px){.hero{grid-template-columns:1.05fr .95fr;padding:56px 0 96px}}
.tag{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:7px 14px;border-radius:999px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm)}
.tag i{width:8px;height:8px;border-radius:50%;background:#2f9e6b;display:inline-block}
h1{font-size:clamp(40px,7.4vw,72px);line-height:1.02;letter-spacing:-.04em;margin:22px 0 18px;font-weight:800}
.mark{position:relative;white-space:nowrap;z-index:0}
.mark::after{content:"";position:absolute;left:-4px;right:-4px;bottom:.06em;height:.38em;background:var(--butter-2);border-radius:8px;z-index:-1;transform:rotate(-1.5deg)}
.squiggle{display:block;width:150px;height:14px;margin-top:6px;color:var(--peach-2)}
.lead{font-size:clamp(17px,2.1vw,20px);color:var(--muted);max-width:540px;margin:0 0 30px}
.actions{display:flex;flex-wrap:wrap;gap:16px}
.trust{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:28px;color:var(--muted);font-weight:700;font-size:14px}
.trust span::before{content:"✓";color:#2f9e6b;margin-right:6px}

/* Hero card stack */
.stack{position:relative;height:440px;max-width:460px;width:100%;margin:0 auto}
.gcard{position:absolute;width:62%;aspect-ratio:3/4;border-radius:var(--r-lg);padding:22px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:var(--shadow);border:2px solid var(--ink);color:#21242d;overflow:hidden}
.gcard .emoji{font-size:54px;line-height:1}
.gcard strong{font-size:22px;letter-spacing:-.02em;position:relative}
.gcard small{display:block;font-weight:700;opacity:.75;position:relative}
.gcard.c1{left:0;top:40px;transform:rotate(-8deg);background-color:#cfeedf}
.gcard.c2{left:19%;top:8px;transform:rotate(2deg);background-color:#fff0b8;z-index:1}
.gcard.c3{right:0;top:70px;transform:rotate(9deg);background-color:#e3ddff;z-index:2}
.gcard.c1{background-image:repeating-linear-gradient(-45deg,rgba(33,36,45,.07) 0 6px,transparent 6px 16px)}
.gcard.c2{background-image:radial-gradient(rgba(33,36,45,.12) 1.6px,transparent 1.8px);background-size:14px 14px}
.gcard.c3{background-image:radial-gradient(circle at 100% 100%,transparent 18px,rgba(33,36,45,.08) 19px 22px,transparent 23px);background-size:30px 30px}
.spark{position:absolute;font-size:28px;color:var(--accent);z-index:3}
.s1{top:0;right:12%}.s2{bottom:30px;left:4%;font-size:22px;color:var(--lav-2)}
@media (max-width:520px){.stack{height:360px;width:84%}.gcard{padding:16px}.gcard .emoji{font-size:42px}.gcard strong{font-size:18px}}

/* Game ribbon */
.ribbon{position:relative;z-index:1;background:var(--btn);color:var(--btn-ink);transform:rotate(-1.2deg);margin:0 calc(50% - 50vw - 20px);padding:16px 0;overflow:hidden;border-block:2px solid var(--btn)}
.ribbon ul{display:flex;gap:34px;list-style:none;margin:0;padding:0 40px;white-space:nowrap;font-weight:800;font-size:18px;animation:slide 38s linear infinite;width:max-content}
.ribbon li::before{content:"✳";margin-right:34px;color:var(--butter-2)}
@keyframes slide{to{transform:translateX(-50%)}}

/* Sections */
section{padding:72px 0;position:relative;z-index:1}
.head{max-width:640px;margin-bottom:36px}
h2{font-size:clamp(30px,4.6vw,46px);line-height:1.08;letter-spacing:-.03em;margin:16px 0 12px;font-weight:800}
.head p{color:var(--muted);margin:0;font-size:18px}
.grid{display:grid;gap:22px}
@media (min-width:760px){.grid-3{grid-template-columns:repeat(3,1fr)}}
.card{border-radius:var(--r-lg);padding:28px;border:1px solid var(--line);background:var(--surface);box-shadow:var(--shadow);position:relative;overflow:hidden}
.card h3{font-size:21px;margin:18px 0 8px;letter-spacing:-.01em}
.card p{margin:0;color:var(--muted)}
.icon{width:58px;height:58px;border-radius:18px;display:grid;place-items:center;font-size:26px;border:2px solid var(--ink)}
.pat-dots{background-image:radial-gradient(rgba(33,36,45,.13) 1.5px,transparent 1.7px);background-size:10px 10px}
.pat-stripes{background-image:repeating-linear-gradient(45deg,rgba(33,36,45,.1) 0 4px,transparent 4px 10px)}
.pat-grid{background-image:linear-gradient(rgba(33,36,45,.1) 1px,transparent 1px),linear-gradient(90deg,rgba(33,36,45,.1) 1px,transparent 1px);background-size:10px 10px}
.peach{background-color:var(--peach)}.mint{background-color:var(--mint)}.lav{background-color:var(--lav)}.butter{background-color:var(--butter)}.sky{background-color:var(--sky)}

/* Feature panel */
.panel{border-radius:40px;border:2px solid var(--ink);background:var(--butter);padding:34px 22px;box-shadow:8px 8px 0 var(--ink);position:relative;overflow:hidden;color:#21242d}
@media (min-width:720px){.panel{padding:52px}}
.panel::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(33,36,45,.12) 1.6px,transparent 1.8px);background-size:18px 18px;pointer-events:none}
.panel>*{position:relative}
.panel .tag{color:#21242d;background:#fff;border-color:#21242d33}
.panel h2{color:#21242d}
.panel .lead{color:#3c4150}
.feature{display:grid;gap:34px;align-items:center}
@media (min-width:920px){.feature{grid-template-columns:1fr 1fr}}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:24px 0 30px}
.stat{border-radius:20px;background:#fff;border:2px solid #21242d;padding:14px 8px;text-align:center}
.stat strong{display:block;font-size:clamp(24px,4vw,32px);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.stat span{font-size:13px;font-weight:700;color:#3c4150}
.panel .btn-primary{background:#21242d;color:#fffaf2;border-color:#21242d}
.games{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;list-style:none;padding:0;margin:0}
.games li{display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:16px;background:#fff;border:2px solid #21242d;font-weight:800;font-size:15px}
.games li span{font-size:20px}

/* Wave divider */
.wave{display:block;width:100%;height:28px;color:var(--line)}

/* FAQ */
.faq-grid{display:grid;gap:14px}
@media (min-width:860px){.faq-wrap{display:grid;grid-template-columns:.8fr 1.2fr;gap:40px;align-items:start}}
.faq details{background:var(--surface);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow-sm);padding:2px 22px}
.faq summary{cursor:pointer;font-weight:800;padding:16px 0;min-height:44px;list-style:none;display:flex;justify-content:space-between;gap:16px;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:22px;line-height:1;width:32px;height:32px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--butter);color:#21242d}
.faq details[open] summary::after{content:"–";background:var(--mint)}
.faq details p{margin:0 0 18px;color:var(--muted)}

/* Contact */
.contact{text-align:center;border-radius:40px;padding:52px 22px;border:2px solid var(--ink);box-shadow:8px 8px 0 var(--ink);background-color:var(--lav);color:#21242d;position:relative;overflow:hidden}
.contact::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(-45deg,rgba(33,36,45,.06) 0 8px,transparent 8px 22px);pointer-events:none}
.contact>*{position:relative}
.contact h2{color:#21242d}
.contact p{color:#3c4150;max-width:520px;margin:0 auto 26px}
.contact .tag{color:#21242d;background:#fff;border-color:#21242d33}
.contact .btn{background:#fff;color:#21242d;border-color:#21242d;box-shadow:4px 4px 0 #21242d;word-break:break-all}

/* Footer */
.foot{padding:36px 0 48px;margin-top:48px;border-top:1px dashed var(--line);display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;color:var(--muted);font-size:14px;position:relative;z-index:1}
.foot nav{display:flex;flex-wrap:wrap;gap:4px 18px}
.foot a{color:var(--ink);min-height:44px;display:inline-flex;align-items:center;font-weight:700}

/* Document pages */
.doc{max-width:780px;margin:24px auto 0;background:var(--surface);border:1px solid var(--line);border-radius:36px;box-shadow:var(--shadow);padding:34px 22px;position:relative;z-index:1;overflow:hidden}
.doc::before{content:"";position:absolute;left:0;right:0;top:0;height:10px;background:linear-gradient(90deg,var(--peach-2),var(--butter-2),var(--mint-2),var(--sky-2),var(--lav-2))}
@media (min-width:720px){.doc{padding:56px 60px}}
.doc h1{font-size:clamp(34px,5vw,50px);margin-top:4px}
.doc h2{font-size:22px;margin:34px 0 8px;letter-spacing:-.01em}
.doc p,.doc li{color:var(--muted)}
.doc strong{color:var(--ink)}
.doc .updated{display:inline-block;font-size:14px;font-weight:800;background:var(--butter);color:#21242d;padding:4px 12px;border-radius:999px}
.doc ul{padding-left:22px}
.doc .btn{margin:6px 8px 0 0}


/* 3D games cards */
@media (min-width:1000px){.grid-4{grid-template-columns:repeat(4,1fr)}}
.play-card{text-decoration:none;color:var(--ink);transition:transform .15s}
.play-card:hover{transform:translateY(-3px)}