.creatures-gen-1-page{--gen1-blue:#78c8ff;--gen1-line:rgba(120,200,255,.24);background:#081c32}
.creatures-gen-1-page .eyebrow{color:var(--gen1-blue)}
.gen1-hero{padding:155px 0 80px;background:radial-gradient(ellipse at 80% 35%,rgba(35,116,223,.24),transparent 55%),linear-gradient(180deg,#07182b,#0c2945)}
.gen1-hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:65px;align-items:center}
.gen1-hero h1{font-size:clamp(3rem,6vw,5.6rem);line-height:1.1;margin-top:18px;color:#d9f0ff}
.gen1-hero p,.gen1-split p{font-size:1.08rem;margin:24px 0;max-width:650px}
.gen1-actions{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;padding:4px 0 8px;margin:30px 0}.gen1-actions .button{flex:0 0 auto;white-space:nowrap;padding:12px 14px;font-size:.87rem}
.gen1-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:34px}
.gen1-facts>div{position:relative;isolation:isolate;min-height:142px;padding:18px;border:1px solid var(--gen1-line);border-radius:17px;background:linear-gradient(145deg,rgba(16,50,80,.94),rgba(10,32,55,.96));overflow:hidden;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}
.gen1-facts>div:before{content:"";position:absolute;inset:0 0 auto;height:2px;background:linear-gradient(90deg,var(--gen1-blue),#438eef,transparent)}
.gen1-facts>div:after{content:"";position:absolute;z-index:-1;right:-44px;bottom:-54px;width:115px;height:115px;border:1px solid rgba(120,200,255,.18);border-radius:50%;transition:transform .4s ease}
.gen1-facts>div:hover{transform:translateY(-6px);border-color:var(--gen1-blue);box-shadow:0 15px 30px rgba(0,0,0,.2)}.gen1-facts>div:hover:after{transform:scale(1.18)}
.gen1-facts i{position:relative;width:28px;height:28px;display:grid;place-items:center;margin-bottom:12px;border:1px solid var(--gen1-line);border-radius:9px;color:var(--gen1-blue);font-style:normal}.gen1-facts i img{width:17px;height:17px;object-fit:contain}
.gen1-facts .cards-icon:before,.gen1-facts .cards-icon:after{content:"";position:absolute;width:10px;height:14px;border:1.5px solid var(--gen1-blue);border-radius:2px}.gen1-facts .cards-icon:before{transform:translate(-3px,1px) rotate(-10deg)}.gen1-facts .cards-icon:after{transform:translate(3px,-1px) rotate(8deg)}
.gen1-facts .search-icon:before{content:"";width:9px;height:9px;border:1.6px solid var(--gen1-blue);border-radius:50%;transform:translate(-1px,-1px)}.gen1-facts .search-icon:after{content:"";position:absolute;width:6px;height:1.6px;border-radius:2px;background:var(--gen1-blue);transform:translate(5px,5px) rotate(45deg)}
.gen1-facts small,.gen1-facts strong,.gen1-facts span{display:block}.gen1-facts small{color:var(--gen1-blue);font-size:.61rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em}.gen1-facts strong{margin-top:3px;font:800 1.08rem Manrope}.gen1-facts span{margin-top:3px;color:var(--muted);font-size:.65rem}
.gen1-world{position:relative;overflow:hidden;text-align:center;padding:36px;border:1px solid var(--gen1-line);border-radius:28px;background:radial-gradient(circle at 50% 35%,#184d80,#0b233d 70%);box-shadow:var(--shadow)}
.gen1-world .eyebrow{justify-content:center;font-size:.65rem}.gen1-world h2{font-size:1.7rem}.gen1-world p{font-size:.95rem;margin-bottom:0}
.gen1-section{padding:80px 0;scroll-margin-top:100px}.gen1-tinted{background:linear-gradient(120deg,#0d2b49,#0a2139);border-block:1px solid var(--gen1-line)}
.gen1-section-head{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:35px}.gen1-section h2,.gen1-closing h2{font-size:clamp(2rem,3.5vw,3.3rem);line-height:1.15;margin-top:12px}.gen1-section-head p{margin:0;font-size:1.05rem}
.gen1-card{padding:28px;border:1px solid var(--gen1-line);border-radius:22px;background:linear-gradient(140deg,#103250,#0a2037)}
.gen1-card h3{font-size:1.15rem;margin:16px 0 10px}.gen1-card p{font-size:.95rem;margin:0;color:var(--muted)}
.gen1-command-grid,.gen1-expedition-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.gen1-command-grid{margin-bottom:25px}
.creatures-gen-1-page code{color:var(--gen1-blue);font-weight:700}.gen1-command-grid code,.gen1-prediction>code{font-size:1.8rem}
.gen1-split{display:grid;grid-template-columns:1fr 1fr;gap:65px;align-items:center}.gen1-split>div{min-width:0}
.gen1-prediction{text-align:center}.gen1-credits{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:25px 0}.gen1-credits>div{padding:15px 4px;border:1px solid var(--gen1-line);border-radius:12px;background:#0a223c}.gen1-credits span,.gen1-credits strong,.gen1-credits small{display:block}.gen1-credits span{font-size:.72rem}.gen1-credits strong{font:800 2rem Manrope;color:var(--gen1-blue);margin:8px 0}.gen1-credits small{font-size:.6rem;color:var(--muted)}
.gen1-number{color:var(--gen1-blue);font:800 .8rem Manrope}.gen1-success{display:block;font:800 2.7rem Manrope;color:var(--gen1-blue);margin:20px 0 0}.gen1-outcomes{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.gen1-outcomes span{padding:7px 9px;border-radius:8px;font-size:.75rem;font-weight:700;background:#123f3c;color:#98e5c5}.gen1-outcomes span+span{background:#462b3d;color:#ffb6be}
.gen1-tabs{display:none}.gen1-how{margin-top:40px;padding:32px;border:1px solid var(--gen1-line);border-radius:24px;background:rgba(11,34,57,.7)}
.gen1-steps{list-style:none;padding:0;margin:12px 0 0;counter-reset:step}.gen1-steps li{counter-increment:step;display:flex;gap:16px;padding:25px 0;border-bottom:1px solid var(--line)}.gen1-steps li:last-child{border-bottom:0;padding-bottom:0}.gen1-steps li:before{content:counter(step);display:grid;place-items:center;flex:0 0 30px;height:30px;border-radius:50%;color:var(--gen1-blue);background:#1c4164;font-weight:800}.gen1-steps li>div{min-width:0;flex:1}.gen1-steps h3{font-size:1.06rem;margin-bottom:10px}.gen1-steps p{margin:0;font-size:.95rem}.gen1-steps strong{color:var(--white)}
.gen1-rarity-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:18px}.gen1-rarity-row>div{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:7px;padding:12px 5px;border:1px solid var(--gen1-line);border-radius:9px;font-size:.75rem}.gen1-rarity-row strong{color:var(--gen1-blue)}.gen1-steps .gen1-note{font-size:.8rem;margin-top:12px;color:var(--muted)}
.gen1-closing{text-align:center;padding:85px 0;background:radial-gradient(ellipse at 50% 100%,#15416c,transparent 70%)}.gen1-closing .eyebrow{justify-content:center}.gen1-closing .button{margin-top:30px}
@media(max-width:1000px){.gen1-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.gen1-hero-grid,.gen1-split{grid-template-columns:1fr;gap:40px}.gen1-world{max-width:600px;width:100%;margin:auto}.gen1-section-head{gap:30px}.gen1-hero{padding:140px 0 65px}}
@media(max-width:700px){.gen1-section{padding:55px 0}.gen1-section-head{grid-template-columns:1fr;gap:20px}.gen1-command-grid{grid-template-columns:1fr}.gen1-card{padding:22px}.gen1-world{padding:28px 20px}.gen1-facts>div{padding:16px}.gen1-hero h1{font-size:clamp(2.8rem,12vw,4rem)}.gen1-how{padding:22px 16px}.gen1-rarity-row{grid-template-columns:repeat(2,minmax(0,1fr))}.gen1-steps li{gap:10px}.gen1-credits{gap:5px}.gen1-credits strong{font-size:1.65rem}.gen1-credits small{font-size:.55rem}.gen1-tabs{display:flex;gap:6px;margin-bottom:14px}.gen1-tabs button{flex:1;min-width:0;padding:10px 5px;border:1px solid var(--gen1-line);border-radius:10px;background:#0b233d;color:var(--muted);font:700 .7rem Manrope;cursor:pointer}.gen1-tabs button[aria-selected="true"]{background:#18446b;color:#d9f0ff;border-color:var(--gen1-blue)}.gen1-expedition-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px}.gen1-expedition-grid>article{flex:0 0 100%;min-width:0;scroll-snap-align:start}.gen1-closing{padding:60px 0}}

.creatures-gen-1-page .eyebrow:before{background:var(--gen1-blue)}

.gen1-hero-art{width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;margin:28px auto;border-radius:16px;border:1px solid var(--gen1-line)}

/* Expedition artwork is 80% transparent; foreground content stays fully opaque. */
.gen1-expedition{position:relative;isolation:isolate;overflow:hidden}
.gen1-expedition:before{content:"";position:absolute;inset:0;z-index:-1;background-size:cover;background-position:center;opacity:.2;pointer-events:none}
#sunken-treasure:before{background-image:url('/assets/images/gen1-sunken-treasure.avif')}
#burning-island:before{background-image:url('/assets/images/gen1-burning-island.avif')}
#lost-temple:before{background-image:url('/assets/images/gen1-lost-temple.avif')}

.gen1-feeding-summary{display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center;padding:16px;margin:18px 0;border:1px solid var(--gen1-line);border-radius:12px;background:#103250}.gen1-feeding-summary strong{color:var(--gen1-blue)}.gen1-feeding-summary span{color:var(--muted);font-size:.85rem}.gen1-steps p+p{margin-top:16px}

.gen1-prediction{position:relative;isolation:isolate;overflow:hidden}
.gen1-prediction:before{content:"";position:absolute;inset:0;z-index:-1;background:url('/assets/images/gen1-win-race.avif') center/cover no-repeat;opacity:.2;pointer-events:none}
.gen1-split .gen1-score-note{font-size:.88rem;color:var(--muted)}.gen1-score-note strong{color:var(--white)}

.gen1-hero h1 .gen1-title-accent{color:var(--gen1-blue)}

/* Keep grid children within the viewport, including carousels and prediction credits. */
.gen1-hero-grid>div,.gen1-section-head>div,.gen1-section>.wrap{min-width:0}
.gen1-credits>div{min-width:0}.gen1-credits small{overflow-wrap:anywhere}
.gen1-command-tabs{display:none}
.gen1-command-card{position:relative;isolation:isolate;overflow:hidden;min-height:350px;display:flex;flex-direction:column}
.gen1-command-card:after{content:"";position:absolute;z-index:-1;right:-55px;bottom:-70px;width:180px;height:180px;border:1px solid var(--gen1-line);border-radius:50%}
.gen1-command-top{display:flex;justify-content:space-between;align-items:center;gap:15px}.gen1-command-top span{width:44px;height:44px;display:grid;place-items:center;border:1px solid var(--gen1-line);border-radius:14px;color:var(--gen1-blue);font-weight:800}.gen1-command-top code{font:800 .95rem Manrope}
.gen1-command-card h3{flex:1;display:grid;place-items:center;text-align:center;margin:18px 0;font-size:1.2rem;line-height:1.3}.gen1-command-card p{padding:14px;border:1px solid var(--gen1-line);border-radius:12px;font-size:.85rem;text-align:center}
.gen1-how-launch{margin-top:40px}.gen1-how-launch .gen1-note{font-size:.85rem}
.gen1-how-modal{background:#0a2139;border-color:var(--gen1-line)}.gen1-how-modal .faq-modal-head{background:#0a2139}.gen1-how-modal .faq-modal-head span,.gen1-how-launch .faq-launch span:last-child{color:var(--gen1-blue)}
.gen1-rule-content{padding-bottom:22px}.gen1-rule-content p{font-size:.95rem;margin:0 0 16px}.gen1-rule-content p:last-child{margin-bottom:0}.gen1-rule-content .gen1-note{font-size:.8rem;color:var(--muted)}.gen1-rule-content strong{color:var(--white)}.gen1-rule-content .gen1-rarity-row{margin-bottom:16px}.gen1-how-modal summary:after{color:var(--gen1-blue)}
@media(max-width:700px){
.gen1-actions{gap:6px}.gen1-actions .button{min-width:0;gap:5px;padding:13px 6px;font-size:.76rem;white-space:nowrap}
.gen1-command-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;margin-bottom:12px;padding:4px;border:1px solid var(--gen1-line);border-radius:999px;background:rgba(3,19,29,.6)}.gen1-command-tabs button{padding:9px 4px;border:0;border-radius:999px;background:none;color:var(--muted);font:800 .74rem Manrope;cursor:pointer}.gen1-command-tabs button[aria-selected="true"]{background:rgba(120,200,255,.2);color:var(--white)}.gen1-command-tabs button:focus-visible{outline:2px solid var(--gen1-blue);outline-offset:2px}
.gen1-command-grid{display:grid;position:relative;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:100%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none}.gen1-command-card{min-width:0;min-height:300px;scroll-snap-align:start;scroll-snap-stop:always}.gen1-command-grid::-webkit-scrollbar{display:none}
.gen1-prediction{width:100%;min-width:0;padding:18px 12px}.gen1-credits{gap:4px}.gen1-credits>div{padding:12px 2px}.gen1-credits span{font-size:.62rem}.gen1-credits strong{font-size:1.5rem}.gen1-credits small{font-size:.52rem}.gen1-split{gap:28px}
.gen1-rule-content .gen1-rarity-row{grid-template-columns:repeat(2,minmax(0,1fr))}
}

.gen1-revenue-panel{position:relative;isolation:isolate;overflow:hidden;padding:30px;border:1px solid var(--gen1-line);border-radius:26px;background:radial-gradient(ellipse at 100% 0,rgba(55,139,229,.2),transparent 65%),linear-gradient(145deg,#103452,#091f35);box-shadow:0 20px 50px rgba(0,0,0,.15)}
.gen1-revenue-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:24px;border-bottom:1px solid var(--gen1-line)}.gen1-revenue-heading .eyebrow{font-size:.61rem;letter-spacing:.1em}.gen1-revenue-heading .eyebrow:before{display:none}.gen1-revenue-label{flex-shrink:0;color:var(--gen1-blue);font:800 .65rem Manrope;padding:6px 10px;border:1px solid var(--gen1-line);border-radius:999px}
.gen1-revenue-path{list-style:none;margin:28px 0 0;padding:0}.gen1-revenue-path li{position:relative;display:grid;grid-template-columns:54px minmax(0,1fr);gap:20px;padding-bottom:30px}.gen1-revenue-path li:last-child{padding-bottom:0}.gen1-revenue-path li:not(:last-child):before{content:"";position:absolute;left:26px;top:54px;bottom:0;width:1px;background:linear-gradient(var(--gen1-blue),var(--gen1-line))}
.gen1-revenue-icon{position:relative;display:grid;place-items:center;width:54px;height:54px;border-radius:17px;border:1px solid var(--gen1-line);background:linear-gradient(145deg,#1b4e77,#102d49);color:var(--gen1-blue)}.gen1-revenue-icon svg{width:30px;height:30px;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.gen1-revenue-path small{color:var(--gen1-blue);font:800 .6rem Manrope;letter-spacing:.13em;text-transform:uppercase}.gen1-revenue-path h3{font-size:1.1rem;line-height:1.3;margin:5px 0 7px}.gen1-revenue-path p{font-size:.85rem;line-height:1.6;margin:0}
@media(max-width:700px){.gen1-revenue-panel{padding:22px 18px}.gen1-revenue-path li{grid-template-columns:46px minmax(0,1fr);gap:14px}.gen1-revenue-icon{width:46px;height:46px;border-radius:14px}.gen1-revenue-path li:not(:last-child):before{left:22px;top:46px}.gen1-revenue-path h3{font-size:1rem}.gen1-revenue-heading{gap:10px}}

@media(max-width:700px){.gen1-actions .button{padding:12px 10px;font-size:.8rem}}

@media(max-width:700px){.gen1-actions{flex-wrap:wrap;overflow-x:visible}.gen1-actions .button{max-width:100%;white-space:normal;text-align:center}}