/* Responsive overrides: keep touch layouts in normal document flow. */
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 86px; }
*, *::before, *::after { box-sizing: border-box; }
button, a, [role="button"] { touch-action: manipulation; }
.concept-lightbox, .news-reader, .enc-member-detail { overscroll-behavior: contain; }
.intro-lightweight #intro-canvas { display: none; }
#intro-enter { min-width: 120px; min-height: 48px; }
@media (max-width: 1180px) {
  .nav-links { max-height: calc(100dvh - 76px); overflow-y: auto; overscroll-behavior: contain; }
  .nav-link { min-height: 48px; text-shadow: 0 1px 6px #000, 0 2px 20px #000; }
}
@media (max-width: 1024px) {
  #hero-viewport { height: 100svh; min-height: 640px; }
  .hero-fg-bottom-left { left: 24px; bottom: 250px; }
  .hero-year { font-size: clamp(58px,10vw,96px); }
  .hero-subtitle { font-size: 16px; letter-spacing: 2px; }
  .hero-fg-bottom-right { left: 24px; right: 24px; bottom: 46px; width: auto; max-width: 520px; }
  .hero-paragraph { font-size: 11px; letter-spacing: .045em; }
  .hero-title-small { font-size: clamp(28px,5vw,42px); }
  .hero-paragraph-box { margin-bottom: 12px; }
  .ui-right-edge { display: none; }
  .ui-bottom-left-lines { left: 24px; bottom: 22px; }
  #media-viewport { height: 100svh; min-height: 560px; }
  .media-stage { top: 50%; width: calc(100% - 40px); height: 65%; }
  .media-stage.is-expanded { height: 100svh !important; }
  .media-stage::after { content: attr(data-action); position: absolute; top: 12px; right: 12px; z-index: 55; padding: 12px 16px; color: white; background: #111c; border: 1px solid #ffffff60; font: 12px/1.5 'Manrope',sans-serif; pointer-events: none; }
  .media-copy { left: 20px; bottom: 24px; width: calc(100% - 40px); }
  .media-title { font-size: clamp(32px,8vw,62px); }
  .media-desc { max-width: 100%; font-size: 10px; letter-spacing: .04em; }
  .media-progress-wrap { right: 6px; gap: 4px; min-height: 100px; }
  .media-counter { display: none; }
  .media-audio-toggle { min-height: 44px; font-size: 10px; }
  .media-noise, .katana-cinema-grain, .enc-aura { display: none; }
  .katana-sticky-container { height: 100svh; }
  .katana-beat-title { font-size: clamp(36px,10vw,76px); }
  .katana-beat-sub { font-size: 11px; letter-spacing: .05em; max-width: 100%; }
  html.ink-journey #legends-section { height: 100svh; min-height: 480px; margin-top: 0; }
  html.ink-journey #archive-handoff-host { margin-top: 0; }
  .enc-ink-wash { display: none !important; }
  .enc-team-open .enc-character { visibility: hidden; }
  .enc-team-panel { z-index: 4; overflow-y: auto; pointer-events: auto; overscroll-behavior: contain; }
  .enc-team-montage { position: relative; height: auto; min-height: 100%; padding: 82px 16px 24px; }
  .enc-team-grid { position: relative; inset: auto; gap: 12px; }
  .enc-team-hero .enc-hero-grid, .enc-team-villain .enc-villain-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .enc-member-panel, .enc-team-villain .enc-member-panel { position: relative; left: auto; top: auto; width: 100%; height: auto; aspect-ratio: 3/4; clip-path: none; border: 1px solid #ffffff20; }
  .enc-member-panel .enc-member-name { top: auto; bottom: 16px; transform: translateX(-50%); width: 90%; font-size: clamp(17px,3vw,25px); }
  .enc-close-team, .enc-team-villain .enc-close-team { top: 16px; left: auto; right: 16px; min-height: 44px; opacity: 1; }
  #concept-gallery { padding: 80px 16px 64px; }
  #concept-gallery .concept-title { font-size: clamp(44px,11vw,80px); }
  .concept-batch { padding: 12px; }
  .concept-batch-info { min-height: 150px; padding: 16px 4px 22px; }
  .concept-batch-artworks .concept-card { flex-basis: 88%; min-width: 0; height: auto; min-height: 0; aspect-ratio: 4/3; }
  .concept-card-imgwrap img { object-fit: cover; }
  .concept-coming-soon .concept-card-imgwrap img { object-fit: contain; }
  .concept-card-meta { left: 12px; right: 12px; bottom: 12px; }
  #concept-gallery .concept-card-title { font-size: clamp(20px,4vw,30px); }
  .concept-lightbox { height: 100dvh; grid-template-columns: 1fr; grid-template-rows: auto auto; overflow-y: auto; align-content: start; }
  .concept-lightbox-visual { min-height: 0; grid-template-rows: minmax(220px,48svh) auto; overflow: visible; }
  .concept-lightbox-stage { min-height: 0; padding: 58px 44px 16px; }
  .concept-lightbox-info { padding: 24px 20px 36px; overflow: visible; border-left: 0; }
  .concept-lightbox-close { position: fixed; top: max(12px,env(safe-area-inset-top)); right: 12px; width: 46px; height: 46px; }
  .concept-lightbox-arrow { width: 44px; height: 48px; }
  .concept-lightbox-prev { left: 0; } .concept-lightbox-next { right: 0; }
  .news-reader { height: 100dvh; }
  .news-head-copy, .news-feature-copy, .news-card-copy { overflow-wrap: anywhere; }
}
@media (max-width: 600px) {
  .global-nav { gap: 8px; padding: 0 12px; }
  .nav-logo { font-size: clamp(17px,4.7vw,23px); }
  .nav-right { gap: 6px; }
  .nav-btn-right { padding: 12px 8px; min-height: 44px; }
  .nav-menu-toggle { flex-shrink: 0; }
  .enc-detail-content { padding: 12px 20px 30px; }
  .enc-detail-close { position: sticky; justify-self: end; grid-column: 1; grid-row: 1; margin: 12px; top: 12px; }
  .enc-detail-portrait { grid-column: 1; grid-row: 1; }
  .news-feature { grid-template-rows: 220px auto; }
  .news-card { grid-template-rows: 200px auto; }
  .news-feature-copy { padding: 24px 18px; }
  .news-reader-visual { min-height: 220px; height: 36svh; }
  .news-reader-info { padding-top: 30px; }
}
@media (max-height: 500px) and (max-width: 1024px) {
  #hero-viewport { min-height: 560px; }
  #media-viewport { min-height: 0; }
  .media-topbar { top: 12px; }
  .media-title { font-size: 28px; }
  .media-desc { display: none; }
  .media-audio-toggle { bottom: 8px; }
  .katana-beat, .katana-beat.center, .katana-beat.right { bottom: 80px; }
  .katana-beat-title { font-size: 34px; }
  .katana-beat-sub { margin-top: 12px; }
  .katana-beat-kicker { margin-bottom: 10px; }
  .katana-trailer-meta { bottom: 42px; } .katana-progress { bottom: 28px; }
  html.ink-journey #legends-section { min-height: 100svh; }
  .enc-member-detail:not([hidden]) { grid-template-columns: 40% 1fr; }
  .enc-member-detail { height: 92svh; }
  .enc-detail-portrait { height: 100%; grid-row: auto; }
  .enc-detail-content { padding: 24px; }
  .enc-detail-name { font-size: 32px; }
  .enc-detail-close { position: absolute; }
}
@media (pointer: coarse), (prefers-reduced-motion: reduce) {
  #cursor-follower, #custom-cursor { display: none !important; }
  .media-noise, .katana-cinema-grain { animation: none; }
}
@media (max-width: 1024px) {
  .enc-team-open .enc-team-panel, .enc-team-open .enc-team-ui { position: fixed; inset: 0; height: 100dvh; }
  .enc-team-open .enc-team-panel { background: #0b0b0b; }
  body:has(.enc-team-open) .global-nav { visibility: hidden !important; pointer-events: none !important; }
}
@media (max-width: 1024px) { html.ink-journey #legends-section.enc-team-open { z-index: 101; } }
@media (max-width: 1024px) {
  .requirements-intro { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .requirements-title { font-size: clamp(32px,7vw,60px); overflow-wrap: anywhere; }
  .requirements-table th, .requirements-table td { overflow-wrap: anywhere; }
  .journey-footer-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .journey-footer-links a { min-height: 44px; display: flex; align-items: center; }
  .journey-ending-content { min-width: 0; }
  .journey-ending h2 { font-size: clamp(42px,10vw,82px); }
}
/* Portrait artwork and balanced mobile versus composition. */
.intro-lightweight { background: linear-gradient(0deg,#0008,transparent 35%), url('./hampi_img/mobile-loader-tachi.png') center / cover no-repeat, #080b09 !important; }
@media (max-width: 1024px) {
  #intro-loader.intro-lightweight #intro-enter { bottom: max(10svh,48px); padding: 14px 30px; border: 1px solid #c6ad8570; background: #080b0960; letter-spacing: .3em; }
  .intro-lightweight .intro-ready-line { bottom: max(5svh,22px); padding: 0 20px; font-size: 8px; letter-spacing: .13em; }
  #legends-section .enc-character { top: 6%; height: 76%; width: 70%; mask-image: linear-gradient(#000 0 70%,transparent 100%); }
  #legends-section .enc-character.enc-left { left: -20%; }
  #legends-section .enc-character.enc-right { right: -20%; }
  #legends-section .enc-left .enc-portrait { object-fit: cover; object-position: 72% top; }
  #legends-section .enc-right .enc-portrait { object-fit: cover; object-position: 28% top; }
  #legends-section .enc-title { bottom: 12%; left: 4%; right: 4%; grid-template-columns: minmax(0,1fr) 6% minmax(0,1fr); }
  #legends-section .enc-name { font-size: clamp(12px,3.25vw,23px); line-height: 1.5; letter-spacing: .015em; padding: 12px 0; }
  #legends-section .enc-name::after { content: 'VIEW CHARACTERS'; display: block; margin-top: 7px; font: 500 8px/1.5 'Manrope',sans-serif; letter-spacing: .13em; }
  #legends-section .enc-hint { bottom: 5%; margin: 0; font-size: 0; }
  #legends-section .enc-hint-mobile { display: inline; font: 500 9px/1.5 'Manrope',sans-serif; letter-spacing: .16em; }
}
@media (max-height: 500px) and (max-width: 1024px) {
  #legends-section .enc-character { top: 0; height: 100%; width: 43%; }
  #legends-section .enc-character.enc-left { left: -3%; }
  #legends-section .enc-character.enc-right { right: -3%; }
  #legends-section .enc-title { bottom: 7%; }
  #legends-section .enc-hint { bottom: 2%; }
}

.enc-hint-mobile { display: none; }
@media (max-width: 1024px) { .enc-hint-desktop { display: none; } }
@media (max-width: 1024px) {
  #hero-viewport .hero-texture {
    background: linear-gradient(to top, #03030366, transparent 48%), url('./hampi_img/mobile-hero-tree.png') center top / cover no-repeat;
    opacity: 1;
    background-blend-mode: normal;
  }
  #hero-sequence-canvas { display: none; }
}