:root{--home-width:1160px;--home-line:#a98ac52b;--home-surface:#171127;--home-body:#d0c5dc}
@media(max-width:600px){section.island-section .island-figure{aspect-ratio:1.25}}
html{scroll-padding-top:100px}
.home-wrap{width:min(var(--home-width),100% - 48px);margin-inline:auto}
.home-section{padding:88px 0;scroll-margin-top:0}
.home-section h2{font-size:clamp(32px,4vw,50px);line-height:1.13;letter-spacing:-.045em;margin:16px 0 24px}
.home-section h2 em{font-style:normal;color:var(--cyan)}
.home-section p{color:var(--home-body);line-height:1.85}
.home-section h3{font-size:20px;line-height:1.35;letter-spacing:-.025em}
.section-label,.small-label{font-family:var(--font-pixel);font-size:12px;letter-spacing:.10em;line-height:1.7;color:var(--gold)}
.section-lead{font-size:18px;line-height:1.8;max-width:600px}
.section-intro{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;align-items:center;margin-bottom:38px}
.section-intro h2{margin-bottom:0}
.section-footnote{font-size:13px;margin-top:20px;color:var(--faint)!important;max-width:850px}
.hero-promise{font-family:var(--font-display);font-size:clamp(20px,2.4vw,29px);font-weight:600;color:#fff5df;margin-top:12px;text-shadow:0 2px 14px #050612}
.hero{min-height:780px;padding-top:205px}
.hero-tagline{max-width:630px;margin-top:12px;line-height:1.75}
.hero-actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px}
.hero-actions .btn{min-height:54px}
.hero-actions .ghost{background:#100c25bb;border-color:#d0c0e44a}
.hero-players{margin-top:18px;text-transform:none;letter-spacing:.02em;font-family:var(--font-display);font-size:13px;background:#110e25cc}
.hero-actions{margin-top:22px}
.hero-scroll{color:var(--faint)}
.site-header .brand-logo-window{width:170px}
.site-header .nav a{padding-inline:11px}
.site-header .nav-cta .ghost{border-color:#86d4df47;background:#80e2df08;color:#c8eff0}
.site-header .nav-cta .shop{min-width:74px}
.story-section{background:linear-gradient(180deg,#100b2000,#100b20 35%,#100b20)}
.story-layout{display:grid;grid-template-columns:1.1fr .85fr;gap:100px;align-items:center}
.story-route{margin:28px 0 0;padding:0;list-style:none;display:grid;gap:24px}
.story-route li{display:flex;gap:18px;align-items:flex-start}
.story-route h3{font-size:17px;margin-bottom:5px}
.story-route p{font-size:14px;line-height:1.7}
.route-index{font-family:var(--font-pixel);color:var(--gold);font-size:12px;padding-top:3px;border-top:1px solid #ffcf7955;min-width:26px}
.astral-preview{background:linear-gradient(150deg,#241a3d,#131022);border:1px solid #b491dc40;border-radius:24px;padding:34px;box-shadow:0 28px 75px #07041044;position:relative}
.astral-top{display:flex;align-items:center;gap:12px;color:var(--gold);font-family:var(--font-pixel);font-size:11px;letter-spacing:.06em;margin-bottom:20px}
.mini-mark{font-size:25px;color:var(--cyan)}
.astral-preview>h3{font-size:27px;margin-bottom:12px}
.astral-preview>p{font-size:14px}
.astral-links{list-style:none;padding:0;margin:24px 0 22px;display:grid}
.astral-links li{display:grid;grid-template-columns:115px 1fr;gap:10px;padding:14px 0;border-bottom:1px solid var(--home-line);font-size:13px}
.astral-links b{font-weight:600;color:#f3e9ff}.astral-links span{color:var(--faint)}
.in-game{font-size:13px;margin-top:20px}.in-game code{font-family:Consolas,monospace;font-size:13px;color:var(--cyan);background:#06061366;border:1px solid #80e2df24;border-radius:5px;padding:3px 6px;white-space:nowrap}
.island-section{background:radial-gradient(ellipse at 75% 45%,#233e3740,transparent 60%),#100d1e;border-block:1px solid var(--home-line)}
.island-layout{display:grid;grid-template-columns:.85fr 1.3fr;gap:50px;align-items:center}
.island-choices{display:grid;gap:7px}
.island-choices button{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:12px;min-height:70px;padding:14px 18px;border-radius:12px;border:1px solid transparent;background:transparent;text-align:left;color:var(--muted);transition:background .18s,border-color .18s}
.island-choices button>span{font-family:var(--font-pixel);font-size:12px;color:var(--faint)}
.island-choices b{font-family:var(--font-display);font-size:15px;font-weight:500}.island-choices small{font-size:12px;color:var(--faint)}
.island-choices button:hover{background:#ffffff07}.island-choices button[aria-pressed=true]{background:#80e2df0c;border-color:#80e2df45;color:#e4ffef}.island-choices button[aria-pressed=true]>span{color:var(--cyan)}
.island-showcase{min-width:0;display:grid;grid-template-columns:1fr;align-items:center}
.island-figure{aspect-ratio:1.6;display:grid;place-items:center;position:relative;min-width:0}
.island-figure:before{content:"";position:absolute;inset:15% 10%;background:radial-gradient(ellipse,#6bb78b16,transparent 68%);z-index:0}
.island-figure img{position:relative;width:min(92%,420px);height:100%;max-height:340px;object-fit:contain;filter:drop-shadow(0 22px 25px #060a0960)}
.island-description{text-align:center;max-width:550px;margin:0 auto;min-height:155px}.island-description .small-label{color:#abe0ba;letter-spacing:.03em;font-family:var(--font-display);font-size:13px}.island-description h3{font-size:25px;margin:10px 0}.island-description p{font-size:14px;line-height:1.8}
.challenges-section{background:linear-gradient(#110d20,#160d21 50%,#100b20)}
.boss-rendezvous{display:grid;grid-template-columns:1.25fr 1fr;gap:90px;align-items:center;padding:20px 0 52px}
.boss-rendezvous h2 em{color:#ffd294}.boss-rendezvous p{max-width:600px}.event-tag{color:#ffad94;font-family:var(--font-pixel);font-size:11px;letter-spacing:.10em}.event-meta{margin-top:18px;font-size:13px;color:#ffdbbd!important}
.raid-clock{padding:32px 0 32px 32px;border-left:1px solid #ffcf7940}.raid-clock>span{font-family:var(--font-pixel);font-size:11px;letter-spacing:.08em;color:var(--faint)}.raid-clock strong{display:block;font-family:var(--font-display);font-size:clamp(25px,3.1vw,40px);font-weight:500;letter-spacing:-.04em;color:#ffddac;margin:12px 0;white-space:nowrap;font-variant-numeric:tabular-nums}.raid-clock p{font-size:14px}.raid-clock .text-link{margin-top:22px}
.challenge-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}.challenge-card{padding:32px;border:1px solid #af8ca733;border-radius:20px;background:#20132966}.challenge-card h3{font-size:25px;margin:14px 0}.challenge-card p{font-size:15px}.challenge-card .small-label{font-size:11px;letter-spacing:.03em;color:#d9b8e2}.alpha-card{background:linear-gradient(145deg,#19233380,#12132299)}.alpha-card .small-label{color:#89d1d5}.clean-list{padding-left:18px;display:grid;gap:9px;margin:22px 0;color:var(--home-body);font-size:14px}.alpha-rule{display:inline-block;margin-top:4px;color:var(--cyan);font-size:14px}.raid-rewards{display:grid;grid-template-columns:1fr auto;gap:12px 18px;align-items:center;margin-top:24px;padding-top:20px;border-top:1px solid var(--home-line)}.raid-rewards label{font-size:13px;color:var(--faint)}.raid-rewards select{padding:8px 10px;border:1px solid #bca5cd4a;background:#171024;color:var(--text);border-radius:8px;font:inherit;font-size:13px;min-height:42px}.raid-rewards>div{grid-column:1/-1;display:grid;gap:4px}.raid-rewards b{font-size:24px;color:var(--gold);font-weight:500}.raid-rewards div>span,.raid-rewards small{font-size:12px;color:var(--faint)}
.more-challenges{display:grid;grid-template-columns:1fr 1fr;gap:48px;padding-top:36px}.more-challenges h3{font-size:18px;margin-bottom:10px}.more-challenges p{font-size:14px}
.progression-section{background:#100b20}.egg-milestones{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid var(--home-line);margin:38px 0}.egg-milestones article{padding:28px 20px 30px;border-right:1px solid var(--home-line);text-align:center}.egg-milestones article:last-child{border:0}.egg-milestones article>span{display:block;font-family:var(--font-pixel);font-size:11px;letter-spacing:.12em;color:var(--faint)}.egg-milestones strong{font-family:var(--font-display);font-size:64px;line-height:1.35;font-weight:500;letter-spacing:-.05em;color:#9cdbed}.egg-milestones p{font-size:14px}.egg-milestones .shiny-milestone strong{color:#ffd694}.shiny-milestone p:after{content:" ✦";color:#ffcf79}
.grade-line{display:grid;grid-template-columns:1fr 1.2fr;gap:30px;align-items:center}.grade-line h3{font-size:20px}.grade-line p{font-size:14px;margin-top:8px}.grade-line ol{list-style:none;display:flex;flex-wrap:wrap;justify-content:flex-end;padding:0;gap:10px;margin:0}.grade-line li{font-size:13px;padding:7px 12px;border:1px solid var(--home-line);border-radius:999px;background:#ffffff04;color:#e2d5ea}.grade-line li:last-child{color:var(--gold);border-color:#ffcf7950}
.collection-section{background:radial-gradient(ellipse at 50% 30%,#4523533b,transparent 65%),#120d20;border-block:1px solid var(--home-line)}
.costume-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}.costume-gallery figure{margin:0;background:#162537;border:1px solid #a2b5cd24;border-radius:18px;overflow:hidden}.costume-art{position:relative;aspect-ratio:360/420;overflow:hidden}.costume-art img{position:absolute;display:block;width:400%;max-width:none;height:auto;left:-300%;top:-14.285714%}.costume-gallery figcaption{padding:0 24px 24px}.costume-gallery figcaption>span{color:#9abacc;font-family:var(--font-pixel);font-size:11px;letter-spacing:.04em}.costume-gallery h3{font-size:23px;margin:8px 0 2px}.costume-gallery figcaption p{font-size:14px;color:#c1d3e3}
.costume-catalog{border-block:1px solid var(--home-line);margin:26px 0 36px}.costume-catalog summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;cursor:pointer;color:var(--text);font-family:var(--font-display);font-size:16px;list-style:none}.costume-catalog summary::-webkit-details-marker{display:none}.costume-catalog summary span{font-size:24px;color:var(--cyan)}.costume-catalog[open] summary span{transform:rotate(45deg)}.catalog-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding-bottom:26px}.catalog-columns h4{font-size:15px;color:var(--gold);margin:0 0 14px}.catalog-columns ul{padding-left:17px;margin:0;display:grid;gap:10px;color:var(--home-body);font-size:13px;line-height:1.7}
.collection-info{display:grid;grid-template-columns:1fr 1fr;gap:60px}.collection-info h3{margin-bottom:12px}.collection-info p{font-size:14px}.currency-line{display:grid;gap:6px;margin-top:16px}.currency-line b{color:var(--gold);font-weight:500}
.faq-layout{display:grid;grid-template-columns:.9fr 1.25fr;gap:80px;align-items:start}.faq-layout>div:first-child>p{margin-bottom:25px}.faq-list{border-top:1px solid var(--home-line)}.faq-list details{border-bottom:1px solid var(--home-line)}.faq-list summary{cursor:pointer;padding:23px 30px 23px 0;font-family:var(--font-display);font-size:16px;font-weight:500;line-height:1.5;position:relative;list-style:none;color:var(--text)}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";position:absolute;right:0;top:23px;color:var(--cyan);font-size:23px}.faq-list details[open] summary:after{content:"−"}.faq-list p{font-size:14px;padding:0 24px 24px 0;line-height:1.85}
.join-section{padding-top:0}.join-panel{padding:54px;background:radial-gradient(ellipse at 0% 0%,#354e674d,transparent 70%),linear-gradient(130deg,#231834,#171226);border:1px solid #b7a0cb4a;border-radius:24px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.join-panel h2{font-size:clamp(30px,3.3vw,44px)}.join-panel>div>p{font-size:15px}.join-panel .btn{margin-top:26px;min-height:52px}.join-steps{list-style:none;padding:0;margin:0;display:grid;gap:25px}.join-steps li{display:flex;align-items:flex-start;gap:17px}.join-steps li>span{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;border:1px solid #80e2df55;border-radius:50%;font-size:13px;color:var(--cyan)}.join-steps h3{font-size:17px;margin-bottom:6px}.join-steps p{font-size:14px;line-height:1.7}
.upcoming{display:grid;grid-template-columns:190px 1fr;gap:28px;margin-top:30px;padding:0 24px}.upcoming .small-label{color:var(--faint);font-size:11px}.upcoming p{font-size:13px;line-height:1.8;color:var(--faint)}
.home-footer{border-top:1px solid var(--home-line);padding:40px 0 26px;background:#0d0918}.footer-top{display:grid;grid-template-columns:190px 1fr auto;gap:40px;align-items:center;padding-bottom:32px}.footer-top p{font-size:13px;line-height:1.8}.footer-top nav{display:flex;flex-wrap:wrap;gap:18px;justify-content:flex-end;font-size:13px;color:var(--muted)}.footer-top a:hover{color:var(--text)}.footer-bottom{padding-top:22px;border-top:1px solid var(--home-line);display:flex;justify-content:space-between;gap:28px;align-items:flex-start}.footer-bottom p{font-size:11px;color:var(--faint);line-height:1.8}.footer-bottom p:last-child{max-width:520px;text-align:right}
@media(max-width:1100px){.story-layout{gap:50px}.section-intro{gap:40px}.island-layout{gap:24px}.island-choices button{grid-template-columns:23px 1fr}.island-choices small{grid-column:2}.boss-rendezvous{gap:40px}.faq-layout{gap:40px}.join-panel{gap:40px;padding:36px}.site-header .brand-logo-window{width:150px}.site-header .nav a{padding-inline:8px}.site-header .nav-wrap{gap:8px}.footer-top{grid-template-columns:190px 1fr}.footer-top nav{grid-column:1/-1;justify-content:flex-start}}
@media(max-width:800px){.home-section{padding:62px 0}.section-intro,.story-layout,.faq-layout{grid-template-columns:1fr;gap:30px}.section-intro{margin-bottom:26px}.section-intro h2{margin-bottom:0}.story-layout{gap:38px}.astral-preview{max-width:600px;width:100%;margin:auto}.island-layout{grid-template-columns:1fr}.island-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.island-choices button{min-height:88px;padding:12px;gap:7px}.island-choices button:last-child{grid-column:1/-1;min-height:65px;grid-template-columns:23px 1fr auto}.island-choices button:last-child small{grid-column:auto}.island-figure{aspect-ratio:1.8}.island-figure img{max-height:330px}.boss-rendezvous{grid-template-columns:1fr;gap:24px;padding-bottom:32px}.raid-clock{border-left:0;border-top:1px solid #ffcf7940;padding:25px 0 0}.raid-clock strong{font-size:32px}.challenge-grid{gap:16px}.challenge-card{padding:24px}.challenge-card .small-label{font-size:10px;letter-spacing:0}.grade-line{grid-template-columns:1fr;gap:20px}.grade-line ol{justify-content:flex-start}.costume-gallery{gap:14px}.costume-gallery figcaption{padding:0 16px 18px}.costume-gallery h3{font-size:20px}.costume-gallery figcaption>span{font-size:10px}.collection-info{gap:30px}.join-section{padding-top:0}.join-panel{grid-template-columns:1fr;gap:36px}.upcoming{grid-template-columns:1fr;gap:10px;padding-inline:12px}.footer-bottom{display:grid;gap:10px}.footer-bottom p:last-child{text-align:left}}
@media(max-width:600px){html{scroll-padding-top:150px}.home-section{scroll-margin-top:0}.home-wrap{width:calc(100% - 36px)}.home-section h2{font-size:34px}.section-lead{font-size:16px}.hero-promise{font-size:21px;max-width:300px;line-height:1.35;margin-top:10px}.hero{padding-top:165px;min-height:760px;padding-bottom:120px}.hero-tagline{max-width:390px;font-size:14px}.hero-actions{gap:10px;max-width:100%}.hero-actions .btn{min-height:48px;font-size:14px;padding:12px 18px}.hero-actions .play{min-height:50px}.hero-players{font-size:12px}.hero-scroll{bottom:69px}.site-header .brand-logo-window{width:min(170px,48vw)}.site-header .nav-wrap{gap:10px;padding:10px 12px}.site-header .nav-cta .btn{min-height:38px;padding:7px 18px}.astral-preview{padding:25px}.astral-links li{grid-template-columns:95px 1fr}.astral-top{font-size:10px}.challenge-grid,.more-challenges,.collection-info{grid-template-columns:1fr;gap:20px}.challenge-card{padding:25px}.challenge-card .small-label{font-size:11px}.raid-clock strong{font-size:29px}.more-challenges{gap:28px}.egg-milestones{grid-template-columns:repeat(2,1fr)}.egg-milestones article{border-bottom:1px solid var(--home-line);padding:22px 15px}.egg-milestones article:nth-child(2){border-right:0}.egg-milestones article:nth-child(3){border-bottom:0}.egg-milestones strong{font-size:56px}.costume-gallery{grid-template-columns:1fr;gap:18px}.costume-gallery figure{display:grid;grid-template-columns:1.1fr 1fr;align-items:center}.costume-art{aspect-ratio:360/420}.costume-gallery figcaption{padding:16px 14px 16px 0}.costume-gallery figcaption>span{font-size:10px}.costume-gallery h3{font-size:23px}.catalog-columns{grid-template-columns:1fr;gap:26px}.catalog-columns ul{gap:6px}.join-panel{padding:28px 22px;border-radius:18px}.join-panel h2{font-size:34px}.footer-top{grid-template-columns:1fr;gap:22px}.footer-top nav{gap:14px}.footer-top p{font-size:13px}.home-footer .brand-logo-window{width:180px}.section-label{font-size:11px;letter-spacing:.05em}}


.hero .hero-wordmark { width: min(738px, 72vw); }
.site-header .brand { gap: 10px; flex-shrink: 0; min-width: 0; }
.site-header .brand .brand-icon {
  display: block; width: 40px; height: 40px; flex: 0 0 40px;
  object-fit: contain; border-radius: 9px;
}
.site-header .brand-name {
  display: block; color: #f8f0ff; font-size: 17px; line-height: 1.2;
  letter-spacing: -.025em; white-space: nowrap;
}
.site-header .nav-wrap { gap: 16px; }
.site-header .nav a { padding: 10px; min-height: 44px; font-size: 14px; }
.site-header .nav-cta { gap: 8px; flex-shrink: 0; }
.site-header .nav-cta .btn {
  font-family: var(--font-display); font-size: 13px; font-weight: 600;
  min-height: 42px; padding: 9px 13px; white-space: nowrap;
}
.site-header .nav-cta .account {
  width: auto; min-width: 96px; padding: 9px 13px; border-radius: 999px;
  border: 1px solid #c6aed54a; background: #ffffff06; color: #ede3f6;
}
.site-header .mobile-toggle { min-height: 44px; font-size: 13px; white-space: nowrap; }
.section-label, .small-label, .event-tag, .astral-top,
.challenge-card .small-label, .costume-gallery figcaption > span,
.egg-milestones article > span, .raid-clock > span {
  font-family: var(--font-display); font-size: 13px; font-weight: 600;
  line-height: 1.6; letter-spacing: .025em;
}
.section-label { font-size: 14px; color: #ffd795; }
.astral-top { color: #ffda9b; }
.home-section .small-label { line-height: 1.6; }
.in-game code { white-space: normal; overflow-wrap: anywhere; }
.raid-clock strong { white-space: normal; font-size: clamp(25px, 3vw, 38px); }
#raidLocalTime { font-size: 15px; line-height: 1.6; color: #f6d9ae; margin: 10px 0 14px; }
#raidDimensions { font-size: 13px; color: #d7d5e9; }
.preview-notice {
  display: grid; grid-template-columns: 255px minmax(0, 1fr); gap: 24px;
  align-items: center; margin-top: 8px; padding: 22px 26px;
  border: 1px solid #ffcf7933; border-radius: 15px; background: #251b2a88;
}
.preview-notice .small-label { color: #ffda9b; }
.preview-notice p { color: #d4c9de; font-size: 14px; line-height: 1.75; margin: 0; }
.island-farm-note {
  display: grid; grid-template-columns: .75fr 1.25fr; gap: 30px;
  border-top: 1px solid var(--home-line); padding-top: 27px; margin-top: 28px;
}
.island-farm-note h3 { font-size: 20px; margin: 0; }
.island-farm-note p { font-size: 14px; margin: 0; }
.island-farm-note .small-label { display: inline-block; color: #ffda9b; }


.legend-section {
  background: radial-gradient(ellipse at 90% 20%, #2b365d3b, transparent 60%), #120d22;
  border-block: 1px solid var(--home-line);
}
.legend-routes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.legend-route {
  min-width: 0; padding: 32px; border: 1px solid #b392cc3d;
  border-radius: 20px; background: linear-gradient(145deg, #251a3880, #161122b3);
}
.legend-route h3 { font-size: 25px; margin: 14px 0 16px; }
.legend-route > p { font-size: 15px; }
.legend-route .small-label { color: #ffd69a; }
.legend-steps { display: grid; gap: 14px; padding-left: 22px; margin: 24px 0; }
.legend-steps li { padding-left: 4px; color: var(--home-body); font-size: 14px; line-height: 1.8; }
.legend-steps li::marker { color: var(--cyan); font-weight: 600; }
.legend-rules { border-top: 1px solid var(--home-line); margin-top: 22px; }
.legend-rules details { border-bottom: 1px solid var(--home-line); }
.legend-rules summary {
  padding: 17px 26px 17px 0; color: #f3e7fc; cursor: pointer;
  font-size: 14px; line-height: 1.65; font-weight: 600;
}
.legend-rules details p { font-size: 14px; margin: 0; padding: 0 0 18px; }
#riftSimulator {
  padding: 22px; border-radius: 14px; border: 1px solid #80e2df3d;
  background: #80e2df07; margin-top: 24px;
}
#riftSimulator label { display: block; font-size: 14px; line-height: 1.6; color: #ede8f5; }
#riftSimulator input[type="range"] {
  display: block; width: 100%; min-width: 0; min-height: 44px;
  margin: 10px 0; accent-color: #a8e4e1; cursor: pointer;
}
#riftTeamCount { color: #b2eeea; font-weight: 600; }
#riftChance {
  display: block; font-family: var(--font-display); font-size: clamp(28px, 3vw, 36px);
  color: #ffda9b; font-weight: 600; line-height: 1.4; letter-spacing: -.03em;
}
#riftSimulator p, #riftSimulator small { color: #cfc5db; font-size: 13px; line-height: 1.75; }


.grade-line li, .grade-line li:last-child { border: 0; padding: 0; background: none; }
.grade-line button[data-dialog-open] {
  padding: 11px 16px; min-height: 44px; color: #ede1f5;
  background: #ffffff06; border: 1px solid #c2a5db40; border-radius: 999px;
  font: inherit; font-size: 14px; cursor: pointer;
}
.grade-line li:last-child button { color: #ffdb9c; border-color: #ffcf795b; }
.grade-line button[data-dialog-open]:hover { background: #80e2df0d; border-color: #a8e4e177; }
.egg-catalog { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 28px 0 36px; }
.egg-catalog article { padding: 24px; border: 1px solid var(--home-line); border-radius: 15px; background: #ffffff03; }
.egg-catalog h3 { font-size: 19px; margin: 10px 0; }
.egg-catalog p { font-size: 14px; }
.wiki-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-top: 25px; }
.wiki-links > a, .wiki-links > article { padding: 22px; border: 1px solid #80e2df35; border-radius: 14px; background: #80e2df06; min-width: 0; }
.wiki-links h3 { margin: 0 0 10px; font-size: 19px; }
.wiki-links p { margin: 0; font-size: 14px; }
.wiki-links > a:hover { border-color: #80e2df88; background: #80e2df0c; }
.roadmap-list { display: grid; gap: 16px; list-style: none; padding: 0; margin: 26px 0 0; }
.roadmap-list > li { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 25px; padding: 22px 0; border-top: 1px solid var(--home-line); }
.roadmap-list h3 { margin: 0 0 7px; font-size: 19px; }
.roadmap-list p { font-size: 14px; margin: 0; }


html.has-open-dialog { overflow: hidden; }
.info-dialog, dialog {
  color: #f4eafa; width: min(680px, calc(100vw - 32px)); max-width: calc(100vw - 32px);
  max-height: min(780px, calc(100vh - 32px)); max-height: min(780px, calc(100dvh - 32px));
  padding: 0; border: 1px solid #c7a0dc63; border-radius: 22px;
  background: linear-gradient(155deg, #271c3a, #151020 75%);
  box-shadow: 0 30px 120px #05020bcc; overflow: auto; overscroll-behavior: contain;
}
dialog:not([open]) { display: none; }
dialog[open] { position: fixed; inset: 0; margin: auto; }
dialog::backdrop { background: #080512c7; backdrop-filter: blur(7px); }
.dialog-head {
  position: sticky; top: 0; z-index: 2; display: flex; align-items: flex-start;
  justify-content: space-between; gap: 20px; padding: 26px 30px 22px;
  border-bottom: 1px solid var(--home-line); background: #241a35f5;
}
.dialog-head h2, .dialog-head h3 { font-family: var(--font-display); font-size: 27px; line-height: 1.25; margin: 4px 0 0; letter-spacing: -.025em; }
.dialog-head [data-dialog-close] {
  display: grid; place-items: center; flex: 0 0 auto; min-width: 44px; min-height: 44px;
  padding: 7px; border: 1px solid #ccb1de44; border-radius: 11px;
  color: #f3e9fb; background: #ffffff08; font: inherit; font-size: 22px; cursor: pointer;
}
.dialog-content { padding: 26px 30px 30px; }
.dialog-content p { font-size: 15px; line-height: 1.8; color: #dcd0e8; margin: 0 0 18px; }
.dialog-content h3 { font-family: var(--font-display); font-size: 18px; margin: 25px 0 13px; }
.dialog-content ul, .grade-benefits { padding-left: 21px; margin: 16px 0; display: grid; gap: 12px; }
.dialog-content li { color: #ddd0e9; font-size: 14px; line-height: 1.8; }
.dialog-content li::marker { color: #a8e4e1; }
.dialog-content .btn { min-height: 44px; margin-top: 10px; }
.dialog-content .small-label { display: block; color: #ffda9b; margin-bottom: 12px; }
[data-dialog-open]:focus-visible, [data-dialog-close]:focus-visible,
#riftTeam:focus-visible, .legend-rules summary:focus-visible {
  outline: 2px solid #a8e4e1; outline-offset: 4px;
}

@media (min-width: 1081px) {
  .site-header .nav { display: flex; position: static; flex-direction: row; align-items: center; padding: 0; border: 0; background: none; box-shadow: none; }
  .site-header .mobile-toggle { display: none; }
  .site-header .nav-wrap > .nav-cta { display: flex; }
}
@media (max-width: 1080px) {
  .site-header .nav-wrap { display: flex; justify-content: space-between; padding: 9px 14px; }
  .site-header .mobile-toggle { display: inline-flex; align-items: center; justify-content: center; gap: 6px; }
  .site-header .nav-wrap > .nav-cta { display: none; }
  .site-header .nav {
    display: none; position: absolute; top: calc(100% + 8px); left: -1px; right: -1px;
    flex-direction: column; align-items: stretch; gap: 3px; padding: 14px;
    border: 1px solid #91709e77; border-radius: 18px; background: #1b132cf7;
    box-shadow: 0 18px 50px #07041080; max-height: calc(100vh - 110px);
    max-height: calc(100dvh - 110px); overflow-y: auto;
  }
  .site-header .nav.open { display: flex; }
  .site-header .nav a { padding: 11px 14px; }
  .site-header .nav .nav-cta { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 14px 0 0; margin-top: 10px; border-top: 1px solid var(--home-line); }
  .site-header .nav .nav-cta .btn { width: auto; min-width: 0; min-height: 44px; padding: 10px; text-align: center; justify-content: center; }
}
@media (max-width: 800px) {
  .hero .hero-wordmark { width: min(492px, 77vw); }
  .preview-notice { grid-template-columns: 1fr; gap: 10px; padding: 22px; }
  .legend-routes { grid-template-columns: 1fr; gap: 20px; }
  .legend-route { padding: 28px; }
  .egg-catalog { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .island-farm-note { grid-template-columns: 1fr; gap: 12px; }
}
@media (max-width: 600px) {
  html { scroll-padding-top: 90px; }
  .site-header .nav-wrap { gap: 8px; padding: 8px 10px; }
  .site-header .brand { gap: 8px; }
  .site-header .brand-name { font-size: 16px; }
  .site-header .mobile-toggle { font-size: 12px; padding: 8px 10px; }
  .site-header .nav .nav-cta { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .site-header .nav .nav-cta .account { grid-column: 1 / -1; }
  .section-label, .home-section .small-label, .challenge-card .small-label { font-size: 13px; letter-spacing: .02em; }
  .astral-top, .costume-gallery figcaption > span, .egg-milestones article > span, .raid-clock > span { font-size: 12px; letter-spacing: .02em; }
  .preview-notice { padding: 19px; }
  .legend-route { padding: 24px 21px; }
  .legend-route h3 { font-size: 24px; }
  #riftSimulator { padding: 18px; }
  .egg-catalog, .wiki-links { grid-template-columns: 1fr; }
  .egg-catalog article { padding: 22px; }
  .roadmap-list > li { grid-template-columns: 1fr; gap: 10px; }
  .dialog-head { padding: 20px; gap: 12px; }
  .dialog-head h2, .dialog-head h3 { font-size: 24px; }
  .dialog-content { padding: 22px 20px; }
  .raid-rewards { grid-template-columns: minmax(0, 1fr) auto; gap: 12px; }
  .raid-rewards select { max-width: 100%; }
  .raid-clock strong { font-size: 26px; }
  .home-footer .footer-top nav { gap: 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .island-choices button { transition: none; }
}


.observatoire-preview { margin: 24px 0; display: flex; align-items: center; gap: 18px; min-width: 0; padding: 14px 18px; border: 1px solid #80e2df30; border-radius: 14px; background: #0b111c66; }
.observatoire-preview img { width: 43%; max-width: 180px; height: 220px; object-fit: contain; flex-shrink: 0; }
.observatoire-preview figcaption { font-size: 16px; font-weight: 600; line-height: 1.55; color: #e5e8f3; }
.observatoire-preview figcaption span { display: block; font-size: 12px; color: #b6adca; font-weight: 400; margin-top: 9px; }
.celebi-announcement { display: flex; gap: 18px; align-items: center; margin: 20px 0; padding: 18px; background: #10211b88; border-radius: 12px; border: 1px solid #80d9a83b; }
.celebi-announcement img { width: 52px; height: 52px; object-fit: contain; image-rendering: pixelated; flex: 0 0 52px; }
.celebi-announcement strong { color: #9de9b8; font-size: 16px; }
.celebi-announcement p { margin: 6px 0 0; }
@media (max-width: 600px) {
  .observatoire-preview { padding: 12px; gap: 12px; }
  .observatoire-preview img { height: 170px; }
  .observatoire-preview figcaption { font-size: 14px; }
  .celebi-announcement { gap: 12px; padding: 14px; align-items: flex-start; }
}


.legend-route-heading { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 13px; align-items: start; }
.legend-route-heading h3 { margin: 7px 0 18px; }
.legend-route-heading .route-index { margin-top: 4px; }
.status-chip {
  display: inline-block; width: fit-content; padding: 5px 9px;
  border: 1px solid #ffd79544; border-radius: 999px; color: #ffdcaa;
  background: #ffd79507; font-size: 11px; line-height: 1.5; white-space: nowrap;
}
.signals-route { grid-column: 1 / -1; }
.signals-route > p { max-width: 920px; }
.legend-rules > p { font-size: 14px; margin: 0; padding: 0 0 18px; }
.legend-rules > p + p { margin-top: -5px; }
.legend-rules summary { min-height: 44px; }
.rift-result { display: grid; gap: 9px; margin: 7px 0 14px; }
#riftChance { font-size: clamp(24px, 2.8vw, 32px); line-height: 1.35; }
.signal-scale {
  position: relative; display: flex; justify-content: space-between; flex-wrap: wrap;
  gap: 10px 22px; padding-top: 25px; margin: 28px 0; color: #c6bbd5;
  font-size: 13px; line-height: 1.7;
}
.signal-scale::before {
  content: ""; position: absolute; top: 3px; left: 0; right: 0; height: 6px;
  border-radius: 999px; background: linear-gradient(90deg, #695780 0%, #9276ad 75%, #a8e4e1 75%, #a8e4e1 100%);
}
.signal-scale::after {
  content: ""; position: absolute; top: -1px; left: 75%; width: 2px; height: 14px;
  background: #d4fffb;
}
.signal-threshold { color: #b8eeea; font-weight: 600; }
.kanto-legends {
  margin-top: 28px; padding: 26px 30px; border-left: 3px solid #e8bc74;
  border-radius: 0 15px 15px 0; background: #ffcf7907;
}
.kanto-legends h3 { font-size: 21px; margin: 0 0 13px; }
.kanto-legends p { font-size: 14px; margin: 0; max-width: 940px; }
.kanto-legends p + p { margin-top: 13px; }
.announcement-preview { padding: 2px 0 20px; }
.announcement-preview > .small-label { display: block; margin-bottom: 14px; color: #ffda9b; }
.announcement-preview p {
  padding: 11px 14px; margin: 8px 0; border-left: 2px solid #80e2df63;
  background: #80e2df07; color: #d8d3e6; font-size: 14px; line-height: 1.7;
}
.prisme-concept { margin: 22px 0; }
.prisme-concept img { display: block; width: 100%; height: auto; border: 1px solid #b092ca44; border-radius: 13px; }
.prisme-concept figcaption { margin-top: 10px; color: #bbaeC9; font-size: 12px; line-height: 1.7; }
.egg-milestones .legend-milestone strong { color: #ffd694; }
.legend-milestone small { display: block; margin-top: 8px; color: #e5c592; font-size: 12px; }
.practical-section { background: #100c1d; }
.wiki-links {
  grid-template-columns: .9fr 1.1fr; gap: 36px; padding: 30px;
  border: 1px solid #80e2df30; border-radius: 18px; background: #80e2df05;
}
.wiki-links > div { min-width: 0; }
.wiki-links > div h3 { margin: 12px 0; font-size: 23px; }
.wiki-links nav { display: grid; gap: 4px; }
.wiki-links nav a {
  padding: 10px 12px; min-height: 44px; color: #bfe9e8; font-size: 14px;
  line-height: 1.6; border-bottom: 1px solid #80e2df24; border-radius: 7px;
}
.wiki-links nav a:hover { color: #edfffc; background: #80e2df0b; }
.vote-status {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 32px;
  align-items: center; margin-top: 24px; padding: 30px;
  border: 1px solid #ffcf792b; border-radius: 18px; background: #ffcf7904;
}
.vote-status h3, .roadmap-panel h3 { font-size: 23px; margin: 12px 0; }
.vote-status p, .roadmap-panel > div p { font-size: 14px; margin: 0; }
.vote-status .btn { min-height: 48px; font-size: 13px; }
.roadmap-panel { margin-top: 24px; padding: 30px; border: 1px solid var(--home-line); border-radius: 18px; }
.roadmap-list > li > b { font-size: 15px; font-weight: 600; color: #f2e7fa; line-height: 1.7; }
.roadmap-list > li > span { font-size: 14px; line-height: 1.8; color: var(--home-body); }
.dialog-head > div { min-width: 0; }
.dialog-head .small-label { display: block; margin-bottom: 7px; color: #ffda9b; font-size: 12px; }
.dialog-head [data-dialog-close] { padding: 10px 12px; font-size: 13px; line-height: 1.5; white-space: nowrap; }
.grade-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin: 20px 0; }
.grade-facts > div { min-width: 0; padding: 14px; border: 1px solid var(--home-line); border-radius: 11px; background: #ffffff03; }
.grade-facts dt { font-size: 12px; color: #c8b9d3; line-height: 1.7; }
.grade-facts dd { margin: 7px 0 0; font-family: var(--font-display); font-size: 20px; font-weight: 600; line-height: 1.45; color: #ffda9b; }
.dialog-content code { overflow-wrap: anywhere; white-space: normal; color: #b7e8e8; }
@media (max-width: 1080px) {
  .legend-route-heading { grid-template-columns: 26px minmax(0, 1fr); }
  .legend-route-heading .status-chip { grid-column: 2; margin-top: -10px; margin-bottom: 18px; }
}
@media (max-width: 800px) {
  .wiki-links { grid-template-columns: 1fr; gap: 22px; }
  .vote-status { grid-template-columns: 1fr; gap: 22px; }
  .vote-status .btn { justify-self: start; white-space: normal; text-align: center; }
}
@media (max-width: 600px) {
  .kanto-legends { padding: 23px 21px; }
  .wiki-links, .vote-status, .roadmap-panel { padding: 23px 21px; }
  .wiki-links nav a { padding-inline: 0; }
  .signal-scale { font-size: 12px; gap: 8px 13px; }
  .grade-facts { gap: 9px; }
  .grade-facts > div { padding: 12px; }
  .grade-facts dd { font-size: 19px; }
}