.route-hero h1 { font-size: clamp(40px,5.6vw,76px); font-weight: 750; letter-spacing: -.04em; }
.route-hero > p { font-size: 20px; line-height: 1.65; }
.route-hero .section-kicker { font-size: 16px; letter-spacing: .04em; }
.route-hero .back-link { font-size: 14px; }
.route-hero.has-character::before { display: none; }
.header-character { position:absolute;z-index:4;right:45px;top:65px;width:240px;height:240px;padding:0;border:0;background:transparent;cursor:pointer;overflow:visible;-webkit-tap-highlight-color:transparent; }
.header-character:focus-visible { outline:2px solid #49351f;outline-offset:4px;border-radius:16px; }
.character-float,.character-content { display:block;position:relative;width:100%;height:100%; }
.character-float { animation:chest-float 3.2s ease-in-out infinite; }
.character-chest img { position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;image-rendering:pixelated; }
.character-chest .chest-body { z-index:2; }.character-chest .chest-body[hidden] { display:none; }
.character-controller { width:260px;height:221.46px;right:35px;top:78px;touch-action:none;user-select:none;cursor:grab; }
.character-controller:active { cursor:grabbing; }
.character-controller .character-float { animation:gamepad-float 3.4s ease-in-out infinite; }
.web-controller-sprite { background:url('./gamebox-home-art.webp') left top / 255.5294118% 100% no-repeat;filter:drop-shadow(0 12px 12px #492a1430); }
.character-book .character-float { animation:guide-float 3.3s ease-in-out infinite; }
.web-book-rig { position:absolute;inset:0;transform:rotate(-4deg);perspective:900px;perspective-origin:26% 50%;transform-style:preserve-3d; }
.web-book-right { position:absolute;left:26%;top:-9%;width:59%;height:118%;overflow:hidden;transform:translateZ(0); }
.web-book-hinge { position:absolute;left:26%;top:-9%;width:59%;height:118%;transform-origin:0% 50%;transform-style:preserve-3d;transition:transform 32ms linear;will-change:transform; }
.web-book-front,.web-book-back { position:absolute;inset:0;width:100%;height:100%;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden; }
.web-book-front { top:7.627119%;height:84.745763%;overflow:visible;transform:translateZ(.2px); }
.web-book-back { transform:rotateY(180deg) translateZ(.2px); }
.web-book-front-texture { position:absolute;left:-44.067797%;top:0;width:169.491525%;height:100%;max-width:none;object-fit:fill;pointer-events:none; }
.web-book-left-texture,.web-book-right-texture { position:absolute;top:0;width:200%;height:100%;max-width:none;object-fit:fill;pointer-events:none; }
.web-book-left-texture { left:0; }.web-book-right-texture { left:-100%; }
@media(min-width:981px) {
 .character-chest { width:330px;height:280px;right:205px;top:2px; }
 .character-book { width:260px;height:260px;right:265px;top:18px; }
 .character-controller { width:300px;height:255.53px;right:210px;top:16px; }
 .route-hero { min-height:300px; padding-left:44px; padding-top:28px; padding-bottom:28px; }
 .route-hero .back-link { margin-bottom:22px; }
 .route-hero h1 { margin:10px 0 14px; }
}
@media(min-width:721px) and (max-width:980px) {
 .header-character { width:170px;height:170px;right:74px; }
 .character-controller { width:180px;height:153.32px;right:70px; }
 .character-book { right:94px; }
}
@media(max-width:720px) {
 .route-hero h1 { font-size:40px; }
 .route-hero > p { font-size:16px; }
 .character-chest { width:140px;height:140px;top:auto;bottom:4px;right:56px; }
 .character-book { width:130px;height:130px;top:auto;bottom:4px;right:72px; }
 .character-controller { width:160px;height:136.28px;top:auto;bottom:8px;right:52px; }
}
@media(prefers-reduced-motion:reduce) { .character-float { animation:none!important; }.web-book-hinge { transition:none; } }
