:root{font-family:"PingFang SC","Microsoft YaHei",system-ui,sans-serif;color:#192329;background:#f7f5ef;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}a:focus-visible{outline:3px solid #dba855;outline-offset:4px}.site-header{height:76px;padding:0 clamp(24px,5vw,84px);display:flex;align-items:center;justify-content:space-between;background:#f7f5ef}.brand{font-size:19px;font-weight:800;letter-spacing:.08em}.brand span{font-size:14px;font-weight:500;letter-spacing:0;color:#69747b}.site-header nav{display:flex;gap:34px;font-size:14px;font-weight:600}.site-header nav a:hover,.site-footer a:hover{color:#a57027}.hero{min-height:min(760px,calc(100svh - 76px));position:relative;display:flex;align-items:center;background:#334453 url("../../images/intro.jpg") center 42%/cover no-repeat;color:#fff}.hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(11,25,35,.88),rgba(11,25,35,.56) 43%,rgba(11,25,35,.04) 78%)}.hero-content{position:relative;width:min(700px,90%);margin-left:clamp(24px,8vw,140px);padding:80px 0 100px}.eyebrow{margin:0 0 22px;color:#956b36;font-size:12px;font-weight:800;letter-spacing:.23em}.hero .eyebrow,.game-section .eyebrow{color:#f1d29f}.hero h1{margin:0;font-size:clamp(42px,5.7vw,86px);line-height:1.16;letter-spacing:-.04em}.hero-description{max-width:440px;margin:27px 0 35px;color:rgba(255,255,255,.88);line-height:1.9;font-size:17px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:32px;padding:15px 24px;border-radius:4px;font-size:14px;font-weight:750;transition:transform .2s,background .2s}.button:hover{transform:translateY(-3px)}.button-light{background:#fff;color:#24333b}.button-light:hover{background:#f0e5d4}.button-gold{background:#edbf78;color:#192329;white-space:nowrap}.button-gold:hover{background:#ffcf86}.hero-scroll{position:absolute;bottom:31px;left:clamp(24px,8vw,140px);font-size:12px;letter-spacing:.15em;color:rgba(255,255,255,.8)}.section-wrap{width:min(1180px,calc(100% - 48px));margin:auto}.about{padding:112px 0 120px;display:grid;grid-template-columns:180px minmax(0,1fr) 230px;gap:42px;align-items:start}.section-marker,.detail-label{font-size:12px;letter-spacing:.17em;font-weight:800;color:#a87b42}.section-marker{padding-top:10px}.about-copy h2{max-width:680px;margin:0 0 24px;font-size:clamp(30px,3.5vw,53px);line-height:1.35;letter-spacing:-.04em}.about-copy>p:last-child{max-width:630px;margin:0;color:#5d6970;font-size:17px;line-height:2}.about-note{display:flex;flex-direction:column;gap:13px;padding-top:35px}.about-note span{border:1px solid #d9d8d2;border-radius:100px;padding:10px 17px;color:#647078;font-size:13px;text-align:center}.game-section{background:#111c28;color:#f6f2e9;padding:110px 0 116px}.game-heading{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:44px}.game-heading h2{margin:0 0 14px;font-size:clamp(42px,5vw,74px);line-height:1.1;letter-spacing:-.04em}.game-heading p:last-child{max-width:590px;margin:0;color:#b7c2ca;line-height:1.85}.game-showcase{display:grid;grid-template-columns:1.25fr .75fr;min-height:420px;overflow:hidden;border:1px solid #354553;border-radius:9px;background:#1a2936}.game-art{position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:22px;min-height:420px;background:linear-gradient(180deg,rgba(8,26,49,.12),rgba(8,26,49,.42)),url("../../images/game/back.webp") center/cover no-repeat}.game-logo{width:105px;filter:drop-shadow(0 12px 20px rgba(0,0,0,.45))}.game-art span{font-size:13px;letter-spacing:.13em;text-shadow:0 2px 10px #06182a}.game-details{padding:clamp(30px,4vw,64px);display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.game-details h3{margin:28px 0 20px;font-size:clamp(25px,2.7vw,40px);line-height:1.4;letter-spacing:-.03em}.game-details p{margin:0 0 30px;color:#b7c2ca;line-height:1.9}.text-link{border-bottom:1px solid #d4aa69;padding-bottom:7px;color:#edbf78;font-size:14px;font-weight:700}.character-row{display:grid;grid-template-columns:1.1fr repeat(3,1fr);gap:18px;margin-top:26px}.character-copy,.character-row figure{margin:0;min-height:210px;border:1px solid #354553;border-radius:7px;background:#1a2936}.character-copy{padding:30px;display:flex;flex-direction:column;justify-content:space-between}.character-copy strong{font-size:23px;line-height:1.4}.character-row figure{overflow:hidden;display:flex;align-items:center;justify-content:center;position:relative}.character-row figure img{width:100%;height:210px;object-fit:cover;object-position:center 25%;opacity:.82;transition:transform .25s}.character-row figure:hover img{transform:scale(1.04)}.character-row figcaption{position:absolute;bottom:0;left:0;right:0;padding:24px 15px 13px;background:linear-gradient(transparent,rgba(0,0,0,.68));font-size:13px;font-weight:700}.site-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:100px;padding:25px clamp(24px,5vw,84px);font-size:13px;color:#647078}@media(max-width:800px){.about{grid-template-columns:1fr;gap:24px;padding:75px 0}.about-note{flex-direction:row;padding-top:0}.about-note span{min-width:84px}.game-section{padding:75px 0}.game-heading{align-items:start;flex-direction:column}.game-showcase{grid-template-columns:1fr}.game-art{min-height:330px}.game-details{padding:36px}.character-row{grid-template-columns:repeat(3,1fr)}.character-copy{grid-column:1/-1;min-height:110px;flex-direction:row;align-items:end}}@media(max-width:560px){.site-header{height:66px;padding:0 20px}.brand{font-size:17px}.brand span{display:none}.site-header nav{gap:16px;font-size:12px}.hero{min-height:calc(100svh - 66px);background-position:38% center}.hero:before{background:linear-gradient(0deg,rgba(11,25,35,.82),rgba(11,25,35,.28) 75%)}.hero-content{margin:0 24px;padding:190px 0 120px;width:calc(100% - 48px)}.hero h1{font-size:43px}.hero-description{font-size:15px}.hero-scroll{left:24px}.section-wrap{width:calc(100% - 40px)}.about-copy>p:last-child{font-size:15px}.game-art{min-height:255px}.game-logo{width:80px}.character-row{gap:8px}.character-row figure,.character-row figure img{min-height:140px;height:140px}.character-row figcaption{font-size:11px}.site-footer{padding:25px 20px}}
:root {
  --ease-out: cubic-bezier(.22, 1, .36, 1);
  --gold: #edbf78;
}

html { scroll-padding-top: 90px; }
body { overflow-x: hidden; }
::selection { background: #edbf78; color: #17232e; }

.scroll-progress {
  position: fixed;
  z-index: 100;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, #c88a3c, #f7d599);
  transform: scaleX(0);
  transform-origin: left;
  pointer-events: none;
}

.site-header {
  position: sticky;
  z-index: 90;
  top: 0;
  background: rgba(247, 245, 239, .92);
  border-bottom: 1px solid rgba(25, 35, 41, .06);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transition: box-shadow .35s ease, background .35s ease;
}
.site-header.is-scrolled { box-shadow: 0 10px 35px rgba(15, 27, 37, .1); }
.site-header nav a {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 76px;
  transition: color .25s ease;
}
.site-header nav a::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 15px;
  left: 0;
  height: 2px;
  border-radius: 2px;
  background: #bb8542;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s var(--ease-out);
}
.site-header nav a:hover::after,
.site-header nav a[aria-current="page"]::after { transform: scaleX(1); }
.site-header nav a[aria-current="page"] { color: #9d682a; }

.hero { background-position: 46% center; }
.hero::before { background: linear-gradient(90deg, rgba(10, 22, 33, .04) 18%, rgba(10, 22, 33, .18) 48%, rgba(10, 22, 33, .76) 100%); }
.hero::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  height: 150px;
  background: linear-gradient(transparent, rgba(11, 23, 35, .18));
  pointer-events: none;
}
.hero-content { z-index: 1; width: min(560px, 42%); margin-left: auto; margin-right: clamp(32px, 7vw, 120px); }
.hero-scroll { z-index: 1; }
.hero h1 { text-wrap: balance; font-size: clamp(42px, 4.8vw, 70px); }
.button { min-height: 50px; box-shadow: 0 10px 26px rgba(0, 0, 0, .12); transition: transform .4s var(--ease-out), box-shadow .4s var(--ease-out), background .25s ease; }
.button:hover { transform: translateY(-4px); box-shadow: 0 16px 35px rgba(0, 0, 0, .19); }
.button span { display: inline-block; transition: transform .4s var(--ease-out); }
.button:hover span { transform: translate(3px, -3px); }
.button:active { transform: translateY(-1px) scale(.98); }

.about { position: relative; }
.about::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 45px;
  left: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, #d9d8d2 18%, #d9d8d2 82%, transparent);
}
.about-note span { transition: background .25s ease, color .25s ease, border-color .25s ease, transform .4s var(--ease-out); }
.about-note span:hover { background: #213242; color: #fff; border-color: #213242; transform: translateX(-4px); }

.game-section { position: relative; overflow: hidden; background: radial-gradient(circle at 90% 0%, #223b52 0%, #111c28 45%); }
.game-section::before {
  content: "";
  position: absolute;
  top: -200px;
  right: -140px;
  width: 500px;
  height: 500px;
  border: 1px solid rgba(237, 191, 120, .12);
  border-radius: 50%;
  pointer-events: none;
}
.game-section .section-wrap { position: relative; }
.game-showcase { box-shadow: 0 34px 85px rgba(0, 0, 0, .18); transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out), border-color .3s ease; }
.game-showcase:hover { transform: translateY(-5px); border-color: rgba(237, 191, 120, .35); box-shadow: 0 42px 95px rgba(0, 0, 0, .26); }
.game-art { isolation: isolate; overflow: hidden; background: #203d61; }
.game-art::before { content: ""; position: absolute; z-index: 0; inset: 0; background: linear-gradient(180deg, rgba(8, 26, 49, .12), rgba(8, 26, 49, .42)), url("../../images/game/back.webp") center / cover no-repeat; transition: transform .8s var(--ease-out); }
.game-showcase:hover .game-art::before { transform: scale(1.045); }
.game-art > * { position: relative; z-index: 1; }
.game-logo { transition: transform .6s var(--ease-out); }
.game-showcase:hover .game-logo { transform: translateY(-5px) scale(1.04); }
.character-row figure { transition: transform .4s var(--ease-out), border-color .25s ease, box-shadow .4s ease; }
.character-row figure:hover { transform: translateY(-6px); border-color: rgba(237, 191, 120, .5); box-shadow: 0 18px 34px rgba(0, 0, 0, .2); }
.character-row figure img { transition: transform .55s var(--ease-out), opacity .3s ease; }
.character-row figure:hover img { transform: scale(1.06); opacity: 1; }
.text-link { transition: color .25s ease, border-color .25s ease; }
.text-link:hover { color: #fff; border-color: #fff; }

.has-motion [data-reveal] { opacity: 0; transform: translateY(25px); transition: opacity .75s var(--ease-out), transform .75s var(--ease-out); }
.has-motion [data-reveal].is-visible { opacity: 1; transform: translateY(0); }
.has-motion .about-copy { transition-delay: .09s; }
.has-motion .about-note { transition-delay: .18s; }
.has-motion .game-showcase { transition-delay: .08s; }
.has-motion .character-row { transition-delay: .16s; }

@media (max-width: 800px) {
  .site-header nav a { height: 76px; }
  .about::after { bottom: 30px; }
  .hero-content { width: min(520px, 48%); margin-right: 30px; }
}
@media (max-width: 560px) {
  html { scroll-padding-top: 66px; }
  .site-header nav a { height: 66px; }
  .site-header nav a::after { bottom: 10px; }
  .hero { background-position: 38% center; }
  .hero::before { background: linear-gradient(0deg, rgba(10, 22, 33, .9), rgba(10, 22, 33, .3) 76%); }
  .hero-content { width: calc(100% - 48px); margin: 0 24px; padding-top: 205px; }
  .game-heading .button { width: 100%; }
  .character-row figure img { object-position: center 15%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .has-motion [data-reveal] { opacity: 1; transform: none; }
}