@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700;800;900&family=Playfair+Display:wght@600;700&display=swap');
:root{--bg:#090d1b;--bg2:#10162a;--card:rgba(23,30,55,.78);--text:#f4f0ff;--muted:#b8b4ca;--line:rgba(255,255,255,.1);--pink:#ff9fca;--lav:#b9a2ff;--mint:#82e4c3;--gold:#ffd88a;--shadow:0 22px 70px rgba(0,0,0,.35)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 15% 10%,#29214b 0,transparent 30%),radial-gradient(circle at 85% 30%,#182f4a 0,transparent 28%),var(--bg);color:var(--text);font-family:Nunito,sans-serif;line-height:1.65;min-height:100vh}.sky{position:fixed;inset:0;pointer-events:none;opacity:.45;background-image:radial-gradient(#fff 1px,transparent 1.5px),radial-gradient(#c9b8ff 1px,transparent 1.5px);background-size:90px 90px,140px 140px;background-position:20px 10px,70px 60px}header,main,footer{position:relative}header{height:78px;max-width:1180px;margin:auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between}.brand{font-weight:900;letter-spacing:3px;text-decoration:none;color:var(--text);font-size:1.15rem}nav{display:flex;gap:8px}nav a{color:var(--muted);text-decoration:none;padding:9px 14px;border-radius:99px;font-weight:800}nav a:hover{color:var(--text);background:rgba(255,255,255,.07)}#theme{border:1px solid var(--line);background:var(--card);color:var(--gold);width:42px;height:42px;border-radius:50%;font-size:18px;cursor:pointer}main{max-width:1180px;margin:auto;padding:28px 24px 90px}.hero{min-height:650px;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:50px}.eyebrow{color:var(--mint);font-weight:900;letter-spacing:3px;font-size:.75rem;margin:0 0 12px}h1,h2{font-family:'Playfair Display',serif;line-height:1.05;margin:.1em 0}h1{font-size:clamp(3.4rem,7vw,6.5rem);letter-spacing:-3px}h1 em{color:var(--pink);font-style:normal}h2{font-size:clamp(2rem,4vw,3.2rem)}h3{font-size:1.35rem;margin:8px 0}.lead{font-size:1.2rem;max-width:620px;color:var(--muted)}.actions{display:flex;gap:12px;margin:30px 0}.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 21px;border-radius:16px;text-decoration:none;font-weight:900;color:var(--text);border:1px solid var(--line);background:rgba(255,255,255,.05);transition:.25s}.btn:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.primary{background:linear-gradient(135deg,var(--pink),#bd91ff);border:0;color:#25162f}.chips{display:flex;flex-wrap:wrap;gap:10px}.chips span{padding:7px 12px;border:1px solid var(--line);border-radius:99px;color:var(--muted);font-size:.85rem}.orb{height:440px;width:440px;max-width:100%;margin:auto;border-radius:48% 52% 56% 44%;background:radial-gradient(circle at 35% 30%,#ffd5e6,transparent 18%),linear-gradient(145deg,#39275e,#173a51);box-shadow:0 0 90px #a16cff33,inset 0 0 70px #fff2;position:relative;display:grid;place-items:center;animation:float 6s ease-in-out infinite}.mascot{font-size:160px;filter:drop-shadow(0 18px 18px #0007);animation:bob 3s ease-in-out infinite}.orb i,.orb b,.orb strong{position:absolute;font-style:normal;font-size:40px;color:var(--gold);animation:twinkle 2.5s infinite}.orb i{top:15%;left:15%}.orb b{right:10%;bottom:18%}.orb strong{right:15%;top:18%}.panel,.callout,.story article,.grid article{background:linear-gradient(145deg,rgba(34,42,72,.88),rgba(18,24,46,.82));border:1px solid var(--line);box-shadow:var(--shadow);border-radius:28px}.panel{padding:48px;margin:60px 0}.intro{text-align:center;max-width:850px;margin:20px auto 60px}.intro p:last-child{color:var(--muted);font-size:1.08rem}.grid{display:grid;gap:18px}.three{grid-template-columns:repeat(3,1fr)}.two{grid-template-columns:repeat(2,1fr)}.grid article{padding:28px;transition:.25s}.grid article:hover{transform:translateY(-5px);border-color:#ffffff28}.grid article>span,.story article>span{font-size:2.2rem}.grid p,.story p{color:var(--muted);margin-bottom:0}.callout{padding:42px;display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:60px}.page-head{text-align:center;max-width:850px;margin:55px auto}.page-head>p:last-child{color:var(--muted);font-size:1.1rem}.map{position:relative;border-radius:30px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow)}.map img{display:block;width:100%;max-height:680px;object-fit:cover;opacity:.88}.map-glow{position:absolute;inset:0;background:linear-gradient(transparent 65%,#090d1b99)}.regions{margin-top:28px}.story{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.story article{padding:34px}.controls{position:sticky;top:8px;z-index:3;background:rgba(9,13,27,.85);backdrop-filter:blur(18px);padding:16px;border:1px solid var(--line);border-radius:22px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}.controls label{flex:1;min-width:220px;background:var(--card);border:1px solid var(--line);padding:10px 14px;border-radius:14px}.controls input{background:none;border:0;outline:0;color:var(--text);font:inherit;width:90%}#filters{display:flex;gap:7px;overflow:auto;max-width:100%}#filters button{white-space:nowrap;border:1px solid var(--line);background:rgba(255,255,255,.04);color:var(--muted);padding:8px 12px;border-radius:99px;font:700 .8rem Nunito;cursor:pointer}#filters button.active{background:var(--lav);color:#191225;border-color:transparent}.count{color:var(--muted);font-weight:800}.codex{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.codex-card{background:linear-gradient(150deg,rgba(38,45,78,.9),rgba(17,22,43,.94));border:1px solid var(--line);border-radius:24px;padding:22px;transition:.25s;overflow:hidden}.codex-card:hover{transform:translateY(-5px);box-shadow:0 20px 50px #0005;border-color:#c7b5ff55}.card-top{display:flex;justify-content:space-between;align-items:center}.element{color:var(--mint);font-weight:900;font-size:.78rem;letter-spacing:1px}.id{color:#77738e;font-size:.72rem}.codex-card h2{font-family:Nunito;font-size:1.7rem;margin:10px 0 16px}.stages{display:grid;gap:7px}.stage{display:grid;grid-template-columns:24px 1fr auto;align-items:center;gap:7px;padding:8px 9px;border-radius:11px;background:#ffffff06}.stage span{color:var(--lav)}.stage b{font-size:.88rem}.stage small{color:var(--muted);font-weight:700}.stage.base{background:#ff9fca14}.stage.base span{color:var(--pink)}footer{border-top:1px solid var(--line);padding:35px 24px;display:flex;justify-content:center;gap:20px;color:var(--muted);text-align:center}footer b{color:var(--text)}body.light{--bg:#f5f1ff;--bg2:#fff;--card:rgba(255,255,255,.8);--text:#29243a;--muted:#6d687d;--line:rgba(50,40,80,.12);--shadow:0 20px 60px rgba(69,52,100,.12);background:radial-gradient(circle at 15% 10%,#eadcff,transparent 30%),radial-gradient(circle at 85% 30%,#d5f4ed,transparent 28%),var(--bg)}body.light .controls{background:rgba(245,241,255,.86)}body.light .panel,body.light .callout,body.light .story article,body.light .grid article,body.light .codex-card{background:linear-gradient(145deg,#fff,#f6f1ff)}body.light .stage{background:#5b4a7a0a}@keyframes float{50%{transform:translateY(-14px) rotate(2deg)}}@keyframes bob{50%{transform:translateY(-12px)}}@keyframes twinkle{50%{opacity:.3;transform:scale(.7)}}@media(max-width:800px){header{height:auto;padding:18px;flex-wrap:wrap;gap:12px}nav{order:3;width:100%;justify-content:center;overflow:auto}.hero{grid-template-columns:1fr;min-height:auto;padding-top:40px}.orb{width:320px;height:320px}.mascot{font-size:115px}.three,.two,.story{grid-template-columns:1fr}.callout{display:block}.callout .btn{margin-top:20px}.panel{padding:30px}h1{letter-spacing:-2px}.controls{position:relative;top:auto}.codex{grid-template-columns:1fr}footer{flex-direction:column;gap:4px}}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:15px 0 55px}.stats div{padding:24px;text-align:center;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.035)}.stats b{display:block;font:700 2.5rem 'Playfair Display';color:var(--gold)}.stats span{color:var(--muted);font-weight:800;font-size:.85rem}.newsletter{display:flex;align-items:center;justify-content:space-between;gap:30px}.newsletter form{display:flex;gap:10px;min-width:390px}.newsletter input{flex:1;padding:13px 15px;border-radius:15px;border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--text);font:inherit}.wonder-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.wonder{min-height:170px;border:1px solid var(--line);border-radius:25px;background:linear-gradient(145deg,rgba(43,48,87,.8),rgba(19,25,48,.9));color:var(--text);font:900 1.1rem Nunito;cursor:pointer;transition:.25s;box-shadow:var(--shadow)}.wonder:hover{transform:translateY(-7px) rotate(1deg);border-color:var(--pink);box-shadow:0 25px 55px #0007}.magic-message{text-align:center;font-size:1.15rem;min-height:110px;display:grid;place-items:center}.codex-card{position:relative}.codex-card:before{content:'';position:absolute;width:90px;height:90px;right:-35px;top:-35px;border-radius:50%;background:var(--lav);opacity:.08}.codex-card:hover .name{color:var(--pink)}@media(max-width:800px){.stats,.wonder-grid{grid-template-columns:1fr}.newsletter{display:block}.newsletter form{min-width:0;margin-top:20px;flex-direction:column}}

.codex-error{grid-column:1/-1;text-align:center;padding:55px 25px;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,rgba(43,48,87,.85),rgba(19,25,48,.95));box-shadow:var(--shadow)}
.codex-error>span{font-size:3.5rem}.codex-error p{color:var(--muted);max-width:620px;margin:12px auto 24px}

#count {
    display: inline-block;
    background-image: var(--count-image);
    background-repeat: no-repeat;
    background-position: right;
    background-size: contain;
    padding: 10px 60px;
}