/* HYBRI8 Recovery V3 — native/mobile visual hardening */
.recovery-v3-screen{-webkit-tap-highlight-color:transparent}
.recovery-v3-screen .back{touch-action:manipulation;transition:background .18s ease,border-color .18s ease,transform .18s ease}
.recovery-v3-screen .back:active{transform:scale(.975);background:rgba(213,161,115,.08)}
.recovery-v3-screen .back:focus-visible{outline:3px solid rgba(240,196,157,.72);outline-offset:3px}
.recovery-v3-screen .card:focus-within{border-color:rgba(240,196,157,.32);box-shadow:0 24px 62px rgba(0,0,0,.32)}

@media(max-width:640px){
  .recovery-v3-screen .shell{padding-left:12px;padding-right:12px;padding-bottom:max(94px,calc(env(safe-area-inset-bottom) + 86px))}
  .recovery-v3-screen .top{height:58px;margin-bottom:14px}
  .recovery-v3-screen .back{min-height:44px;padding-inline:10px;font-size:10px}
  .recovery-v3-screen .hero{min-height:300px;padding:24px 20px;border-radius:26px}
  .recovery-v3-screen .hero:before{top:20px;right:20px;font-size:10px}
  .recovery-v3-screen .hero h1{font-size:clamp(40px,13vw,56px);line-height:.93}
  .recovery-v3-screen .hero p{font-size:13px;line-height:1.6}
  .recovery-v3-screen .grid.two{grid-template-columns:1fr;gap:11px;margin-top:12px}
  .recovery-v3-screen .card{min-height:0;padding:20px;border-radius:22px}
  .recovery-v3-screen #bodymap,.recovery-v3-screen #flow,.recovery-v3-screen #prerace,.recovery-v3-screen #sleep{min-height:0;padding:16px;font-size:12px;line-height:1.65}
}

@media(max-width:380px){
  .recovery-v3-screen .hero{padding:22px 17px}
  .recovery-v3-screen .hero h1{font-size:39px}
  .recovery-v3-screen .card{padding:18px}
  .recovery-v3-screen .card:after{right:16px;top:16px;font-size:28px}
}

@media(prefers-reduced-motion:reduce){
  .recovery-v3-screen .card,.recovery-v3-screen .back{transition:none!important}
  .recovery-v3-screen .card:hover,.recovery-v3-screen .back:active{transform:none!important}
}

@media(prefers-contrast:more){
  .recovery-v3-screen .hero,.recovery-v3-screen .card,.recovery-v3-screen #bodymap,.recovery-v3-screen #flow,.recovery-v3-screen #prerace,.recovery-v3-screen #sleep{border-width:2px;border-color:rgba(255,255,255,.42)}
  .recovery-v3-screen .hero p{color:#f0f3f1}
  .recovery-v3-screen .card:after{color:rgba(240,196,157,.36)}
}
