/* Touch layouts verified from 320px portrait through phone landscape. */
@media (max-width: 1100px) {
  body[data-home="true"] { --kun-header-height:68px; --kun-usable-height:min(100svh,var(--kun-visual-height,100svh)); }
  body[data-home="true"] .kun-header .locale-button,
  .kun-menu-toggle { width:44px; height:44px; min-height:44px; }
  .kun-header-download, .kun-brand { min-height:44px; }
  body[data-home="true"] .kun-header .locale-menu {
    position:fixed; top:calc(var(--kun-header-height) + 8px); right:16px; left:auto; bottom:auto;
    width:min(300px,calc(100vw - 32px));
    max-height:calc(var(--kun-usable-height) - var(--kun-header-height) - 24px - env(safe-area-inset-bottom,0px));
    overflow-y:auto; overscroll-behavior:contain; transform-origin:top right;
  }
  .kun-nav { top:var(--kun-header-height); height:calc(var(--kun-usable-height) - var(--kun-header-height)); padding-bottom:calc(28px + env(safe-area-inset-bottom,0px)); overscroll-behavior:contain; }
  .kun-feature-sticky { top:var(--kun-header-height); height:calc(var(--kun-usable-height) - var(--kun-header-height)); padding-bottom:calc(20px + env(safe-area-inset-bottom,0px)); }
  .kun-story-close { width:44px; height:44px; }
}
@media (max-width:760px) {
  body[data-home="true"] { --kun-header-height:64px; }
  body[data-home="true"] .kun-header { height:var(--kun-header-height); padding-block:10px; }
  body[data-home="true"] :is(section,footer) { scroll-margin-top:calc(var(--kun-header-height) + 12px); }
  body[data-home="true"] .hero { min-height:0; padding-bottom:16px; }
  body[data-home="true"] .hero-copy { padding-top:clamp(200px,34svh,264px); padding-bottom:24px; }
  body[data-home="true"] .hero h1 { font-size:clamp(33px,9.5vw,42px); }
  body[data-home="true"] .hero-copy > p { margin:18px 0 12px; font-size:15px; line-height:1.5; }
  body[data-home="true"] .hero .app-download-block { margin-top:18px; }
  .romance-section { padding-block:44px; }
  .kun-intro .romance-heading h2, #characters .romance-heading h2 { font-size:clamp(32px,8.8vw,40px); }
  .kun-intro > .romance-heading p, #characters .romance-heading > p { margin-top:18px; font-size:15px; line-height:1.55; }
  .kun-feature-ribbon { padding-block:36px 44px; }
  .kun-feature-ribbon > h2 { margin-bottom:24px; }
  .kun-feature-story { height:calc(100svh + var(--feature-count,5) * 48svh); margin-block:12px 32px; }
  body[data-home="true"] .romance-continuation { padding-block:44px; gap:28px; }
  body[data-home="true"] .kun-voice { padding-block:44px; gap:28px; }
  body[data-home="true"] .faq-section { padding-top:44px; margin-bottom:44px; }
  .kun-footer-wordmark { margin-top:64px; }
  body[data-home="true"] .hero .app-download-block { width:100%; max-width:430px; }
  body[data-home="true"] .hero .store-buttons,
  body[data-home="true"] .kun-footer .store-buttons { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; max-width:430px; width:100%; }
  body[data-home="true"] .hero .store-button,
  body[data-home="true"] .kun-footer .store-button { width:100%; min-width:0; height:48px; min-height:48px; padding:10px; gap:8px; }
  body[data-home="true"] .hero .store-copy strong,
  body[data-home="true"] .kun-footer .store-copy strong { font-size:14px; }
  body[data-home="true"] .store-button--web { grid-column:1 / -1; }
  body[data-home="true"] .hero .store-button--web .store-copy,
  body[data-home="true"] .kun-footer .store-button--web .store-copy { flex-direction:row; align-items:center; gap:8px; }
  body[data-home="true"] .store-button--web .store-copy .kun-coming-soon { font-size:12px; }
  .hero .kun-video-controls button { width:44px; min-width:44px; }
  .kun-ribbon-pause { width:44px; height:44px; top:36px; right:10px; }
  .kun-feature-ribbon > h2 { padding-inline:58px; font-size:clamp(28px,8vw,36px); }
  .kun-hero-notes { top:clamp(112px,18svh,166px); right:16px; width:min(260px,calc(100vw - 32px)); height:60px; }
  .kun-hero-note { bottom:auto; min-height:60px; padding:8px 10px; gap:8px; border-radius:14px; }
  .kun-hero-note img { flex-basis:30px; width:30px; height:30px; }
  .kun-hero-note > div { min-width:0; }
  .kun-hero-note strong { font-size:12px; line-height:1.25; margin-bottom:2px; }
  .kun-hero-note p { font-size:11.5px; line-height:1.35; }
  .kun-story-open { min-height:44px; padding:12px 6px; }
  .kun-story-dialog { width:calc(100% - 24px); max-height:calc(var(--kun-usable-height) - 24px - env(safe-area-inset-bottom,0px)); overscroll-behavior:contain; }
  .kun-story-dialog .kun-story-close { position:sticky; float:right; top:12px; right:12px; margin:12px 12px -56px 0; z-index:2; }
  .kun-dialog-portrait { height:min(220px,32svh); min-height:0; }
  .kun-dialog-copy { padding:24px 22px; }
  .kun-footer-nav a { display:flex; align-items:center; min-height:44px; margin-bottom:2px; }
  .kun-footer-nav h3 { margin-bottom:10px; }
  .kun-footer .footer-bottom a { min-height:44px; display:inline-flex; align-items:center; }
  body[data-home="true"] .kun-footer { padding-bottom:calc(18px + env(safe-area-inset-bottom,0px)); }
  .kun-intro > .romance-heading { margin-bottom:0; }
  body[data-home="true"] .romance-text-link { min-height:44px; }
}
@media (max-width:900px) and (orientation:portrait) {
  .kun-feature-sticky { grid-template-rows:auto minmax(0,1fr) auto; align-content:stretch; padding:16px 20px calc(20px + env(safe-area-inset-bottom,0px)); gap:10px; }
  .kun-feature-device { height:100%; max-height:68svh; min-height:0; align-self:center; }
  .kun-feature-titles h3 { font-size:clamp(24px,6.4vw,32px); }
  .kun-feature-descriptions p { font-size:14px; line-height:1.45; }
}
@media (max-width:1100px) and (max-height:540px) and (orientation:landscape) {
  .kun-feature-sticky { grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); grid-template-rows:1fr; gap:24px; padding:12px 28px; }
  .kun-feature-device { height:calc(var(--kun-usable-height) - var(--kun-header-height) - 32px - env(safe-area-inset-bottom,0px)); border-radius:24px; }
  .kun-feature-screen { border-radius:20px; }
  .kun-feature-titles h3 { font-size:clamp(23px,3.2vw,32px); text-align:left; }
  .kun-feature-descriptions p { font-size:14px; line-height:1.45; text-align:left; }
  .kun-nav { padding-top:12px; }
  .kun-nav a { font-size:26px; padding:12px 0; }
}
@media(max-width:360px) {
  body[data-home="true"] .kun-header { padding-inline:12px; gap:8px; }
  .kun-header-actions { gap:6px; }
  .kun-header-download { padding-inline:10px; }
  .kun-brand img { width:58px; }
  body[data-home="true"] .hero h1 { font-size:33px; }
  .kun-footer h2 { font-size:36px; }
  .romance-continuation .romance-heading h2, .kun-voice .romance-heading h2 { font-size:36px; }
}
