/* Website-only layout. Shared Android styles and Radio source stay intact. */
html body{height:100dvh;overflow:hidden}
html body>header{height:80px;min-height:80px;box-sizing:border-box;display:flex;flex-wrap:nowrap;gap:12px;padding:8px 24px;background:#234f40;color:#fff}
html body>header .brand{width:auto;flex:1;min-width:0;margin:0;color:#fff;gap:12px}
html body>header .horus-logo{width:48px;height:48px;transform:none;margin:0;object-fit:contain}
html body>header .brand-title{display:block;font-size:18px;letter-spacing:0;color:#fff}
html body>header .brand-title b{display:block;font-size:16px;color:#fff}
html body>header .brand-title small{display:none}
html body>header #app-menu-button{display:flex!important;align-items:center;gap:8px;margin:0;min-height:52px;padding:10px 16px;color:#fff;background:#ffffff14;border:1px solid #ffffff66;border-radius:10px;font-size:18px}
html body main{height:calc(100dvh - 80px);display:grid;grid-template-columns:340px minmax(0,1fr);position:relative;overflow:hidden}
html body:not(.driving) .sidebar{display:flex!important;position:relative;inset:auto;flex-direction:column;width:auto;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;border-right:1px solid #688377;border-radius:0;box-shadow:none;background:#fff;overflow:auto;z-index:8}
html body .sidebar-top{padding:20px;display:block}
html body .sidebar #mobile-search-panel{display:grid!important;gap:12px}
html body .sidebar .mobile-tools{display:flex!important;margin-bottom:16px}
html body .sidebar #mobile-search-toggle{display:none!important}
html body .sidebar .list-heading{display:flex!important}
html body .sidebar #turbines:not([hidden]){display:flex!important;flex-direction:column;flex-wrap:nowrap;max-height:none;overflow:visible;padding:0 20px 20px;gap:8px}
html body .sidebar #map-search-results:not([hidden]){display:block!important;max-height:none;padding:0 20px 20px}
html body .sidebar .turbine-row{min-height:52px;width:100%;margin:0;font-size:18px}
html body .sidebar #mobile-farm{min-height:52px}
html body .sidebar #close-map-search{display:none}
html body .map-area{position:relative;min-width:0;height:100%}
html body #selected-card{max-height:calc(100% - 100px);overflow:auto}
html body #startup-screen{width:100%;max-width:none;height:100dvh;max-height:none;margin:0;padding:24px;border:0;border-radius:0;background:#e8ede6}
.web-startup{width:min(440px,100%);margin:auto;min-height:80dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:20px}
.web-startup>img{width:96px;height:96px;object-fit:contain}.web-startup h1{font-size:24px;margin:0}.web-startup [role=status]{font-size:18px;font-weight:500;line-height:1.4;letter-spacing:.02em}.web-startup progress{accent-color:#234f40;max-width:220px}.startup-account{width:100%}
html body input,html body select,html body textarea{font-size:18px}
html body #guide{max-width:600px}
@media(min-width:901px){html body #selected-card{left:24px;bottom:24px;width:400px}html body #app-menu{max-width:700px}html body #app-menu .menu-items{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:900px){
 html body>header{height:76px;min-height:76px;padding:8px max(12px,env(safe-area-inset-right)) 8px max(12px,env(safe-area-inset-left));gap:8px}
 html body>header .horus-logo{width:38px;height:38px}
 html body>header .brand-title{font-size:15px}html body>header .brand-title b{font-size:13px}
 html body>header #app-menu-button{padding:8px 10px;font-size:16px;min-height:48px}
 html body main{height:calc(100dvh - 76px);display:block}
 html body:not(.driving) .sidebar{display:none!important}
 html body.map-search-visible:not(.driving) .sidebar{display:flex!important;position:absolute;inset:12px 12px auto;max-height:calc(100% - 24px);height:auto;border:1px solid #688377;border-radius:12px;box-shadow:0 8px 28px #183d3926}
 html body .sidebar #close-map-search{display:flex;margin:0 0 12px auto;min-width:44px;min-height:44px;align-items:center;justify-content:center}
 html body #selected-card{left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));width:auto;max-width:none;max-height:65%}
 html body dialog:not(#startup-screen){max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px - env(safe-area-inset-bottom));box-sizing:border-box}
 html body #app-menu .menu-items{grid-template-columns:repeat(2,minmax(0,1fr))}
}
html body.driving main{display:block;height:calc(100dvh - 80px)}html body.driving .sidebar{display:none!important}
/* Keep website navigation below the persistent logo, weather and Menu header. */
html body.driving>header{display:flex!important}
@media(max-width:900px){html body.driving>header{display:grid!important}html body.driving main{height:calc(100dvh - 76px)}}
html body #app-menu .menu-items button{font-size:18px!important;min-height:88px;gap:8px}
html body #app-menu .menu-items svg{width:24px;height:24px}
html body .sidebar .row-title{font-size:18px!important}html body .sidebar .row-sub{font-size:14px!important}
@media(max-width:900px){html body>header .header-weather{display:none!important}html body>header .brand-title b{white-space:nowrap}}
/* One ordinary button shape, including header and search actions. */
html body :is(dialog,.sidebar) button:not(.sos-handle){border-radius:10px!important}
html body>header #app-menu-button{width:auto!important;min-width:104px!important;height:52px!important;min-height:52px!important;max-height:52px!important;flex:0 0 auto;padding:0 12px!important;gap:8px!important;border-radius:10px!important;white-space:nowrap;justify-content:center}
html body>header #app-menu-button svg{flex:0 0 24px;width:24px;height:24px}
html body>header #app-menu-button span{display:inline!important}
html body .sidebar-top{display:flex!important;flex-direction:column;gap:12px}
html body .sidebar .list-heading{display:flex!important;align-items:center;gap:12px;padding:0;margin:0}
html body .sidebar #result-count{flex:1;min-width:0}
html body .sidebar :is(#overview,#close-map-search){box-sizing:border-box;height:52px!important;min-height:52px!important;max-height:52px!important;margin:0!important;padding:0 12px!important;align-self:center;border:1px solid #c8d6c3!important;border-radius:10px!important;background:#f6f7f2!important;display:inline-flex;align-items:center;justify-content:center}
html body .sidebar #close-map-search{width:52px;min-width:52px;flex:0 0 52px;padding:0!important}
@media(min-width:901px){html body .sidebar #close-map-search{display:none}}
html body .sidebar .sidebar-top{align-items:stretch!important;width:100%;box-sizing:border-box;padding:16px!important}
html body .sidebar .sidebar-top>:is(.mobile-tools,#mobile-search-panel,.list-heading){width:100%;min-width:0;margin:0!important;box-sizing:border-box}
/* iPhone: logo, three-part weather overview, Menu on one row. */
@media(max-width:900px){
 html body>header{display:grid;grid-template-columns:36px minmax(0,1fr) 88px;gap:8px}
 html body>header .brand{width:36px;min-width:0;display:flex;justify-content:center}
 html body>header .brand-title{display:none!important}
 html body>header .horus-logo{width:36px;height:36px;min-width:0;min-height:0;max-height:none}
 html body>header .header-weather{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;min-width:0;height:52px;min-height:52px;max-height:52px;box-sizing:border-box;margin:0;padding:2px;gap:0;border-radius:10px}
 html body>header .header-weather button{display:grid;grid-template-rows:20px 22px;min-width:0;width:100%;min-height:44px;padding:0 2px;gap:0;box-sizing:border-box}
 html body>header .header-weather small{font-size:12px;line-height:22px;max-width:100%;white-space:nowrap}
 html body>header .header-weather .header-weather-label{font-size:11px;line-height:20px}
 html body>header .header-weather .condition-icon{width:20px;height:20px}
 html body>header .header-weather .header-wind-badge{padding:0 2px}
 html body>header #app-menu-button{width:88px!important;min-width:88px!important;padding:0 8px!important;gap:6px!important;font-size:14px}
 html body>header #app-menu-button svg{width:20px;height:20px;flex-basis:20px}
}
@media(max-width:360px){
 html body>header{grid-template-columns:32px minmax(0,1fr) 44px}
 html body>header .brand,html body>header .horus-logo{width:32px}
 html body>header #app-menu-button{width:44px!important;min-width:44px!important}
 html body>header #app-menu-button span{display:none!important}
}
/* Approved smartphone header: icon-only Menu leaves room for weather. */
@media(max-width:900px){
 html body>header{grid-template-columns:36px minmax(0,1fr) 52px}
 html body>header #app-menu-button{width:52px!important;min-width:52px!important;padding:0!important}
 html body>header #app-menu-button span{display:none!important}
 html body>header #app-menu-button svg{width:24px;height:24px;flex-basis:24px}
}
/* Foreground sharing status remains visible without covering navigation controls. */
html body #web-sharing-status{position:absolute;left:12px;top:12px;z-index:12;max-width:calc(100% - 80px);font:inherit;font-size:13px;line-height:18px;min-height:32px;padding:6px 10px;border:1px solid #c8d6c3;border-radius:10px;background:#edf2e9;color:#183d39;box-shadow:0 2px 6px #183d3915}
html body.driving #web-sharing-status{top:72px}
html body .operations-refresh{display:block;margin:0 0 12px auto;min-height:44px;padding:8px 16px}
html body .website-version{margin:12px 20px 20px;color:#52695d;font-size:14px;text-align:center}
/* Safari must never scroll the app shell underneath a dialog. */
html{height:100%;overflow:hidden;overscroll-behavior:none}
html body{position:fixed;inset:0;width:100%;height:100dvh;margin:0;display:flex;flex-direction:column;overflow:hidden;overscroll-behavior:none}
html body>header{flex:0 0 80px;position:relative;z-index:40}
html body main,html body.driving main{flex:1 1 0;height:auto;min-height:0;width:100%;overflow:hidden}
@media(max-width:900px){html body>header{flex-basis:76px}html body main,html body.driving main{height:auto;min-height:0}}
html body dialog.contact-card>header .close{background:transparent!important;border:1px solid #ffffff55!important;color:#fff!important;border-radius:10px!important}