/* Selected mobile home design. Deliberately scoped to phone-sized overview only. */
@media (max-width:720px){
 
 
 body.field-mode .bottom-nav .create-fab{
  
  border-width:2px!important;font-size:30px!important;line-height:1!important;
  box-shadow:0 3px 10px rgba(0,0,0,.38)!important;
 }
}

@media (max-width:720px){
 html:has(body.field-refined .field-home){}
 
 
 
 
 body.field-refined:has(.field-home) .field-hero{
  min-height:735px;border-radius:0 0 22px 22px;background:#07131f;box-shadow:none;
 }
 body.field-refined:has(.field-home) .field-hero-image{
  background-image:linear-gradient(180deg,rgba(2,12,25,.05) 0%,rgba(2,12,25,.04) 34%,rgba(2,12,22,.34) 44%,rgba(2,11,20,.72) 54%,rgba(2,12,21,.9) 66%,#06111d 100%),url("./drift-home-selected-v1.png")!important;
  background-position:center top!important;background-size:100% auto!important;background-repeat:no-repeat!important;background-color:#06111d!important;
 }
 body.field-refined:has(.field-home) .field-hero-inner{
  padding:382px 18px 9px;
 }
 body.field-refined:has(.field-home) .field-hero h1{
  max-width:62%;margin:0!important;color:#fff;font-size:34px;line-height:1.04;letter-spacing:-.045em;text-shadow:0 2px 12px rgba(0,0,0,.5);
 }
 body.field-refined:has(.field-home) .field-weather{
  top:389px;right:18px;display:flex;align-items:center;gap:6px;min-height:54px;padding:0;border:0;background:transparent!important;box-shadow:none!important;
 }
 body.field-refined:has(.field-home) .field-weather-icon{
  display:grid;place-items:center;flex:0 0 50px;width:50px;height:50px;color:#fff;font-size:47px;line-height:1;text-shadow:0 2px 9px rgba(0,0,0,.5);
 }
 body.field-refined:has(.field-home) .field-weather strong{
  color:#fff!important;font-size:40px!important;line-height:1;font-weight:750;letter-spacing:-.04em;text-shadow:0 2px 9px rgba(0,0,0,.5);
 }
 body.field-refined:has(.field-home) .field-search{
  height:52px;margin-top:17px;padding:0 15px;border:1px solid rgba(255,255,255,.92);border-radius:15px;background:rgba(255,255,255,.97);color:#102247;box-shadow:0 7px 20px rgba(0,0,0,.12);
 }
 body.field-refined:has(.field-home) .field-search>span{font-size:25px;color:#102247}
 body.field-refined:has(.field-home) .field-search input{
  height:50px;color:#102247!important;-webkit-text-fill-color:#102247;font-size:15px;
 }
 body.field-refined:has(.field-home) .field-search input::placeholder{color:#102247;opacity:1}
 body.field-refined:has(.field-home) .field-actions{
  grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin:0;padding:15px 15px 20px;background:transparent;
 }
 body.field-refined:has(.field-home) .field-actions button{
  min-height:86px;gap:4px;padding:7px;border:1px solid rgba(40,160,218,.72);border-radius:14px;background:rgba(7,35,51,.78)!important;color:#fff;box-shadow:none;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
 }
 body.field-refined:has(.field-home) .field-actions span{width:37px;height:37px}
 body.field-refined:has(.field-home) .field-actions svg{width:34px;height:34px;stroke-width:1.8}
 body.field-refined:has(.field-home) .field-actions strong{color:#fff;font-size:15px;line-height:1.1}
 body.field-refined:has(.field-home) .field-actions em{top:7px;right:8px;min-width:23px;height:23px;background:#ff3347;font-size:12px}
 body.field-refined:has(.field-home) .field-today{padding-top:18px}
 body.field-refined:has(.field-home) .field-today .field-section-heading h2{font-size:24px;letter-spacing:-.025em}
 body.field-refined:has(.field-home) .field-today .field-section-heading button{color:#087ff2;font-size:14px}
}

@media (max-width:360px){
 body.field-refined:has(.field-home) .field-hero-inner{padding-left:15px;padding-right:15px}
 body.field-refined:has(.field-home) .field-hero h1{font-size:31px}
 body.field-refined:has(.field-home) .field-weather{right:14px}
 body.field-refined:has(.field-home) .field-weather strong{font-size:37px!important}
 body.field-refined:has(.field-home) .field-actions{padding-left:13px;padding-right:13px}
}

/* Keep the document at viewport width while allowing vertical page scrolling. */
@media (max-width:720px){
 html{max-width:100%;}body{max-width:100%;}
 .app-shell{min-width:0;max-width:100%}main{min-width:0;max-width:100%}.content{min-width:0;max-width:100%}

 /* iOS paints the status-bar inset from the document background in standalone mode. */
 html:has(body.field-refined .drift-home){}
 

 /* The announcement's implicit grid column otherwise uses its long min-content width. */
 body.field-refined .field-announcements .news-copy{
  grid-template-columns:minmax(0,1fr);
  max-width:100%;
 }
 body.field-refined .field-announcements .news-copy>*{
  min-width:0;max-width:100%;overflow-wrap:anywhere;
 }

 /* Drift has its own mobile gutter; avoid adding the page gutter a second time. */
 body.field-refined .content:has(>.drift-home){padding-left:0;padding-right:0}
 body.field-refined .drift-home{width:100%;max-width:100%;padding:0 15px 95px}

 /* Drift trial: the hero replaces the mobile header and reaches the screen edges. */
 
 
 
 
 body.field-refined .drift-home-hero{
  margin-left:-15px;margin-right:-15px;
  padding:calc(env(safe-area-inset-top) + 25px) 20px 24px;
  border-radius:0 0 16px 16px;
 }
}
