/* FreeFish "liquid glass" layer. Loaded after components.css (and after site.css on content
   pages). A soft fixed colour wash sits behind everything; floating chrome (bars, side menu,
   dialogs, map controls) is frosted with backdrop blur; cards are translucent with a light
   edge highlight but no blur, which keeps scrolling smooth on phones. People who turn on
   "Reduce transparency" get solid surfaces. */
:root{
 --glass-bg:rgba(255,255,255,.62);
 --glass-bg-strong:rgba(255,255,255,.78);
 --glass-edge:rgba(18,53,42,.10);
 --glass-hi:rgba(255,255,255,.85);
 --glass-shadow:0 10px 30px rgba(18,53,42,.08),0 1px 2px rgba(18,53,42,.05);
 --glass-blur:blur(22px) saturate(1.7);
 --glass-brand:rgba(21,61,48,.84);
 --glass-wash:radial-gradient(60vmax 50vmax at 0% 0%,rgba(205,229,154,.45),transparent 60%),radial-gradient(55vmax 45vmax at 100% 20%,rgba(45,130,196,.16),transparent 60%),radial-gradient(60vmax 50vmax at 30% 100%,rgba(122,170,140,.22),transparent 60%);
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
 --glass-bg:rgba(30,44,37,.58);--glass-bg-strong:rgba(24,36,30,.82);--glass-edge:rgba(255,255,255,.09);--glass-hi:rgba(255,255,255,.10);
 --glass-shadow:0 10px 30px rgba(0,0,0,.35),0 1px 2px rgba(0,0,0,.3);--glass-brand:rgba(17,46,36,.86);
 --glass-wash:radial-gradient(60vmax 50vmax at 0% 0%,rgba(80,130,60,.22),transparent 60%),radial-gradient(55vmax 45vmax at 100% 20%,rgba(45,130,196,.16),transparent 60%),radial-gradient(60vmax 50vmax at 30% 100%,rgba(40,110,80,.20),transparent 60%);}}
:root[data-theme="dark"]{
 --glass-bg:rgba(30,44,37,.58);--glass-bg-strong:rgba(24,36,30,.82);--glass-edge:rgba(255,255,255,.09);--glass-hi:rgba(255,255,255,.10);
 --glass-shadow:0 10px 30px rgba(0,0,0,.35),0 1px 2px rgba(0,0,0,.3);--glass-brand:rgba(17,46,36,.86);
 --glass-wash:radial-gradient(60vmax 50vmax at 0% 0%,rgba(80,130,60,.22),transparent 60%),radial-gradient(55vmax 45vmax at 100% 20%,rgba(45,130,196,.16),transparent 60%),radial-gradient(60vmax 50vmax at 30% 100%,rgba(40,110,80,.20),transparent 60%);}

/* Ambient wash behind the whole page */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:var(--glass-wash)}

/* Cards: translucent sheet with a bright top edge */
:where(.card),.recommendation-card,.today-section,.cards a,.diagram,.legal,.privacy{
 background:var(--glass-bg);border-color:var(--glass-edge);
 box-shadow:inset 0 1px 0 var(--glass-hi),var(--glass-shadow)}

/* Floating chrome: real frosted glass */
.topbar{background:color-mix(in srgb,var(--c-bg) 55%,transparent);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--glass-edge)}
.rail{background:var(--glass-bg);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border-right:1px solid var(--glass-edge);box-shadow:inset -1px 0 0 var(--glass-hi)}
.bottomnav{background:var(--glass-brand);-webkit-backdrop-filter:blur(24px) saturate(1.8);backdrop-filter:blur(24px) saturate(1.8);border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 12px 32px rgba(12,24,19,.28);border-radius:var(--r-pill)}
.bottomnav button{border-radius:var(--r-pill)}
.bottomnav button:nth-child(3){box-shadow:none}
.modalback{background:rgba(12,24,19,.38);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
#modal>div,.modal{background:var(--glass-bg-strong);-webkit-backdrop-filter:blur(30px) saturate(1.8);backdrop-filter:blur(30px) saturate(1.8);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-hi),var(--shadow-lg)}
#toast{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.maplibregl-ctrl-group,.leaflet-bar,.leaflet-control-layers{background:var(--glass-bg-strong)!important;-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-edge)!important;box-shadow:var(--glass-shadow)!important;border-radius:var(--r-md)!important}


/* Map overlays (toolbar, "Search this area", list toggle, tips): frosted over the live map */
.glass:not(.area-moved):not(.explorer-list-toggle),.explore-map-tip{background:var(--glass-bg-strong);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);border:1px solid var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-hi),var(--glass-shadow)}
.glass button{border-radius:var(--r-pill)}
.explorer-list-toggle.glass{background:var(--glass-brand);color:var(--c-on-brand);border-color:rgba(255,255,255,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),var(--glass-shadow)}
.explore-planbar{background:var(--glass-bg);border-color:var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-hi),var(--glass-shadow)}

/* Controls: glass chips and secondary buttons, glossy primary */
.chip,.secondary{background:var(--glass-bg);border-color:var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-hi)}
.chip.selected,.chip[aria-pressed="true"]{box-shadow:inset 0 1px 0 rgba(255,255,255,.35)}
.primary{background-image:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,0) 55%);box-shadow:inset 0 1px 0 rgba(255,255,255,.22),0 4px 14px rgba(18,53,42,.18)}
input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea{background-color:var(--glass-bg-strong)}

/* Inside deep-green panels, controls use the panel's own translucent surface (light text) */
:is(.today-glance,.aiCard,.today-technique,.authstory,#toast) :is(.chip,.secondary,:where(.card)){background:var(--c-surface);border-color:var(--c-line);box-shadow:none}

/* Deep-green brand panels keep solid colour (for contrast) and gain a sheen */
.today-glance,.aiCard,.today-technique{box-shadow:inset 0 1px 0 rgba(255,255,255,.14),var(--glass-shadow);background-image:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,0) 45%)}

/* Content pages: frosted header */
.site-top{position:sticky;top:0;z-index:10;background:var(--glass-brand);-webkit-backdrop-filter:blur(20px) saturate(1.8);backdrop-filter:blur(20px) saturate(1.8);box-shadow:inset 0 -1px 0 rgba(255,255,255,.12)}
.tip,.warn{box-shadow:inset 0 1px 0 var(--glass-hi)}

/* Accessibility: solid surfaces when transparency is reduced */
@media (prefers-reduced-transparency:reduce){
 body::before{display:none}
 :where(.card),.recommendation-card,.today-section,.cards a,.diagram,.legal,.privacy,.chip,.secondary,.rail{background:var(--c-surface)}
 .glass,.explore-map-tip,.explore-planbar{background:var(--c-surface)}.explorer-list-toggle.glass{background:var(--c-brand)}
 .topbar{background:var(--c-bg)}#modal>div,.modal{background:var(--c-surface)}.bottomnav,.site-top{background:var(--c-brand)}
 .topbar,.rail,.bottomnav,.modalback,#modal>div,.modal,#toast,.site-top,.maplibregl-ctrl-group,.glass,.explore-map-tip{-webkit-backdrop-filter:none;backdrop-filter:none}
}
