/* WoWo shared UI - mobile-safe download modal */
.download-modal{position:fixed;inset:0;z-index:2147483646;display:flex;align-items:center;justify-content:center;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));background:rgba(4,7,12,.88);opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s ease,visibility .18s ease;overscroll-behavior:contain;-webkit-tap-highlight-color:transparent}.download-modal.open{opacity:1;visibility:visible;pointer-events:auto}.download-dialog{position:relative;width:min(560px,100%);max-height:calc(100dvh - 32px);overflow:auto;-webkit-overflow-scrolling:touch;padding:42px;border:1px solid rgba(255,255,255,.1);border-radius:24px;background:#11151d;box-shadow:0 24px 80px rgba(0,0,0,.55);transform:translateY(10px) scale(.985);transition:transform .18s ease;touch-action:pan-y}.download-modal.open .download-dialog{transform:none}.download-close{position:absolute;top:10px;right:10px;z-index:5;width:48px;height:48px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.07);color:#ddd;font-size:30px;font-family:Arial,sans-serif;font-weight:300;line-height:1;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.download-close:active{background:rgba(255,255,255,.14);transform:scale(.96)}.download-kicker{margin-bottom:12px;color:#ff6b35;font-size:11px;font-weight:700;letter-spacing:2px}.download-dialog h2{margin:0 56px 12px 0;color:#fff;font-size:30px}.download-dialog>p{margin:0 0 26px;color:#888;font-size:14px;line-height:1.7}.download-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.download-option{display:flex;align-items:center;gap:12px;min-height:64px;padding:16px;border:1px solid rgba(255,255,255,.08);border-radius:14px;color:#ddd;text-decoration:none;background:rgba(255,255,255,.025);transition:background .15s ease,border-color .15s ease;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.download-option:hover,.download-option.primary{border-color:rgba(255,107,53,.38);background:rgba(255,107,53,.08)}.download-option:active{background:rgba(255,107,53,.16)}.download-option-icon{display:flex;width:30px;height:30px;align-items:center;justify-content:center;flex:0 0 30px}.download-option-icon img,.download-option-icon svg{width:24px;height:24px;display:block}.download-option:nth-child(1) .download-option-icon{color:#ff6b35}.download-option:nth-child(2) .download-option-icon{color:#20c4f4}.download-option:nth-child(3) .download-option-icon{color:#3ddc84}.download-option:nth-child(4) .download-option-icon{color:#4285f4}.download-option strong,.download-option small{display:block}.download-option strong{font-size:14px}.download-option small{margin-top:4px;color:#777;font-size:11px}html.download-modal-open,body.download-modal-open{overflow:hidden!important;touch-action:none}@media(max-width:580px){.download-modal{align-items:flex-end;padding:12px}.download-dialog{width:100%;max-height:min(82dvh,720px);padding:34px 18px 22px;border-radius:22px 22px 16px 16px}.download-dialog h2{font-size:24px}.download-grid{grid-template-columns:1fr;gap:10px}.download-option{min-height:66px;padding:14px 16px}.download-close{top:8px;right:8px;width:50px;height:50px;font-size:31px}}

/* 2026-09-10 mobile interaction polish */
@media (hover:none), (pointer:coarse) {
  a,button,[role="button"],.btn,.nav-cta,.download-option,.download-close{
    -webkit-tap-highlight-color:transparent!important;
    -webkit-touch-callout:none;
  }
  .btn:hover,.nav-cta:hover,.download-option:hover{
    transform:none!important;
  }
  .btn-primary:hover{
    transform:none!important;
  }
  .download-option:active{
    background:rgba(255,107,53,.10);
  }
}

@media (max-width:580px){
  .download-modal{
    align-items:center;
    justify-content:center;
    padding:max(14px,env(safe-area-inset-top)) 12px max(14px,env(safe-area-inset-bottom));
  }
  .download-dialog{
    width:100%;
    max-height:calc(100dvh - 70px);
    padding:34px 18px 22px;
    border-radius:22px;
    transform:translateY(calc(-5dvh + 10px)) scale(.985);
    box-shadow:0 14px 45px rgba(0,0,0,.38);
  }
  .download-modal.open .download-dialog{
    transform:translateY(-5dvh);
  }
  .download-close{
    top:8px;
    right:8px;
    width:50px;
    height:50px;
    font-size:31px;
  }
}


/* 2026-09-10 m4: instant mobile modal interaction */
@media (max-width:580px), (hover:none), (pointer:coarse){
  .download-modal{
    opacity:1!important;
    visibility:visible!important;
    transition:none!important;
    animation:none!important;
  }
  .download-dialog,
  .download-modal.open .download-dialog{
    transform:translateY(-5dvh)!important;
    transition:none!important;
    animation:none!important;
    will-change:auto!important;
  }
  .download-close,
  .download-option,
  .download-close:active,
  .download-option:active{
    transition:none!important;
    animation:none!important;
    transform:none!important;
  }
  body.download-modal-open{
    overflow:hidden!important;
    touch-action:auto!important;
  }
}

/* 2026-09-10 m9: mobile nav + modal trigger residue cleanup */
@media (hover:none), (pointer:coarse), (max-width:768px){
  /* All navigation controls */
  .nav a,
  .nav a:hover,
  .nav a:active,
  .nav a:focus,
  .nav a:focus-visible,
  .nav-links a,
  .nav-links a:hover,
  .nav-links a:active,
  .nav-links a:focus,
  .nav-links a:focus-visible,
  .nav-cta,
  .nav-cta:hover,
  .nav-cta:active,
  .nav-cta:focus,
  .nav-toggle,
  .nav-toggle:hover,
  .nav-toggle:active,
  .nav-toggle:focus{
    -webkit-tap-highlight-color:transparent!important;
    -webkit-touch-callout:none!important;
    outline:none!important;
    box-shadow:none!important;
    filter:none!important;
    text-shadow:none!important;
    transform:none!important;
    transition:none!important;
  }

  /* Prevent sticky hover underline/color on mobile Chromium/WebView */
  .nav-links a:hover{
    color:inherit!important;
  }
  .nav-links a:hover::after{
    width:0!important;
  }

  /* Keep active/current page appearance only when explicitly marked active */
  .nav-links a.active{
    color:#fff!important;
  }
  .nav-links a.active::after{
    width:100%!important;
  }

  /* All unified modal triggers */
  a[href*="components/download-modal.html"],
  a[href*="components/download-modal.html"]:hover,
  a[href*="components/download-modal.html"]:active,
  a[href*="components/download-modal.html"]:focus,
  a[href*="components/download-modal.html"]:focus-visible{
    -webkit-tap-highlight-color:transparent!important;
    -webkit-touch-callout:none!important;
    outline:none!important;
    box-shadow:none!important;
    filter:none!important;
    text-shadow:none!important;
    transform:none!important;
    transition:none!important;
  }
}