@font-face{font-family:CatBeatDisplay;src:url("assets/Anton-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:dark;--cyan:#62eaff;--gold:#ffd093;--ink:#020718;--white:#f8fbff;font-family:Arial,"Malgun Gothic",sans-serif;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;background:#000}body{margin:0;color:var(--white);background:#000}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline:2px solid var(--cyan);outline-offset:7px}button:disabled{cursor:wait;opacity:.65}[hidden]{display:none!important}.brand{font-family:CatBeatDisplay,Impact,"Arial Black",Arial,sans-serif;font-weight:400;font-style:normal;letter-spacing:-.065em;line-height:.85;white-space:nowrap;transform:none}.skip-link{position:fixed;z-index:99;left:20px;top:-80px;background:#fff;color:#071b51;padding:16px}.skip-link:focus{top:20px}#experience{position:relative;height:900svh}.stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate;background:#000}#world{position:absolute;inset:0;width:100%;height:100%;display:block}.opening{position:absolute;inset:0;background:#000;z-index:3;pointer-events:none}.opening-brand{position:absolute;z-index:4;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(72px,20vw,320px);filter:drop-shadow(0 3px 0 #ffffff22);pointer-events:none;will-change:opacity,transform,top}.shade{position:absolute;inset:0;background:linear-gradient(180deg,#00000019,transparent 20%,transparent 78%,#01051855);pointer-events:none}.scroll-space{height:800svh;pointer-events:none}#journey{position:absolute;top:280svh}#battle{position:absolute;top:700svh}header{position:absolute;z-index:6;left:0;right:0;top:0;display:flex;justify-content:space-between;align-items:center;padding:28px 4vw;color:#fff;text-shadow:0 2px 15px #00154c}header .small-brand{font-size:27px;letter-spacing:-.04em}nav{display:flex;align-items:center;gap:22px;font-size:12px;font-weight:600}nav button{border:0;padding:8px 0;background:transparent;display:flex;gap:7px;align-items:center;white-space:nowrap}nav svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.5}nav a{padding:8px 0;white-space:nowrap}.world-title{position:absolute;top:6%;left:4%;right:5%;pointer-events:none;opacity:0;text-align:center}.world-title .brand{font-size:clamp(70px,16vw,230px);display:block}.scene-copy{position:absolute;left:5%;top:56%;pointer-events:none;opacity:0;text-shadow:0 3px 25px #00105c99}.scene-copy h1{font-size:clamp(34px,5.8vw,86px);line-height:1.1;letter-spacing:-.07em;margin:0 0 12px;font-weight:900}.scene-copy p{font-size:17px;line-height:1.65;margin:0;font-weight:600;letter-spacing:-.03em}.scroll-hint{position:absolute;bottom:4.5%;left:50%;transform:translateX(-50%);font-size:11px;letter-spacing:.05em;display:flex;align-items:center;gap:14px;opacity:0;text-shadow:0 2px 14px #000}.scroll-hint i{display:inline-block;height:35px;width:1px;background:linear-gradient(#fff,#ffffff00)}.battle-ui{position:absolute;inset:0;pointer-events:none}.boss-hud{position:absolute;left:50%;top:12%;width:min(340px,65vw);transform:translateX(-50%)}.boss-hud>div:first-child{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px;font-size:11px;font-weight:800;letter-spacing:.03em;text-shadow:0 2px 15px #000}#hp{height:7px;background:#140d2577;border:1px solid #ffffff66;border-radius:8px;box-shadow:0 2px 18px #17112544;overflow:hidden}#hp-fill{display:block;height:100%;width:100%;background:linear-gradient(90deg,#ea4298,#ffc476);box-shadow:0 0 15px #ffbd75;transition:width 90ms linear}#hp.reset #hp-fill{transition:none;background:#fff}.battle-prompt{position:absolute;top:25%;left:5%;font-size:clamp(18px,2.6vw,36px);line-height:1.5;letter-spacing:-.05em;text-shadow:0 3px 17px #0008;margin:0}.battle-prompt strong{font-weight:900}.play-pad{pointer-events:auto;position:absolute;bottom:12%;left:50%;transform:translateX(-50%);width:min(330px,70vw);height:76px;border:1px solid #a9eeffb3;border-radius:45px;box-shadow:0 0 30px #46cfff38,inset 0 0 25px #76bfff20;background:linear-gradient(135deg,#06143bda,#0c2b4ab8);color:white;backdrop-filter:blur(12px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;touch-action:pan-y;font-size:15px;font-weight:700;letter-spacing:-.02em}.play-pad:active{background:#286576b3;box-shadow:0 0 50px #5bdfff80}.play-pad small{font-size:10px;font-weight:400;letter-spacing:.02em;color:#bfdae9}.pad-orbit{position:absolute;width:98px;height:98px;left:50%;top:50%;transform:translate(-50%,-50%);border:1px solid #96eaff33;border-radius:50%;pointer-events:none}.play-help{position:absolute;bottom:3.8%;left:10%;right:10%;font-size:11px;text-align:center;line-height:1.7;letter-spacing:-.02em;text-shadow:0 2px 8px #071327}.judgement{position:absolute;top:53%;left:50%;transform:translate(-50%,-50%);font-family:CatBeatDisplay,Impact,"Arial Black",sans-serif;font-style:normal;font-size:48px;letter-spacing:-.02em;color:#e8fcff;text-shadow:0 0 25px #25d1f8;opacity:0}.judgement.miss{font-size:22px;font-family:Arial,"Malgun Gothic",sans-serif;font-style:normal;color:#ffe6cd;text-shadow:0 0 15px #f49a6d}.sound-error{position:absolute;z-index:7;top:80px;right:4%;max-width:350px;background:#05102de8;padding:14px 18px;font-size:12px;line-height:1.7;border:1px solid #65dbff55}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}#fallback{position:absolute;z-index:5;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#030b22;text-align:center;padding:30px}#fallback h2{font-size:clamp(24px,4vw,50px);letter-spacing:-.05em}#fallback p{font-size:14px;line-height:1.8;color:#b8c7df}#fallback a{padding:15px 24px;border:1px solid #85dafd;border-radius:40px;margin-top:20px}#review-badge{position:absolute;left:14px;bottom:12px;background:#091120bb;font-size:10px;padding:7px 10px;border:1px solid #ffffff30;border-radius:5px;z-index:9;pointer-events:none}.about{position:relative;background:#040916;padding:130px 6vw 0;overflow:hidden;isolation:isolate}.about-heading{max-width:1280px;margin:auto;position:relative}.about-lead{font-size:14px;color:#a2b5d7;letter-spacing:-.02em;margin:0 0 30px}.about h2{font-size:clamp(58px,10.3vw,156px);line-height:1.05;letter-spacing:-.08em;font-weight:900;margin:0 0 40px}.about-description{position:absolute;right:0;bottom:8px;font-size:15px;line-height:1.9;letter-spacing:-.02em;color:#bdc9df}.game-art{position:relative;max-width:1280px;margin:70px auto 0;aspect-ratio:16/8.7;border-radius:3px;overflow:hidden;box-shadow:0 20px 120px #093da52b}.game-art-bg{width:100%;height:100%;object-fit:cover}.about-cat{position:absolute;bottom:10%;left:13%;width:22%;filter:drop-shadow(0 12px 6px #2a210e60)}figcaption{position:absolute;bottom:13px;right:18px;font-size:10px;color:#fff;text-shadow:0 1px 6px #000}.game-story{max-width:1280px;margin:110px auto 140px;display:grid;grid-template-columns:1fr 1fr;gap:10%}.game-story h3{font-size:clamp(30px,4vw,58px);letter-spacing:-.065em;line-height:1.15;margin:0 0 25px}.game-story p{font-size:14px;line-height:1.9;color:#a6b6d1}.mode-list h3{font-size:18px;letter-spacing:-.03em;margin-bottom:30px}.mode-list p{display:grid;grid-template-columns:88px 1fr;border-top:1px solid #849bd226;padding:20px 0;margin:0;line-height:1.6;font-size:13px}.mode-list strong{color:#e5edff;font-size:15px}.finale{max-width:1280px;margin:auto;text-align:center;padding-bottom:90px}.finale .brand{font-size:clamp(72px,18vw,270px);color:#2e65ff;text-shadow:0 0 100px #2449da44}.finale>p:first-of-type{font-size:19px;margin:30px 0;letter-spacing:-.04em}.return-link{display:inline-block;border:1px solid #7b99c5;border-radius:40px;padding:17px 30px;font-size:13px}.release-note{font-size:11px;line-height:1.8;color:#8493ad;margin:35px auto 0}footer{background:#040916;padding:25px 6vw;border-top:1px solid #ffffff12;display:flex;align-items:center;justify-content:space-between;color:#7f8da9;font-size:10px}.noscript-note{padding:30px;text-align:center}body.error #opening-brand{display:none}body.error #experience{height:100svh}body.error .scroll-space{height:0}
@media(max-width:700px){header{padding:20px 5vw}header .small-brand{font-size:20px}nav{gap:13px;font-size:10px}#pause{display:flex}nav svg{display:none}.world-title{top:13%}.world-title .brand{font-size:20vw}.scene-copy{left:6%;top:35%}.scene-copy h1{font-size:39px}.scene-copy p{font-size:12px}.scroll-hint{font-size:9px;bottom:5%;white-space:nowrap}.battle-prompt{top:24%;left:6%;font-size:23px}.boss-hud{top:12%}.play-pad{bottom:14%;height:68px}.play-help{bottom:5%;font-size:10px}.about{padding:80px 6vw 0}.about-description{position:static;font-size:12px;margin-top:35px}.about h2{font-size:16vw}.about-lead{font-size:11px}.game-art{margin-top:40px;aspect-ratio:1.2}.game-art-bg{object-position:58% center}.about-cat{width:32%;left:9%}.game-story{margin:70px auto;grid-template-columns:1fr;gap:50px}.game-story h3{font-size:40px}.game-story p{font-size:12px}.mode-list h3{font-size:17px}.mode-list p{grid-template-columns:75px 1fr;font-size:11px}.mode-list strong{font-size:13px}.finale{padding-bottom:60px}.finale .brand{font-size:19vw}.finale>p:first-of-type{font-size:16px}.return-link{padding:15px 25px;font-size:11px}footer{gap:15px;flex-wrap:wrap}footer span:last-child{display:none}.sound-error{left:6%;right:6%;top:65px;max-width:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}#hp-fill{transition:none}.play-pad{backdrop-filter:none}}

@media(min-width:701px){.play-pad{bottom:3%;height:56px;width:250px;font-size:13px}.play-help{left:5%;right:auto;bottom:5%;width:300px;text-align:left}.pad-orbit{width:76px;height:76px}}

nav button,nav a{min-height:44px;min-width:44px;justify-content:center;display:flex;align-items:center}

/* CB-0362: reference-shaped CAT BEAT artwork; font-size remains the scroll size contract. */
.brand{position:relative;display:inline-block;width:3.25em;aspect-ratio:1875/332;height:auto;line-height:1;letter-spacing:normal;vertical-align:middle;transform:none}
.brand::before{content:"";position:absolute;inset:0;background:currentColor;-webkit-mask:url("assets/cat-beat-wordmark-r1.webp") center/contain no-repeat;mask:url("assets/cat-beat-wordmark-r1.webp") center/contain no-repeat}
.brand-label{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.world-title .brand{width:3.25em;max-width:100%;margin-inline:auto}
.opening-brand{transform:translate(-50%,-50%);filter:drop-shadow(0 0 2px #ffffff25)}

/* CB-0363: the lower portrait stays in shadow until the city opens. */
.king-vignette{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;background:linear-gradient(180deg,#0000 12%,#0000 42%,#000b 74%,#000 100%)}
html{overscroll-behavior-y:none}

/* CB-0363: a plain white sentence, at center + one quarter viewport height. */
.continue-hint{position:absolute;z-index:7;left:50%;top:75%;transform:translate(-50%,-50%);margin:0;width:calc(100% - 40px);max-width:680px;color:#fff;text-align:center;font-size:clamp(12px,1.15vw,17px);font-weight:500;line-height:1.65;letter-spacing:-.025em;text-shadow:0 2px 14px #0009;pointer-events:none}
.stage.can-advance{cursor:pointer}

/* User blue-box reference: white portrait title, wider and taller. */
.opening-brand{position:absolute;width:72vw;height:15vw;aspect-ratio:auto;left:50%;transform:translate(-50%,-50%)}
.opening-brand::before{-webkit-mask-size:100% 100%;mask-size:100% 100%}

/* CB-0366: shared source wordmark, sky road art, and unobstructed travel framing. */
.brand{aspect-ratio:1875/400}
.brand::before{-webkit-mask-image:url("assets/image-lod-v1/T-01-2.webp");mask-image:url("assets/image-lod-v1/T-01-2.webp")}
.opening-brand{width:80vw;height:auto;aspect-ratio:1875/400;filter:none}
.opening-brand::before{-webkit-mask-size:contain;mask-size:contain}
.world-title{top:7.5%;left:5%;right:5%;z-index:2}
.world-title .brand{width:min(82vw,1120px);aspect-ratio:1875/400}
.scene-copy{left:auto;right:6%;top:34%;text-align:right;z-index:2}
.scene-copy h1{font-size:clamp(30px,4.2vw,66px);margin-bottom:9px}
.scene-copy p{font-size:clamp(12px,1.1vw,16px)}
.boss-hud{top:13%;width:min(360px,65vw)}
.battle-prompt{top:26%;font-size:clamp(19px,2.3vw,33px)}
.continue-hint{z-index:5}
.battle-ui{z-index:6}
@media(max-width:700px){
 .world-title{top:10%}
 .world-title .brand{width:90vw}
 .scene-copy{top:31%;right:6%;max-width:45vw}
 .scene-copy h1{font-size:clamp(25px,6.6vw,42px)}
 .scene-copy p{font-size:11px}
 .boss-hud{top:12.5%;width:67vw}
 .battle-prompt{top:24%;font-size:21px}
 .continue-hint{font-size:12px}
}
@media(max-height:500px) and (min-width:701px){
 header{padding:12px 4vw}
 .world-title{top:8%}
 .world-title .brand{width:58vw}
 .scene-copy{top:37%;right:5%}
 .scene-copy h1{font-size:35px}
 .scene-copy p{display:none}
 .boss-hud{top:15%;width:260px}
 .battle-prompt{font-size:18px}
 .play-help{font-size:9px;bottom:2.5%}
 .play-pad{height:49px;bottom:3%;width:210px}
}
