/* Original illustrated campaign · 2026-11-08. Shared by all eleven landing languages. */
:root {
  --bg:#080f18; --bg2:#0b1521; --card:#0e1926; --card2:#132130;
  --ink:#f5f0e5; --ink2:#b7c3cd; --dim:#8c9da9;
  --line:rgba(209,223,232,.1); --line2:rgba(209,223,232,.2);
  --gold:#bba68d; --gold2:#eee2cc; --gold3:#fff3df;
  --blood:#b93641; --blood2:#dc6570; --gold-fill:linear-gradient(110deg,#eee3d0,#cdbb9e);
  --wrap:min(1360px,calc(100% - 96px));
  --ease:cubic-bezier(.22,1,.36,1);
}
html { scroll-padding-top:100px; }
body::after { display:none; }
body { background:var(--bg); }
::selection { color:#fff5e9; background:#95313c; }
a,button { touch-action:manipulation; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:2px solid #f2dbc0; outline-offset:6px; }
.bar { height:86px; padding:14px 48px; background:linear-gradient(180deg,rgba(6,13,21,.9),transparent); }
.bar.solid { background:rgba(8,15,24,.94); border-color:var(--line); backdrop-filter:blur(18px); }
.brand { gap:13px; }
.brand .mk { width:32px; height:38px; filter:none; color:var(--blood2); }
.brand b { font-size:16px; letter-spacing:-.04em; }
.brand small { margin-top:5px; font-size:10px; letter-spacing:.09em; color:#b7c3cd; }
.campaign-nav { display:flex; align-items:center; gap:32px; margin:0 auto; padding:0 32px; }
.campaign-nav a { position:relative; padding:10px 0; font-size:13px; font-weight:600; color:#c0c9d0; transition:color .25s; }
.campaign-nav a:hover,.campaign-nav a[aria-current] { color:#fff2dd; }
.campaign-nav a[aria-current]::after { content:''; position:absolute; height:2px; left:0; right:0; bottom:0; background:var(--blood2); }
.bar-r { gap:18px; }
.lng summary { height:38px; background:transparent; border:0; border-radius:0; }
.lng-menu { border-radius:4px; background:#111e2b; }
.bar-cta { height:42px; padding:0 24px; background:#a9313e; color:#fff3e7; border-radius:2px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.12); }
.bar-cta:hover { background:#c0424c; }
.prog { background:var(--blood2); }
.hero { min-height:max(790px,100svh); align-items:center; background:#080f18; }
.hero-media { z-index:-2; background:none; }
.hero-art,.hero-art img { display:block; width:100%; height:100%; }
.hero-art img { object-fit:cover; object-position:center 42%; animation:campaign-drift 26s var(--ease) infinite alternate; }
@keyframes campaign-drift { from { transform:scale(1); } to { transform:scale(1.045); } }
.hero-shade { background:linear-gradient(90deg,rgba(8,15,24,.54),rgba(8,15,24,.13) 42%,transparent 66%),linear-gradient(180deg,rgba(8,15,24,.15),transparent 30%,transparent 68%,#080f18 100%); }
.hero-lb { display:none; }
.hero .motes { opacity:.32; }
.hero-in { position:relative; padding:155px 0 130px; margin:0 auto; }
.hero-in > :not(.grp) { max-width:520px; }
.hero .launch { width:max-content; max-width:100%; min-height:29px; margin-bottom:30px; padding:0; border:0; border-radius:0; background:none; backdrop-filter:none; box-shadow:none; font-size:11px; letter-spacing:.015em; }
.launch b { border-radius:0; padding:5px 8px; font-size:8px; background:#b33d48; color:#fff1e9; box-shadow:none; }
.launch span { color:#cad2d8; }
.eyebrow { margin-bottom:23px; font:600 10px/1.4 var(--sans); letter-spacing:.34em; color:#c8bca9; }
.eyebrow i { width:25px; background:var(--blood2); }
.hero-title { margin:0; font:800 clamp(54px,5.4vw,86px)/1.06 var(--sans); letter-spacing:-.065em; color:#faf1e2; text-wrap:balance; }
.hero-title strong { display:inline-block; margin-top:5px; font-weight:900; font-size:1.17em; letter-spacing:-.07em; }
html:not([lang="ko"]) .hero-title { font-size:clamp(42px,4.1vw,66px); letter-spacing:-.05em; }
html:not([lang="ko"]) .hero-title strong { font-size:1.08em; letter-spacing:-.04em; }
.hero-title::after { content:''; display:block; width:44px; height:3px; margin-top:29px; background:var(--blood2); }
.hero .tag { margin-top:22px; font-size:17px; line-height:1.75; letter-spacing:-.025em; color:#cbd1d4; text-shadow:none; }
.hero .cta { max-width:348px; margin-top:29px; }
.cta { height:62px; border-radius:2px; color:#fff5eb; background:#ac3542; border:1px solid rgba(255,200,194,.28); box-shadow:0 16px 44px rgba(6,10,16,.25); font-size:16px; letter-spacing:.015em; }
.cta::after { display:none; }
.cta:hover { background:#c24650; box-shadow:0 14px 40px rgba(8,15,24,.3); transform:translateY(-2px); }
.cta:active { transform:scale(.985); }
.hero .cta-note { max-width:348px; text-align:left; margin-top:10px; color:#a9b5be; font-size:11px; }
.hero .stores { max-width:348px; margin-top:23px; gap:10px; }
.sb { height:49px; border-radius:2px; background:rgba(8,15,24,.62); box-shadow:none; border-color:rgba(217,229,235,.24); }
.sb svg { width:22px; height:22px; }
.sb b { font-size:15px; }.sb small { font-size:9px; }
.hero .cta2 { margin-top:12px; color:#cbbba3; font-size:12px; }
.hero .cta2 svg { width:16px; height:16px; }
.hero .cta2 span { border-color:rgba(203,187,163,.3); }
.hero .rate { top:114px; right:48px; opacity:.86; }
.hero .rate-mk { width:39px; height:44px; }
.hero .cd { --cdw:32px; border-radius:3px; }
.hero .cd b { font-size:8px; }
.hero .real { bottom:39px; right:48px; font:500 9px/1 var(--sans); letter-spacing:.22em; color:#9babb5; }
.hero .cue { bottom:40px; border-radius:0; width:17px; height:29px; opacity:.7; }
.hero.grp-on .hero-in { padding-top:150px; }
.grp { max-width:480px; border-radius:3px; background:rgba(9,18,29,.88); box-shadow:none; }
.grp::after { display:none; }
.grp::before { border-radius:3px; }
.chapter-nav { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); width:var(--wrap); margin:0 auto; border-top:1px solid var(--line2); border-bottom:1px solid var(--line); }
.chapter-nav a { position:relative; display:grid; grid-template-columns:30px 1fr; align-items:center; gap:12px; min-height:96px; padding:16px 28px; transition:background .3s; }
.chapter-nav a + a { border-left:1px solid var(--line); }
.chapter-nav a:hover { background:rgba(223,229,231,.04); }
.chapter-nav i { font:500 10px/1 var(--sans); font-style:normal; color:#b26a70; }
.chapter-nav b { display:block; font-size:14px; font-weight:600; }
.chapter-nav small { display:block; margin-top:5px; font-size:8px; letter-spacing:.16em; color:var(--dim); }
.h2 { letter-spacing:-.055em; font-weight:750; line-height:1.17; }
.h2 em { color:#eee1cb; background:none; -webkit-text-fill-color:currentColor; }
.lead { color:var(--ink2); font-size:16px; line-height:1.85; letter-spacing:-.015em; }
.kicker { font:600 10px/1.4 var(--sans); letter-spacing:.26em; color:#bba98e; }
.kicker::before { background:var(--blood2); }
.kicker .k-t { color:var(--dim); }
.num { color:rgba(202,214,224,.045); font-family:var(--sans); font-weight:800; }
.sec { padding:130px 0; }
.headed { margin-bottom:40px; }
.headed .h2 { margin-top:19px; }
.pro { padding:90px 0 110px; background:var(--bg); }
.pro > .wrap { width:100%; }
.pro-head { display:flex; flex-direction:column; justify-content:center; align-items:flex-start; min-height:570px; margin-bottom:44px; padding:70px max(48px,calc((100vw - 1360px)/2)); background:linear-gradient(90deg,rgba(8,15,24,.65),rgba(8,15,24,.1) 60%),linear-gradient(180deg,#080f18 0%,transparent 18%,transparent 70%,#080f18 100%),url('m/world-illustration-v1.webp') center/cover; text-align:left; }
.pro-head .kicker { justify-content:flex-start; margin:0; }
.pro-head .kicker::after { display:none; }
.pro-head .h2 { margin:24px 0; max-width:660px; font-size:clamp(34px,4vw,58px); }
.pro-head .world-note { max-width:400px; margin:4px 0 0; color:#b7c3cd; font-size:13px; line-height:1.9; }
.reel { width:var(--wrap); margin:0 auto; gap:16px; }
.beat { border-radius:3px; border:1px solid var(--line); aspect-ratio:2.25/1; box-shadow:none; }
.beat p { font-size:14px; left:25px; bottom:21px; }
.beat i { color:#d5bda0; font-family:var(--sans); font-size:10px; letter-spacing:.12em; }
.pro .note { width:var(--wrap); margin:20px auto 0; text-align:left; color:var(--dim); font-size:11px; }
.sk { border-radius:3px; padding:0; background:transparent; box-shadow:none; border:1px solid var(--line2); }
.sk-stage { border-radius:0; aspect-ratio:1.95/1; }
.sk-stage::after { background:linear-gradient(0deg,rgba(8,15,24,.95),transparent 65%); }
.sk-cap { left:38px; bottom:35px; }
.sk-cap i { font:600 10px/1.4 var(--sans); letter-spacing:.25em; }
.sk-cap b { font-size:34px; letter-spacing:-.04em; }
.sk-cap span { font-size:14px; }
.sk-tabs { margin:0; padding:0; gap:0; background:#0d1825; }
.sk-tab { padding:19px 4px 15px; border-radius:0; border:0; border-right:1px solid var(--line); border-top:2px solid transparent; background:transparent; transition:background .25s,border-color .25s; }
.sk-tab:last-child { border-right:0; }
.sk-tab[aria-selected="true"] { background:#172333; box-shadow:none; border-color:#c85a64; }
.sk-tab img { border-radius:50%; width:46px; height:46px; opacity:.72; }
.sk-tab[aria-selected="true"] img { opacity:1; }
.sk-tab b { font-size:11px; }
.live { border-radius:1px; background:rgba(8,15,24,.8); box-shadow:none; font-size:10px; }
.frame,.shot,.tile,.lk-stage,.cu-stage,.sp-stage,.phone,.hm-hero,.hw-shot,.duel-stage,.v-shot { border-radius:3px; }
.row { gap:18px; }.tile { box-shadow:none; border:1px solid var(--line); }
.tile::after { background:linear-gradient(0deg,rgba(8,15,24,.98),transparent 65%); }
.tile b { font-size:16px; }.tile b small { color:#c2ccd3; }
.home .hm-hero { border-radius:3px; box-shadow:none; border:1px solid var(--line2); }
.hm-cap { background:none; border:0; box-shadow:none; border-radius:0; }
.home .hchips li,.chips li,.feat li { border-radius:2px; background:rgba(180,200,215,.035); border-color:var(--line); box-shadow:none; }
.hw-deck,.hw-shot,.hw-tools,.hw-tool,.hw-nav button,.hm-tabs a { border-radius:3px; }
.hm-tabs { background:transparent; }
.cu-card,.lk-card,.honors li,.fact,.duo,.duo-in,.ls-card { border-radius:3px; box-shadow:none; }
.duo { background:#101c29; border:1px solid var(--line2); }
.legend-img { border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.honors li { background:rgba(8,15,24,.6); border-color:var(--line); }
.ls { padding:36px 0 90px; background:none; }
.ls-card { max-width:100%; padding:50px 56px; background:#111e2b; border:1px solid var(--line2); text-align:left; }
.ls-card .kicker { justify-content:flex-start; }
.ls-h { font-size:clamp(27px,3vw,42px); letter-spacing:-.04em; }
.ls-p { max-width:660px; margin-left:0; }
.ls-card .stores { margin-left:0; }
.gift { padding:100px 0; background:#0b1521; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.gift-head { text-align:left; }
.gift-head .kicker { justify-content:flex-start; }.gift-head .kicker::after { display:none; }
.gift-head .lead { margin-left:0; }
.sum { margin-left:0; border-radius:2px; background:#111f2e; }
.sum b { background:none; color:#eee2cc; }
.tickets,.steps { max-width:100%; }
.ticket { border-radius:3px; padding:26px; background:#111e2b; box-shadow:none; border:1px solid var(--line2); }
.ticket.hot { background:#151d2a; }
.ticket::before,.ticket::after { display:none; }
.tk-tag,.tk-code,.copy,.tk-items li,.steps li { border-radius:2px; }
.tk-tag { font-size:10px; letter-spacing:.02em; }
.tk-name { font-size:20px; }
.tk-code { padding:9px 9px 9px 18px; background:#0b1420; border-color:var(--line2); }
.tk-code code { color:#ead8b9; font-size:22px; }
.copy { color:#fff2e4; background:#a23542; box-shadow:none; }
.tk-cut { margin-left:-26px; margin-right:-26px; opacity:.45; }
.tk-cut::before,.tk-cut::after { display:none; }
.tk-items li { background:rgba(8,15,24,.35); border-color:var(--line); }
.steps li { background:none; padding-left:0; border:0; border-top:1px solid var(--line2); }
.steps b { font:500 11px/2 var(--sans); color:#c28b91; }
.steps strong { font-size:14px; }.steps span { font-size:13px; }
.gift #giftHow > .cta { margin-top:30px; }
.end { min-height:570px; display:flex; align-items:center; padding:100px 0; background:linear-gradient(90deg,rgba(8,15,24,.8),rgba(8,15,24,.45)),url('m/world-illustration-v1.webp') center 55%/cover; text-align:left; }
.end .moon { display:none; }
.end .h2 { font-size:clamp(36px,4.2vw,64px); max-width:700px; }
.end .kicker { justify-content:flex-start!important; }
.end .cta,.end .stores,.end .cta-note { margin-left:0; max-width:348px; text-align:left; }
.end .cta-note { margin-top:12px; }
.end .stores { margin-top:26px; }
footer { background:#060d15; border-color:var(--line); }
.rating { border-radius:3px; background:#0b1622; }
.foot-brand .mk { filter:none; }
.dock { background:rgba(8,15,24,.96); }.dock .play { background:#ac3542; color:#fff2e6; border-radius:2px; box-shadow:none; }
.dock .code,.dock .gpi { border-radius:2px; }
.pop-card { border-radius:4px; background:#111e2b; border:1px solid var(--line2); box-shadow:0 28px 100px rgba(3,9,15,.65); }
.pop:not(.on) { visibility:hidden; -webkit-backdrop-filter:none; backdrop-filter:none; }
.pop.on { visibility:visible; }
.pop-gift { filter:none; }.toast { border-radius:3px; background:#142434; }
.js .rv { transition-duration:.7s; }
@media(min-width:1600px) { .hero-in { padding-top:165px; padding-bottom:145px; }.hero-art img { object-position:center 40%; } }
@media(min-width:760px) { .row { grid-template-columns:1.3fr 1fr; }.row > :nth-child(3) { grid-column:1/-1; aspect-ratio:2.7/1; }.tiles { gap:16px; }.hero .stores .sb:only-child { width:170px; } }
@media(max-width:1199px) {
  :root { --wrap:min(1120px,calc(100% - 64px)); }
  .bar { padding-left:32px;padding-right:32px; }.campaign-nav { gap:20px; padding:0 20px; }
  .campaign-nav a { font-size:12px; }.hero-in > :not(.grp) { max-width:455px; }
  .hero-title { font-size:69px; }.hero .rate { right:32px; }
  .chapter-nav a { padding:15px 19px; gap:6px; }.pro-head { padding-left:32px;padding-right:32px; }
}
@media(max-width:999px) {
  .campaign-nav { display:none; }.bar-r { margin-left:auto; }.bar { height:72px; }
  .hero { min-height:900px; }.hero-in { padding-top:180px;padding-bottom:100px; }
  .hero-media { left:-26%;width:142%; }.hero-shade { background:linear-gradient(90deg,rgba(8,15,24,.8),rgba(8,15,24,.3) 55%,transparent),linear-gradient(0deg,#080f18,transparent 70%); }
  .hero .rate { top:96px; }.chapter-nav { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .chapter-nav a { min-height:84px; }.chapter-nav a:nth-child(3) { border-left:0; }.chapter-nav a:nth-child(n+3) { border-top:1px solid var(--line); }
  .pro-head { min-height:480px; }.pro-head .h2 { font-size:44px; }.sk-stage { aspect-ratio:16/10; }
  .sk-tabs { grid-template-columns:repeat(8,minmax(90px,1fr)); overflow-x:auto; margin:0; }
  .sk-cap { left:24px;bottom:26px; }.sec { padding:90px 0; }
}
@media(max-width:759px) {
  :root { --wrap:calc(100% - 40px); }
  .bar { height:67px;padding:10px 20px; }.brand b { font-size:13px; }.brand small { font-size:8px;letter-spacing:.02em; }.brand .mk { width:25px;height:31px; }.brand { gap:8px; }
  .bar-r { gap:6px; }.bar-cta { height:36px;padding:0 16px;font-size:12px; }.lng summary { padding:0 6px;font-size:11px; }
  .hero { display:block; min-height:0; padding-top:0; }
  .hero-media { left:0;top:0;width:100%;height:520px;bottom:auto; }
  .hero-art img { object-position:center 28%; animation:none; }
  .hero-shade { height:570px;bottom:auto;background:linear-gradient(180deg,rgba(8,15,24,.17),transparent 45%,rgba(8,15,24,.7) 75%,#080f18 94%); }
  .hero-in { padding:355px 0 48px; }
  .hero-in > :not(.grp) { max-width:100%; }.hero .launch { margin-bottom:18px;font-size:10px;min-height:24px; }.launch b { font-size:7px; }
  .eyebrow { font-size:8px;letter-spacing:.23em;margin-bottom:18px; }.eyebrow i { width:18px; }
  .hero-title { font-size:clamp(45px,13vw,68px); line-height:1.02;max-width:430px!important; }.hero-title strong { margin-top:5px; }.hero-title::after { margin-top:22px;width:32px;height:2px; }
  html:not([lang="ko"]) .hero-title { font-size:clamp(38px,11vw,59px); }
  .hero .tag { margin-top:18px;font-size:15px;line-height:1.7; }
  .hero .cta { max-width:100%;height:58px;margin-top:24px;font-size:16px; }.hero .cta-note { max-width:100%;font-size:10px; }
  .hero .stores { max-width:100%;margin-top:19px; }.sb { height:49px; }.hero .cta2 { margin-top:14px; }
  .hero .rate { top:84px;right:17px;gap:4px;opacity:.88; }.hero .rate-mk { width:30px;height:34px; }.hero .cd { --cdw:25px; }.hero .cd b { font-size:6.5px; }
  .hero .real { top:312px;right:20px;bottom:auto;font-size:7px;letter-spacing:.14em; }.hero .cue { display:none; }.hero .motes { display:none; }
  .hero.grp-on .hero-in { padding-top:338px; }.hero.grp-on .grp { margin-top:0; }.grp { padding:13px 16px; }.grp-h { font-size:19px; }
  .chapter-nav { width:calc(100% - 40px); }.chapter-nav a { padding:15px 12px;gap:4px;min-height:78px;grid-template-columns:21px 1fr; }.chapter-nav b { font-size:12px; }.chapter-nav small { font-size:7px;letter-spacing:.12em; }.chapter-nav i { font-size:8px; }
  .pro { padding:35px 0 55px; }.pro-head { min-height:490px;padding:195px 20px 40px;background-position:64% center;justify-content:flex-end;background-image:linear-gradient(0deg,#080f18,rgba(8,15,24,.55) 48%,rgba(8,15,24,.05)),url('m/world-illustration-v1.webp'); }.pro-head .h2 { font-size:36px;max-width:100%;margin:18px 0; }.pro-head .world-note { max-width:100%;font-size:12px; }
  .reel { display:grid;grid-template-columns:1fr;gap:12px; }.beat { aspect-ratio:1.9/1; }.beat p { font-size:13px;left:19px;bottom:17px; }.pro .note { font-size:10px;line-height:1.7; }
  .sec { padding:76px 0; }.headed { margin-bottom:29px; }.h2 { font-size:32px;line-height:1.2; }.lead { font-size:14px;line-height:1.8; }.kicker { font-size:9px;letter-spacing:.18em; }.kicker .k-t { padding-left:0; }.num { font-size:100px; }
  .sk-stage { aspect-ratio:4/3; }.sk-cap { left:20px;bottom:24px;right:20px; }.sk-cap b { font-size:27px; }.sk-cap span { font-size:12px; }.sk-cap i { font-size:8px; }.sk-tabs { grid-template-columns:repeat(8,83px); }.sk-tab { min-height:101px;padding:15px 2px; }.sk-tab b { font-size:10px; }
  .row { gap:12px; }.tile b { font-size:14px; }.tile b small { font-size:11px; }.hm-cap { left:17px;bottom:15px; }.hm-cap b { font-size:24px; }
  .ls { padding:20px 0 55px; }.ls-card { padding:29px 23px; }.ls-h { font-size:27px; }.ls-p { font-size:13px; }.ls-card .stores { max-width:100%; }.ls-ios { font-size:11px; }
  .gift { padding:65px 0; }.ticket { padding:21px; }.tickets { margin-top:28px; }.tk-code { padding-left:13px; }.tk-code code { font-size:20px; }.steps { gap:4px; }.steps li { padding:15px 0; }.gift .h2 { font-size:31px; }.gift .lead { font-size:13px; }.sum { max-width:100%; }.tk-items li { padding:10px 5px; }
  .end { min-height:520px;padding:70px 0;background-position:65% center;background-image:linear-gradient(90deg,rgba(8,15,24,.85),rgba(8,15,24,.5)),url('m/world-illustration-v1.webp'); }.end .h2 { font-size:39px; }.end .cta,.end .stores { max-width:100%; }.end .cta-note { font-size:11px; }
  .pop-card { border-radius:6px 6px 0 0; }.dock .play { font-size:14px; }.foot { font-size:11px; }.foot nav { gap:0 16px; }
}
@media(max-width:359px) { .bar { padding-left:12px;padding-right:12px; }.brand b { font-size:12px; }.brand small { display:none; }.bar-r { gap:0; }.hero-in { padding-top:335px; }.hero-title { font-size:44px; }.hero .rate { right:12px; } }
@media(prefers-reduced-motion:reduce) { .hero-art img { animation:none; }.js .rv { opacity:1;transform:none; }.motes { display:none; } }