/* MyWeatha v46: content-aware dashboard, compact grids without giant holes.
   Fix root v45 fixed 160px tracks/row spans, which made short cards enormous. */
#home .content{
 display:grid!important;
 grid-template-columns:repeat(2,minmax(0,1fr))!important;
 grid-auto-rows:max-content!important;
 grid-auto-flow:row dense!important;
 column-gap:11px!important;
 row-gap:11px!important;
 align-items:start!important;
 align-content:start!important;
 overflow:visible!important;
}
/* Each full dashboard section occupies ONE natural-height row. Two half-width
   sections can share a row; intrinsic content determines the row's size. */
#home .content>[data-wa-block]:not(.studio-teaser):not(.wa-hidden){
 grid-column:span var(--wa-cols,2)!important;
 grid-row:auto!important;
 height:auto!important;
 min-height:0!important;
 max-height:none!important;
 width:100%!important;
 max-width:100%!important;
 align-self:start!important;
 flex:none!important;
 margin-bottom:0!important;
 overflow:visible!important;
}
/* Hero keeps status-bar clearance above the tile rather than inside it. */
#home .content>.mast[data-wa-block]{
 grid-column:span 2!important;
 grid-row:auto!important;
 margin-top:max(56px,env(safe-area-inset-top,0px))!important;
 min-height:385px!important;
 height:auto!important;
 padding-top:28px!important;
 overflow:hidden!important;
}
#home .content>.hours-card,
#home .content>.week-card,
#home .content>.extended-card,
#home .content>.wa-next-rain-card,
#home .content>.radar-card,
#home .content>.wa-alerts-card{
 height:auto!important;
 min-height:0!important;
 max-height:none!important;
 overflow:visible!important;
}
/* Use a contained subgrid for metrics. Its height is derived from the metrics,
   never from a fixed-height row in the outer page. */
#home .content>#cards,
#home .content>#waLateCards{
 grid-column:span 2!important;
 grid-row:auto!important;
 display:grid!important;
 grid-template-columns:repeat(2,minmax(0,1fr))!important;
 grid-auto-flow:row dense!important;
 grid-auto-rows:148px!important;
 gap:10px!important;
 width:100%!important;
 min-width:0!important;
 height:auto!important;
 min-height:0!important;
 max-height:none!important;
 align-self:start!important;
 flex:none!important;
 margin:0!important;
 padding:0!important;
 overflow:visible!important;
}
#home #cards>[data-card],
#home #waLateCards>[data-card]{
 grid-column:span var(--wa-cols,1)!important;
 grid-row:span var(--wa-rows,1)!important;
 align-self:stretch!important;
 min-height:0!important;
 max-height:none!important;
 height:100%!important;
 width:100%!important;
 max-width:100%!important;
 margin:0!important;
 box-sizing:border-box!important;
 overflow:hidden!important;
}
#home .content>.studio-teaser{
 grid-column:span 2!important;
 grid-row:auto!important;
 width:100%!important;
 height:auto!important;
 min-height:78px!important;
 margin:0!important;
}
/* Prevent a legacy tall setting from stretching a single moon widget across
   the entire phone. Tall sizes are explicitly selected, never implicit. */
#home #cards>[data-card="moon"],
#home #waLateCards>[data-card="moon"]{
 max-height:calc(var(--wa-rows,1) * 148px + (var(--wa-rows,1) - 1) * 10px)!important;
}
#home .content>.wa-grid-sizebar{
 grid-column:span 2!important;
 grid-row:auto!important;
 width:100%!important;
}
#home .content>.wa-grid-backdrop{opacity:.55!important}
#home .content>.wa-grid-placement{
 max-width:100%!important;
 max-height:460px!important;
}
@media(max-width:355px){
 #home .content{column-gap:8px!important;row-gap:9px!important}
 #home .content>#cards,#home .content>#waLateCards{gap:8px!important;grid-auto-rows:142px!important}
 #home .content>.mast[data-wa-block]{min-height:408px!important}
}
@media(prefers-reduced-motion:reduce){
 #home .content>[data-wa-block]{transition:none!important}
}

/* Moon phase: a deliberately compact weather widget, never a giant poster. */
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="wide"]{
 display:grid!important;
 grid-template-columns:minmax(0,1fr) 78px!important;
 grid-template-rows:auto minmax(0,1fr) auto!important;
 column-gap:10px!important;
 row-gap:2px!important;
 align-items:center!important;
 align-content:center!important;
 padding:12px 15px!important;
 overflow:hidden!important;
}
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="wide"]>.tile-head{
 grid-column:1/-1!important;grid-row:1!important;
 margin:0!important;min-width:0!important;
 font-size:12px!important;
}
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="wide"]>.wa-moon-tile-svg{
 grid-column:2!important;grid-row:2/4!important;
 width:72px!important;height:72px!important;
 align-self:center!important;justify-self:center!important;
 margin:0!important;
}
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="wide"]>.tile-value{
 grid-column:1!important;grid-row:2!important;
 font-size:clamp(19px,5.2vw,25px)!important;
 font-weight:750!important;
 align-self:end!important;
 letter-spacing:-.6px!important;
 line-height:1.12!important;
 margin:0!important;min-width:0!important;
}
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="wide"]>.tile-desc{
 grid-column:1!important;grid-row:3!important;
 font-size:11px!important;align-self:start!important;
 margin:0!important;min-width:0!important;
}
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="small"]{
 padding:9px 10px!important;
}
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="small"]>.wa-moon-tile-svg{
 width:43px!important;height:43px!important;margin:2px 0!important;
}
#home :is(#cards,#waLateCards)>[data-card="moon"][data-wa-grid-size="small"]>.tile-value{
 font-size:20px!important;line-height:1.05!important;
}

/* Legacy v24 used a more specific flex selector on newly added widgets.
   Override it explicitly; otherwise every extra widget occupies a full row. */
#home .content>#waLateCards.tile-grid{
 display:grid!important;
 grid-template-columns:repeat(2,minmax(0,1fr))!important;
 grid-auto-rows:148px!important;
 grid-auto-flow:row dense!important;
 height:auto!important;
}
@media(max-width:355px){#home .content>#waLateCards.tile-grid{grid-auto-rows:142px!important}}

/* Show reliable column guides and the actual dashed card boundaries in edit mode;
   horizontal 160px guide-lines no longer match natural section heights. */
body.wa-edit-mode #home .content .wa-grid-backdrop{
 background-image:linear-gradient(90deg,rgba(135,221,255,.15) 1px,transparent 1px)!important;
 background-size:calc((100% - 11px)/2 + 11px) 100%!important;
 opacity:.55!important;
}