/* Rainbow identity: navy for reading and actions, colour for small accents. */
body { color:var(--ink);background:#fff; }
.header { position:relative; }
.header .logo { width:auto;min-width:188px;font-size:27px; }
.nav .active { color:var(--brand-navy);border-color:var(--brand-navy); }
.nav a:hover { color:var(--brand-accent); }
.nav-game-badge { background:#edf0fc;color:#5268c9; }
.contact-top,.button-primary,.price-contact-button { color:#fff;background:var(--brand-navy);border-color:var(--brand-navy);box-shadow:0 4px 12px #1b2d4c12; }
.contact-top:hover,.button-primary:hover,.price-contact-button:hover { background:var(--brand-navy-hover);border-color:var(--brand-navy-hover);filter:none; }
.notice { position:relative;background:#f4f6fb;color:#52617c;border-top:1px solid #eaf0f7; }
.notice::after { content:'';position:absolute;inset:auto 0 0;height:2px;background:var(--rainbow);opacity:.8; }
.notice-label { color:#415172;background:#e7ecf7; }
.notice-arrow { color:#52617c; }
.hero { position:relative;isolation:isolate;overflow:hidden;min-height:460px;background-color:#f3f6fb;background-image:var(--hero-image);background-size:cover;background-position:center; }
.hero-inner { position:relative;z-index:2;padding:76px 0 82px; }
.hero .eyebrow { color:#7182a4;font-size:12px;letter-spacing:.12em; }
.hero .eyebrow:empty { display:none; }
.hero h1 { max-width:58%;color:var(--brand-navy);text-shadow:none;font-size:64px;line-height:1.17;letter-spacing:-.06em; }
.hero-topic { display:block;margin-bottom:17px;font-size:25px;font-weight:550;line-height:1.4;letter-spacing:-.04em; }
.hero-headline-main { display:block; }
.hero-brand { display:inline;white-space:nowrap;color:var(--brand-navy);font-weight:850;letter-spacing:-.065em;text-shadow:none;-webkit-text-stroke:0; }
.hero-description { color:#74819a;max-width:390px;margin:23px 0 0;font-size:15px;line-height:1.8;text-shadow:none; }
.hero-action { display:inline-flex;align-items:center;gap:24px;margin-top:30px;padding:13px 19px;border-radius:9px;background:var(--brand-navy);color:white;font-size:13px;font-weight:650;box-shadow:0 5px 14px #1b2d4c12; }
.hero-action:hover { background:var(--brand-navy-hover); }
.hero-rainbow { position:absolute;z-index:0;right:max(calc((100vw - 1260px)/2),10px);bottom:-20px;width:min(51vw,670px);height:auto;pointer-events:none; }
.hero-rainbow path { fill:none;stroke-width:18;stroke-linecap:round; }
.hero.has-custom-image .hero-rainbow { display:none; }
.hero.has-custom-image .hero-inner { padding-left:24px;padding-right:24px;border-radius:14px;background:linear-gradient(90deg,#f6f8fcef,#f6f8fcde 44%,transparent 72%); }
.worlds { padding-top:48px; }
.worlds-heading,.section-heading { border-left:0; }
.worlds-heading::before,.section-heading::before { content:'';position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:3px;background:var(--rainbow); }
.worlds-kicker,.section-heading .section-kicker,.faq-heading .eyebrow { color:#7687ad; }
#maple-planet,#alpang-server { position:relative; }
#maple-planet { border-color:#c5d3e9; }
#alpang-server { border-color:#e2e7f0;box-shadow:0 3px 14px #304c7305; }
.world-card::before { content:'';position:absolute;z-index:2;left:0;right:0;top:0;height:3px;background:var(--rainbow);opacity:.65; }
.world-card.disabled::before { opacity:.2; }
.world-card .planet-card-copy { min-height:130px; }
.world-card.disabled .planet-card-copy { background:#fafbfd; }
.world-card:not(.disabled):hover,.world-card:not(.disabled):has(.card-button:focus-visible) { border-color:#a8b7de!important;box-shadow:0 5px 24px #24385814!important; }
.world-card:not(.disabled):hover .planet-card-copy { background:#f3f6fc; }
.world-card:not(.disabled):hover .card-button { background:var(--brand-navy-hover)!important;border-color:var(--brand-navy-hover)!important;box-shadow:0 4px 12px #1b2d4c15!important; }
.world-card .card-button { box-shadow:none!important; }
.trade-demo { position:relative;overflow:hidden;background:linear-gradient(110deg,#f2f5fc,#fff 58%,#faf7fd);border-color:#dce3ef;box-shadow:0 4px 18px #24385806; }
.trade-demo::before { content:none; }
.trade-demo-heading::after { background:#dfe5ef; }
.trade-demo-window::before { background:linear-gradient(90deg,transparent,#dfe5ef 20%,#dfe5ef 80%,transparent); }
.trade-brand { display:inline-flex;margin-top:10px;font-size:17px; }
.trade-brand .rainbow-mark { width:18px;height:14px; }
.trade-demo-product { color:#7b8799; }.trade-demo-product b { color:#4566aa; }
.trade-demo-date { color:#8390a5; }
.prices { background:#f5f7fb;border-top-color:#e8edf5; }
.price-tab[aria-selected='true'] { color:var(--brand-navy);border-bottom-color:var(--brand-accent);background:#edf1fa; }
.price-server,.price-item,.balloon-panel,.gift-panel { border-color:#dfe6f0; }
.price-item h4 { color:var(--brand-navy); }
.trade-estimator { background:#f7f9fc;border-color:#e2e7f0; }
.estimate-net strong,.estimate-net-value { color:#4967ad; }
.balloon-tab[aria-selected='true'] { border-color:#dfe6f0;color:var(--brand-navy);box-shadow:inset 0 3px #6e84cf; }
.balloon-product { border-color:#e1e7f3;background:#f7f9fd; }
.balloon-upcoming { border-color:#e5e9f1; }
.gift-section { background:#f7f8fc;border-color:#e7ebf4; }
.gift-option { border-color:#e1e7f0; }
.gift-option:hover { border-color:#a9b8dc;background:#fafbfe; }
.gift-option[aria-pressed='true'] { background:#f3f6fd;border-color:#7a8fce;box-shadow:inset 0 0 0 1px #7a8fce; }
.gift-rate { background:#5c74be; }
.gift-guide { background:#f4f6fa; }
.usage { background:#f4f6fa; }
.usage-step { border-color:#e0e6ef;box-shadow:0 3px 12px #24385803; }
.usage-step-label { color:#7182a5; }
.usage-step-number { color:#8a9ccb;opacity:.18; }
.usage-steps>li:nth-child(1) .usage-step-label { color:#b35d7d; }
.usage-steps>li:nth-child(2) .usage-step-label { color:#a87b42; }
.usage-steps>li:nth-child(3) .usage-step-label { color:#3c927e; }
.usage-step--complete { background:var(--brand-navy);border-color:var(--brand-navy); }
.usage-step--complete p { color:#bfcbe0; }
.usage-complete-mark { color:#9fd2c4; }.usage-step--complete .usage-step-number { color:#a5bce2; }
.faq-tab { border-color:#e0e6ef;background:#f7f9fc;color:#7b879a; }
.faq-tab[aria-selected='true'] { background:var(--brand-navy);border-color:var(--brand-navy); }
.info { background:#768bc7; }
.contact-section { background:#fff; }
.contact-card { border-color:#dfe6f0; }
.contact-intro { background:var(--brand-navy); }
.contact-intro h2 strong { color:#b3cee0; }
.contact-tagline,.contact-benefits li { color:#afbdd5; }
.contact-benefits li::before { background:#9ac5c7; }
.contact-number { color:var(--brand-navy); }
.contact-number-label,.contact-desktop-note { color:#8591a6; }
.contact-desktop-note strong { color:var(--brand-navy); }
.contact-buttons,.contact-action { border-color:#dfe6f0; }
.contact-action { color:var(--brand-navy); }
.contact-action--phone { color:#fff; }
.contact-live-badge { background:#eef5f2;color:#348c72; }
.contact-action--phone { background:var(--brand-navy);border-color:var(--brand-navy); }
.site-footer { border-color:#e5eaf2;background:#f8f9fc; }
.footer-brand { display:inline-flex;align-items:center;gap:9px;margin-bottom:24px; }
@media(min-width:761px) and (max-width:1050px){.header .logo{min-width:0}.hero h1{font-size:58px}.hero-rainbow{right:-90px;width:57vw}}
@media(max-width:760px){
 .header .logo { min-width:0;font-size:24px; }
 .header .rainbow-mark { width:23px;height:18px; }
 .contact-top { font-size:12px; }
 .notice-inner { font-size:12px; }
 .hero { min-height:390px; }
 .hero-inner { padding:49px 0 130px; }
 .hero h1 { max-width:100%;font-size:clamp(40px,11.6vw,54px); }
 .hero-topic { margin-bottom:12px;font-size:20px; }
 .hero-description { max-width:90%;margin-top:16px;font-size:13px; }
 .hero-action { margin-top:22px;padding:11px 16px;font-size:12px; }
 .hero-rainbow { width:310px;right:-65px;bottom:-102px;opacity:.72; }
 .hero-rainbow path { stroke-width:14; }
 .hero.has-custom-image .hero-inner { padding:35px 16px 60px; }
 .worlds { padding-top:32px; }
 .world-card .planet-card-copy { min-height:116px; }
 .trade-demo-heading { align-items:center;flex-wrap:nowrap; }
 .trade-brand { font-size:15px;margin-top:0;flex:none; }
 .trade-brand .rainbow-mark { display:none; }
 .footer-brand { font-size:21px; }
}
@media(max-width:360px){.trade-demo-heading{flex-wrap:wrap}.hero-topic{font-size:18px}}

/* A quiet lavender field gives the world cards a clear place on the page. */
.worlds-band{margin-top:24px;background:#f4f2fb;border-block:1px solid #ece8f6}
.worlds-band .worlds{padding-top:32px;padding-bottom:36px}
.worlds-band .worlds-kicker{color:#7767aa}
.worlds-band #maple-planet{border-color:#cbc5ed;box-shadow:0 5px 18px #6554a80a}
.worlds-band #maple-planet .planet-card-copy{background:linear-gradient(115deg,#fff 20%,#f7f6fd)}
.worlds-band .trade-demo{background:#ffffffed;border-color:#e1ddee;box-shadow:0 3px 16px #6554a805}
@media(max-width:760px){.worlds-band{margin-top:20px}.worlds-band .worlds{padding-top:24px;padding-bottom:28px}}

/* Give the selected platform the largest tab, mark and label. */
.balloon-tab{flex:0 0 150px;min-height:52px;padding:12px;gap:6px;font-size:14px;white-space:nowrap}
.balloon-tab .platform-logo{width:24px;height:24px;border-radius:6px}
.balloon-tab small{margin-left:2px;font-size:9px;white-space:nowrap}
.balloon-tab[aria-selected='true']{flex-basis:230px;min-height:72px;padding:16px 24px;gap:12px;font-size:21px}
.balloon-tab[aria-selected='true'] .platform-logo{width:36px;height:36px;border-radius:8px}
@media(max-width:760px){
 .balloon-tab{flex-basis:116px;min-height:46px;padding:10px 8px;gap:5px;font-size:11px}
 .balloon-tab .platform-logo{width:20px;height:20px;border-radius:5px}
 .balloon-tab small{margin-left:0;font-size:8px}
 .balloon-tab[aria-selected='true']{flex-basis:160px;min-height:64px;padding:15px 18px;gap:10px;font-size:18px}
 .balloon-tab[aria-selected='true'] .platform-logo{width:30px;height:30px;border-radius:7px}
}
