/* The final phone refinements are isolated from the approved desktop layout. */
@layer atlas-mobile-polish {
 @media(max-width:650px){
  body[data-access=public] #main .oc-hero{display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:12px!important;min-height:0!important;height:auto!important;padding:18px 16px 12px!important}
  body[data-access=public] #main .oc-hero::before{opacity:.42!important;filter:grayscale(1) contrast(1.1)!important}
  body[data-access=public] #main .oc-hero::after{background:linear-gradient(110deg,#001724ed 10%,#001724c9 65%,#00172485)!important}
  body[data-access=public] #main .oc-hero-copy{margin:0!important;width:100%!important;text-shadow:0 1px 2px #00121d}
  body[data-access=public] #main .oc-hero-copy>h3{display:none!important}
  body[data-access=public] #main .oc-hero-copy>small{display:block;margin-bottom:6px!important;color:#a2e5eb!important}
  body[data-access=public] #main .oc-hero-copy>p{margin-top:9px!important;color:#edf8fc!important}
  body[data-access=public] #main .oc-hero-copy>div{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;margin:14px 0 11px!important}
  body[data-access=public] #main .oc-hero-copy>div>a{display:flex!important;align-items:center;justify-content:center;text-align:center;white-space:normal!important;min-height:40px;padding:8px!important;text-shadow:none}
  body[data-access=public] #main .oc-replay{display:block;color:#c3dce7!important;line-height:1.4!important}
  body[data-access=public] #main .oc-hero>.oc-photo-credit{position:relative!important;inset:auto!important;order:2;align-self:flex-start;max-width:100%;margin:0!important;padding:3px 5px!important;background:#001724b8!important;color:#b5d4df!important;white-space:normal!important}
  /* Native preview actions use the same colours and interaction states as the
     rest of Atlas, including dynamically refreshed and newly opened cards. */
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) button{appearance:none!important;-webkit-appearance:none!important;background:#0b3b4e!important;color:#e5f8fb!important;border:1px solid #397b8f!important;border-radius:4px!important;box-shadow:none!important;min-height:32px!important;padding:6px 9px!important;font-weight:600;cursor:pointer}
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) button:hover{background:#105265!important;border-color:#50b8bf!important}
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) button:active{background:#126171!important}
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) button:focus-visible{outline:2px solid #37e3d0!important;outline-offset:2px!important}
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) button:disabled{opacity:.5;cursor:default}
  body[data-access=public] #main :is([data-amm-part=preview],.ib-hover) :is(button[aria-label^="Close"],.amm-close){width:28px!important;min-width:28px!important;height:28px!important;min-height:28px!important;padding:0!important;flex:none}
 }
}