:root{color-scheme:light;--paper:#15343b;--muted:#536b6e;--accent:#24777b;--ease:cubic-bezier(.22,1,.36,1);font-family:Arial,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif;font-synthesis:none}
*{box-sizing:border-box}html{background:#eeeae1}body{margin:0;color:var(--paper);font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}h1,p{margin:0}button{font:inherit}a:focus-visible,summary:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:6px}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:var(--paper);color:#f1eee5;padding:10px}.skip:focus{top:15px}.wrap{width:min(1440px,calc(100% - 144px));margin-inline:auto}
.page-shell{position:relative;isolation:isolate;min-height:640px;min-height:max(640px,100svh);display:grid;grid-template-rows:1fr auto;padding-top:91px;overflow:clip;background:#eeeae1}.page-shell:after{content:"";position:absolute;inset:22px;border:1px solid #284c4f30;pointer-events:none;z-index:2}.hero-scene{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}.hero-scene picture{position:absolute;inset:0}.scene-image{width:100%;height:100%;max-width:none;object-fit:cover;object-position:63% 50%}.scene-water{position:absolute;inset:0;width:100%;height:100%;opacity:0}.scene-water.is-ready{opacity:1}.hero-scene:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f1eee5ee 0%,#f1eee5bd 29%,#f1eee530 52%,transparent 70%)}
.brand-emblem{width:104px;height:88px;margin-bottom:27px;object-fit:contain;filter:drop-shadow(0 3px 10px #28595b15)}
.masthead{display:flex;align-items:center;padding-block:30px 44px}.identity{max-width:640px}.identity h1{font-size:clamp(60px,6.4vw,96px);font-weight:400;line-height:1.02;letter-spacing:.025em;text-shadow:none}.wordmark,.wordmark-sub{display:block;font-size:inherit;font-weight:inherit;letter-spacing:inherit}.wordmark-sub{margin-top:2px;color:inherit}.intro{font-size:clamp(16px,1.15vw,19px);font-weight:400;line-height:1.8;letter-spacing:.045em;color:#36555a;max-width:510px;text-wrap:balance;margin-top:32px}.email{display:inline-flex;align-items:center;gap:40px;padding:10px 0 13px;margin-top:37px;border-bottom:1px solid #36585d70;color:#25464d;font-size:14px;letter-spacing:.025em;transition:color .25s,border-color .25s}.email svg{width:18px;height:18px;flex:none;transition:transform .35s var(--ease)}.email:hover{color:#00767d;border-color:#00767d}.email:hover svg{transform:translate(3px,-3px)}
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:16px 38px;color:#537174;font-size:10px;letter-spacing:.05em}
.scene-light{position:absolute;inset:-15%;background:conic-gradient(from 205deg at 70% 22%,transparent 0deg,#aee5dd00 10deg,#9cdcd518 22deg,transparent 34deg);mix-blend-mode:screen;transform-origin:70% 22%}.scene-mist{position:absolute;inset:20% -30% -25%;background:radial-gradient(ellipse at 69% 62%,#89cbd321,transparent 44%);mix-blend-mode:screen;filter:blur(12px);opacity:.25}.mist-back{inset:10% -20% 0%;opacity:.15;transform:scaleX(-1)}.hero-scene:has(.scene-water.is-ready) .scene-mist{display:none}.scene-particles{position:absolute;inset:0;width:100%;height:100%}.motion-enabled .mist-front{animation:mist-flow 9s ease-in-out infinite alternate}.motion-enabled .mist-back{animation:mist-return 12s ease-in-out infinite alternate}.motion-enabled .scene-light{animation:light-shift 8s ease-in-out infinite alternate}.scene-offscreen [data-ambient],.page-hidden [data-ambient]{animation-play-state:paused!important}
.error-main{padding-block:100px}.error-main h1{font-size:72px}.error-main p{margin-block:24px}.error-main a{color:var(--accent)}
@keyframes mist-flow{from{transform:translate(-5%,4%);opacity:.35}to{transform:translate(7%,-4%);opacity:.8}}@keyframes mist-return{from{transform:translate(7%,-4%) scaleX(-1)}to{transform:translate(-5%,3%) scaleX(-1)}}@keyframes light-shift{from{transform:rotate(-7deg);opacity:.35}to{transform:rotate(9deg);opacity:1}}@keyframes page-in{from{opacity:0}to{opacity:1}}@keyframes page-out{from{opacity:1}to{opacity:0}}
@view-transition{navigation:auto}::view-transition-old(root){animation:page-out .16s ease both}::view-transition-new(root){animation:page-in .26s ease both}

@media(max-width:900px){.page-shell{padding-top:84px}.wrap{width:calc(100% - 72px)}.identity h1{font-size:clamp(54px,7.2vw,76px)}.identity{max-width:550px}.intro{max-width:450px;font-size:17px}.masthead{padding-bottom:40px}}
@media(max-width:600px){.wrap{width:calc(100% - 44px)}.page-shell{min-height:max(560px,100svh);padding-top:76px}.page-shell:after{inset:12px}.brand-emblem{width:82px;height:70px;margin-bottom:24px}.masthead{align-items:flex-end;padding-block:25px 36px}.identity h1{font-size:clamp(44px,12.6vw,64px);letter-spacing:.025em}.wordmark-sub{margin-top:2px}.intro{margin-top:26px;max-width:340px;font-size:15px;line-height:1.9;letter-spacing:.02em}.email{font-size:13px;gap:32px;margin-top:28px}.email svg{width:16px;height:16px}.scene-image{object-position:61% 50%}.hero-scene:after{background:linear-gradient(0deg,#f1eee5eb 0%,#f1eee5bd 22%,#f1eee570 44%,#f1eee500 66%),linear-gradient(90deg,#f1eee53d,transparent 65%)}.site-footer{padding-block:12px 25px;font-size:9px}}
@media(max-height:600px) and (min-width:601px){.page-shell{min-height:100svh;padding-top:74px}.brand-emblem{width:64px;height:55px;margin-bottom:16px}.masthead{padding-block:16px 22px}.identity h1{font-size:48px}.wordmark-sub{margin-top:3px}.intro{margin-top:20px;font-size:16px}.email{margin-top:20px}.site-footer{padding-block:10px 28px}}
@media(prefers-reduced-motion:reduce){html:not(.motion-enabled) *,html:not(.motion-enabled) *::before,html:not(.motion-enabled) *::after{animation:none!important;transition:none!important}html:not(.motion-enabled) .scene-particles{display:none}::view-transition-old(root),::view-transition-new(root){animation:none!important}}


.contact-links{display:flex;align-items:center;flex-wrap:wrap;gap:10px 36px;margin-top:27px}.contact-links .email{margin-top:0}.steam-link{gap:22px}@media(max-width:600px){.contact-links{margin-top:21px;column-gap:28px}}@media(max-height:600px) and (min-width:601px){.contact-links{margin-top:20px}}