/* v1.3.7: complete mobile service grid, unclipped clock and full-aspect banner. */
.utility-left{min-width:0;max-width:none;flex:1 1 auto;overflow:visible}
.utility-left>span{max-width:100%;overflow:visible;text-overflow:clip}
#serviceGrid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));overflow:visible;min-width:0;max-height:none}
#serviceGrid .service-card{min-width:0;width:100%;height:100%;max-height:none}
#serviceGrid .service-card>span:last-child{white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.35;min-height:2.7em;display:grid;place-items:center}
.image-banner-actions{justify-content:flex-end;flex-wrap:wrap;padding:10px 0 0}
#bannerDestination{white-space:normal;overflow-wrap:anywhere;line-height:1.5;font-size:calc(12px * var(--font-scale,1));min-height:44px;display:flex;align-items:center;text-align:right}
#bannerAdvertiser{margin-left:auto;font-size:12px}
.image-banner-visual img{object-fit:contain}
@media(max-width:1100px){#serviceGrid{grid-template-columns:repeat(6,minmax(0,1fr))}}
@media(max-width:760px){
 .utility-bar{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;padding-block:10px;align-items:start}
 .utility-left{display:grid;grid-template-columns:minmax(0,1fr);gap:2px;width:100%;max-width:100%;font-size:calc(12px * var(--font-scale,1));line-height:1.5}
 .utility-left .utility-divider{display:none}
 .utility-left #liveWeek,.utility-left #liveDate,.utility-left #liveClock{display:block;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:normal}
 #liveWeek{font-weight:700;color:var(--text)}
 #liveDate,#liveClock{font-variant-numeric:tabular-nums}
 .utility-nav{width:100%;justify-content:space-between;flex-wrap:wrap;gap:8px;font-size:calc(12px * var(--font-scale,1))}
 .utility-nav-links{flex-wrap:wrap;gap:12px}
 .utility-nav a,.utility-nav button{min-height:32px;display:inline-flex;align-items:center}
}
@media(max-width:600px){
 #serviceGrid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding-bottom:0;overflow:visible}
 #serviceGrid .service-card{padding:13px 6px 11px;border-radius:13px;gap:8px;min-height:110px}
 #serviceGrid .service-icon{width:42px;height:42px;flex-shrink:0}
 #serviceGrid .service-card>span:last-child{font-size:calc(12px * var(--font-scale,1))}
 .image-banner-visual,.image-banner.expanded .image-banner-visual{height:auto;min-height:0;max-height:none;overflow:visible;cursor:default;transition:none}
 .image-banner-visual .banner-compact-image{display:none}
 .image-banner-visual .banner-expanded-image{display:block;position:static;inset:auto;width:100%;height:auto;max-height:none;opacity:1;object-fit:contain;border-radius:11px}
 #bannerToggle{display:none}
 .image-banner-caption>span{font-size:10px;letter-spacing:1.2px}
 #bannerDestination{width:100%;justify-content:flex-start;text-align:left;font-size:calc(12px * var(--font-scale,1));padding:5px 2px}
}
@media(max-width:280px){#serviceGrid{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media(max-width:760px){
 #utilityNav #displaySettings{position:relative;right:auto;bottom:auto;flex:0 0 auto;z-index:120}
 #utilityNav #displaySettingsButton{width:36px;height:36px;min-height:36px;border-radius:10px;font-size:21px;box-shadow:none}
 #utilityNav .display-settings-popover{position:fixed;top:140px;left:10px;right:10px;bottom:auto;width:auto;max-height:calc(100vh - 160px);max-height:calc(100dvh - 160px);overflow-y:auto}
}
