@font-face{font-family:GameUI;src:url('/assets/ui-display.woff2') format('woff2');font-style:normal;font-weight:900;font-display:swap}
@font-face{font-family:GameUI;src:url('/assets/ui-text.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
@font-face{font-family:GameDigits;src:url('/assets/ui-digits.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
:root{--bg:#0b121f;--surface:#172238;--paper:#f2f3ff;--muted:#adb9cf;--gold:#bdd9fc;--gold-light:#edf5ff;--line:#394c70;--serif:GameUI,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;--sans:GameUI,'Hiragino Kaku Gothic ProN','Yu Gothic',sans-serif;--ui-raised:#223250;--ui-edge:#82a0d6;--ui-deep:#050913;--section:clamp(72px,8vw,115px)}
.game-ui{font-weight:700;background:var(--ui-deep)}
.comparison-bar{min-height:36px;padding:7px 5%;display:flex;justify-content:space-between;gap:15px;background:#172238;border-bottom:1px solid var(--line);font-size:10px;line-height:1.7;color:var(--muted)}
.comparison-bar a{color:var(--paper);text-decoration:underline;text-underline-offset:4px}.comparison-bar a span{margin-left:7px;color:var(--gold)}
.site-header{height:92px;background:linear-gradient(110deg,#172238 0 23%,#0b121f 23%);border-bottom-color:var(--ui-edge)}
.brand{font-size:23px;font-weight:900;letter-spacing:.02em;gap:14px}.brand small{font-family:GameDigits,sans-serif;font-size:9px;letter-spacing:.17em}.brand-mark{width:46px;height:46px;clip-path:polygon(20% 0,80% 0,100% 20%,100% 80%,80% 100%,20% 100%,0 80%,0 20%);background:var(--ui-edge);padding:1px}.brand-mark img{width:100%;height:100%;object-fit:cover}
.site-header nav{gap:8px;font-size:12px}.site-header nav a{padding:10px 19px;border:1px solid var(--line);background:#09101d;min-height:44px;display:flex;align-items:center;justify-content:center}.site-header nav a:hover{background:var(--ui-raised);border-color:var(--ui-edge)}.site-header nav .nav-info{border-color:var(--ui-edge);background:linear-gradient(#233453,#121f38);padding-inline:20px}
h1,h2,h3{font-weight:900;letter-spacing:.025em}h2{font-size:clamp(30px,3.5vw,44px)}.eyebrow{color:var(--muted);font-family:GameDigits,GameUI,sans-serif;font-size:11px;letter-spacing:.15em}
.hero{height:calc(100svh - 128px);min-height:700px;max-height:950px;background:linear-gradient(118deg,#0b121f 0 33%,transparent 64%)}
.hero-art{background:var(--bg);inset:0 0 0 35%}.hero-art img{opacity:.75}.hero-art:after{background:linear-gradient(90deg,#0b121f,rgba(11,18,31,.75) 17%,rgba(11,18,31,.12) 70%),linear-gradient(0deg,#050913,transparent 45%)}
.hero-frame{inset:24px;border-color:#82a0d659}.hero-frame:before,.hero-frame:after{content:'';width:30px;height:5px;padding:0;background:var(--ui-edge);transform:skewX(-40deg)}.hero-frame:before{left:22px;top:-3px}.hero-frame:after{right:22px;bottom:-3px}
.hero-content{padding-bottom:50px}.hero-content>.eyebrow{font-size:12px;color:var(--paper);letter-spacing:.06em}.line{width:6px;height:18px;transform:skewX(-18deg)}
.hero-catch{font-size:clamp(25px,2.5vw,34px);letter-spacing:.07em;margin-top:28px;color:var(--gold)}
.hero h1{font-size:clamp(55px,7.1vw,100px);line-height:1.3;letter-spacing:-.035em;margin-top:15px;text-shadow:0 3px 0 #394c70,0 10px 35px #03060dcc;white-space:nowrap}
.hero-english{font-family:GameDigits,sans-serif;font-size:clamp(14px,1.6vw,21px);font-weight:700;font-style:italic;letter-spacing:.26em;margin:5px 0 18px;color:var(--muted)}
.hero-subtitle{display:inline-block;font-size:13px;letter-spacing:.12em;padding:5px 13px;background:#172238;border-left:3px solid var(--ui-edge);margin-bottom:27px}.hero-description{color:var(--paper);font-size:13px;letter-spacing:.04em;line-height:2}
.button-gold{position:relative;isolation:isolate;background:var(--gold);border:0;min-height:62px;min-width:260px;padding:18px 28px;color:#0d1116;clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);font-weight:900;letter-spacing:.08em;box-shadow:0 0 24px #afcaee40}
.button-gold:before{content:'';position:absolute;inset:2px;clip-path:inherit;z-index:-1;background:linear-gradient(#cce2ff,#adc9ec 52%,#8ca7ca)}
.button-gold:after{content:'';position:absolute;right:19px;top:8px;bottom:8px;width:9px;border-inline:3px solid #1f263037;transform:skewX(-22deg);z-index:-1}
.button-gold:hover{background:var(--gold-light);color:#0d1116;transform:translateY(-2px)}.button-gold:hover:before{background:linear-gradient(#edf5ff,#bdd9fc)}.button-gold:active{transform:scale(.98)}.button-gold:focus-visible{outline:0;box-shadow:inset 0 0 0 5px #0d1116}
.hero-platform{font-family:GameDigits,sans-serif;color:var(--muted);font-size:12px}.hero-side{font-family:GameDigits,sans-serif;color:var(--muted)}.hero-number,.scroll-cue{font-family:GameDigits,sans-serif;color:var(--muted)}
.hero-cards{right:5%;top:49%;width:43%}.card-stage:before{background:radial-gradient(ellipse,#82a0d62b,transparent 65%)}.card-count{font-family:GameDigits,sans-serif;font-size:14px;font-weight:700;color:var(--paper)}
.card-controls{gap:9px}.card-controls button{position:relative;border:0;background:var(--ui-edge);color:var(--paper);isolation:isolate;clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px)}
.card-controls button:before{content:'';position:absolute;inset:1px;clip-path:inherit;z-index:-1;background:#0d1523}.card-controls button:hover:before{background:#233453}.card-controls button:focus-visible{outline:0;box-shadow:inset 0 0 0 4px var(--gold-light)}.card-controls .card-toggle{margin-left:6px}
.about{background:var(--bg)}.about-intro h2{line-height:1.75;letter-spacing:.025em}.about-intro>p:last-child{color:var(--muted);font-size:14px}.game-highlights{margin-top:46px;padding:25px 0;background:linear-gradient(120deg,#172238,#0b121f);border:1px solid var(--line)}
.game-highlights dt{font-family:GameDigits,sans-serif;font-size:10px;letter-spacing:.13em}.game-highlights strong{font-family:GameDigits,sans-serif;font-size:66px;font-weight:700;font-style:italic;line-height:1.2;color:var(--paper)}.game-highlights dd{font-size:12px}.game-highlights .offline-word{font-family:GameDigits,sans-serif;font-size:35px;line-height:2.25}
.section-heading{position:relative;padding:19px 25px;border-top:1px solid var(--ui-edge);border-bottom:1px solid var(--line);background:linear-gradient(110deg,#172238,#0b121f);margin-bottom:32px}.section-heading:after{display:none}.section-heading h2{margin-top:3px;line-height:1.5}.section-index{font-family:GameDigits,sans-serif;font-size:11px;letter-spacing:.1em;padding-bottom:6px;color:var(--muted)}
.system{padding-top:30px}.feature{isolation:isolate;border:0;background:var(--line);clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px)}
.feature:after{content:'';position:absolute;inset:1px;z-index:-1;clip-path:inherit;background:linear-gradient(140deg,#172238,#0b121f 70%)}.feature-battle:before{display:none}.feature-copy h3{letter-spacing:.025em;line-height:1.6;margin-bottom:22px}.feature-copy>p:not(.eyebrow){color:var(--muted)}.feature-no{font-family:GameDigits,sans-serif;color:var(--ui-edge);font-size:46px;font-weight:700;font-style:italic;margin-bottom:18px}.feature-copy .eyebrow{margin-bottom:8px}.feature-note{color:var(--paper);font-size:14px;background:#09101d;border:1px solid var(--line);padding:14px 18px}.feature-note span{color:var(--ui-edge)}
/* System 02 and 03: keep the full screenshot inside its clipped panel. */
.feature-collect,.feature-deck{padding-bottom:32px}
.collect-pair .screenshot{margin-bottom:0}
.screenshot,.screenshot-battle,.collect-pair .screenshot,.feature-labyrinth .screenshot{transform:none;border-color:var(--ui-edge);box-shadow:0 20px 45px #03060d80}.screenshot:hover,.screenshot-battle:hover,.collect-pair .screenshot:hover,.feature-labyrinth .screenshot:hover{transform:translateY(-4px)}.zoom-hint{background:#09101dee;border-color:var(--ui-edge);color:var(--paper)}.battle-decoration{display:none}.text-link{color:var(--paper)}
.characters{background:#0b121f}.rival-feature{background:linear-gradient(135deg,#172238,#0b121f);border-color:var(--line)}.rival-copy h3{letter-spacing:.02em}.character-lineup .character-image{border:0}.character-lineup figcaption{font-size:15px;line-height:1.9;color:var(--muted)}.small-divider{background:var(--ui-edge)}
.story:before{background:linear-gradient(0deg,#050913,#0b121fe6 25%,#0b121fd1 75%,#050913)}.story h2{letter-spacing:.06em}.story-content>p:not(.eyebrow){font-size:16px;font-weight:700;letter-spacing:.035em}.story-ornament{color:var(--ui-edge);font-family:GameDigits,sans-serif;font-size:28px}.story-content>.story-last{color:var(--paper)}
.information{background:var(--bg)}.product-summary>img{border-radius:0;border-color:var(--ui-edge)}.product-summary h3{letter-spacing:.025em}.product-spec>div{border-color:var(--line)}.follow{border-color:var(--line)}.follow h3{font-size:26px}.social-links a{background:linear-gradient(#233453,#121f38);border-color:var(--ui-edge)}.social-links a:hover{background:#223250}.site-footer{background:#050913;border-color:var(--line)}.footer-links,.site-footer>small{color:var(--muted)}
.lightbox{background:linear-gradient(#152136,#090f1b);border-color:var(--ui-edge)}.lightbox::backdrop{background:#03060ded}.lightbox button{border-color:var(--ui-edge);background:#121f38}.lightbox button:hover{background:#223250}
@media(min-width:1600px){.hero h1{font-size:106px}.hero-cards{right:max(6%,calc((100vw - 1370px)/2))}}
@media(min-width:768px) and (max-width:1100px){.hero h1{font-size:7vw}.site-header nav a{padding:10px 12px}.site-header nav .nav-info{padding-inline:14px}.brand{font-size:21px}.hero-description{font-size:12px}.hero-cards{right:4%;width:43%}}
@media(max-width:767px){.comparison-bar{padding:7px 20px;font-size:9px;gap:8px}.site-header{height:80px;padding-inline:24px;background:linear-gradient(110deg,#172238 0 54%,#0b121f 54%)}.brand{font-size:20px;gap:10px}.brand-mark{width:38px;height:38px}.site-header nav .nav-info{padding:9px 13px;font-size:10px}.hero{height:auto;min-height:0;padding-bottom:100px;background:none}.hero-art{inset:0}.hero-art img{opacity:.6;object-position:60% 20%}.hero-art:after{background:linear-gradient(90deg,#0b121fc7,#0b121f45),linear-gradient(0deg,#050913,transparent 45%)}.hero-frame{inset:16px}.hero-content{padding:36px 36px 12px}.hero-content>.eyebrow{font-size:10px}.hero-catch{font-size:27px;margin-top:23px}.hero h1{font-size:clamp(47px,11.5vw,76px);margin-top:16px}.hero-english{font-size:13px;letter-spacing:.23em;margin-top:6px;margin-bottom:16px}.hero-subtitle{font-size:11px;padding:4px 10px;margin-top:0;margin-bottom:18px;letter-spacing:.12em}.hero-description{font-size:12px;line-height:2.1}.hero .button{min-width:240px;min-height:58px;padding:16px 24px;margin-top:20px}.hero-platform{font-size:10px}.hero-cards{right:auto;top:auto;width:min(88%,440px);margin:8px auto 0}.hero-side{display:none}.hero-number{bottom:26px}.scroll-cue{left:36px;bottom:52px}.about-intro h2{font-size:28px;letter-spacing:.015em}.about-intro>p:last-child{font-size:12px}.game-highlights{padding:21px 0}.game-highlights strong{font-size:46px}.game-highlights dt{font-size:8px}.game-highlights dd{font-size:9px}.game-highlights .offline-word{font-size:21px;line-height:2.63}.section-heading{padding:15px 18px;gap:10px}.section-heading h2{font-size:29px}.section-index{font-size:9px;padding-bottom:5px}.section-heading .eyebrow{font-size:9px}.feature-copy h3,.collect-pair h3{font-size:29px}.feature-note{font-size:12px;padding:12px}.character-lineup figcaption{font-size:12px}.story-content>p:not(.eyebrow){font-size:13px}.story h2{font-size:39px}.product-summary h3{font-size:27px}.follow h3{font-size:23px}}
@media(max-width:359px){.comparison-bar{padding-inline:15px;font-size:8px}.site-header{padding-inline:18px}.brand{font-size:18px;gap:8px}.brand-mark{width:32px;height:32px}.brand small{font-size:7px}.site-header nav .nav-info{padding-inline:10px;font-size:9px}.hero-content{padding-inline:27px}.hero h1{font-size:47px}.hero-catch{font-size:25px}.hero-description{font-size:11px}.hero-english{font-size:12px}.scroll-cue{left:27px}.about-intro h2{font-size:25px}.section-heading{padding-inline:14px}.section-heading h2{font-size:26px}.section-heading .eyebrow{font-size:8px}.section-index{font-size:8px}.game-highlights dt{font-size:7px}.game-highlights .offline-word{font-size:18px;line-height:3.05}.feature-copy h3,.collect-pair h3{font-size:27px}.feature-note{font-size:11px}.character-lineup figcaption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.button-gold:hover,.button-gold:active,.screenshot:hover,.screenshot-battle:hover,.collect-pair .screenshot:hover,.feature-labyrinth .screenshot:hover{transform:none}}

.button-gold:focus-visible:before{box-shadow:inset 0 0 0 3px #0d1116}
.card-controls button:focus-visible:before{box-shadow:inset 0 0 0 3px var(--gold-light)}

/* Official wordmark: keep the approved artwork's full alpha and aspect ratio. */
.site-header .brand{display:block;line-height:0;flex-shrink:0}
.site-header .site-logo{width:210px;height:auto}
.hero{height:calc(100svh - 92px);min-height:820px}
.hero h1.hero-logo{width:min(100%,560px);font-size:inherit;line-height:1;margin:12px 0 18px;white-space:normal}
.hero-logo img{width:100%;height:auto}
.hero .button{justify-content:center;gap:0}
@media(min-width:768px) and (max-width:1100px){.site-header .site-logo{width:190px}}
@media(max-width:767px){.site-header .site-logo{width:180px}.hero{height:auto;min-height:0}.hero h1.hero-logo{margin:12px 0 18px}}
@media(max-width:359px){.site-header .site-logo{width:160px}}
