/* Liquid Glass-inspired web material. Financial surfaces stay opaque. */
:root{
 --glass-tint:rgba(249,250,243,.7);--glass-edge:rgba(255,255,255,.96);
 --glass-shade:rgba(51,63,51,.15);--glass-solid:#f5f5ed;
 --glass-rim:rgba(128,145,127,.36);--glass-light:rgba(255,255,255,.6);--glass-sheen:rgba(255,255,255,.15);
 --glass-selection:rgba(222,232,220,.65);--glass-label:#20211e;--glass-active-text:#315d72;
}
:root[data-theme=dark]{
 --glass-tint:rgba(21,26,24,.76);--glass-edge:rgba(225,236,225,.48);
 --glass-shade:rgba(0,7,24,.4);--glass-solid:#151a18;
 --glass-rim:rgba(160,190,175,.32);--glass-light:rgba(205,223,210,.04);--glass-sheen:rgba(255,255,255,.025);
 --glass-selection:rgba(67,85,72,.5);--glass-label:#f5f4ec;--glass-active-text:#f5f4ec;
}
body{background:radial-gradient(ellipse at 15% 0%,rgba(114,164,242,.09),transparent 55%),var(--bg)}
.navigation,.topbar{background:var(--glass-solid)}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
 .navigation,.topbar{
  background:radial-gradient(ellipse at var(--reflection-x,0%) var(--reflection-y,0%),var(--glass-light),transparent 55%),linear-gradient(135deg,var(--glass-sheen),transparent 45%,rgba(191,207,182,.09)),var(--glass-tint);
  -webkit-backdrop-filter:blur(18px) saturate(175%);backdrop-filter:blur(18px) saturate(175%);
  box-shadow:inset 1px 1px 0 var(--glass-edge),inset -1px -1px 0 var(--glass-rim);
 }
}
.topbar{border-bottom-color:var(--glass-rim)}
.navigation{border-right-color:var(--glass-rim)}
.navigation .nav-item.active{background:var(--brand-soft);box-shadow:inset 0 1px 0 var(--glass-edge)}
.mobile-home-header{background:linear-gradient(120deg,#3a4a40,var(--hero-surface) 60%);box-shadow:inset 0 1px 0 rgba(221,235,255,.25)}
@media(max-width:599px){
 .navigation{inset:auto 10px calc(10px + env(safe-area-inset-bottom));width:auto;border:1px solid var(--glass-rim);border-radius:30px;padding:6px 8px;height:70px;box-shadow:0 12px 32px var(--glass-shade),0 2px 6px rgba(16,40,80,.08),inset 1px 1px 0 var(--glass-edge),inset -1px -1px 0 var(--glass-rim)}
 .navigation::before{content:'';position:absolute;inset:2px;pointer-events:none;border-radius:27px;border-top:1px solid var(--glass-edge);border-left:1px solid rgba(255,255,255,.25);background:linear-gradient(170deg,var(--glass-light),transparent 30%);opacity:.7}
 .navigation .nav-items{width:100%;height:100%;margin:0;align-items:center;position:relative}
 .navigation .nav-item{border-radius:22px;min-height:52px;padding:6px 3px;position:relative;color:var(--glass-label)}
 .navigation .nav-item.active{color:var(--glass-active-text);background:linear-gradient(140deg,var(--glass-light),transparent 70%),var(--glass-selection);box-shadow:inset 0 1px 0 var(--glass-edge),inset 0 -1px 0 var(--glass-rim),0 2px 5px rgba(45,76,125,.06)}
 .navigation .nav-add{top:auto;bottom:18px;box-shadow:0 5px 14px var(--glass-shade),inset 0 1px 0 rgba(255,255,255,.5);border-radius:20px;border-color:var(--glass-solid)}
 .tab-indicator[data-shape=pill]{background:linear-gradient(135deg,rgba(211,232,255,.24),transparent 65%),var(--hero-active);box-shadow:inset 0 1px 0 rgba(220,237,255,.5),inset 0 -1px 0 rgba(117,159,221,.24),0 2px 6px rgba(0,9,26,.18)}
 .mobile-pace,.mobile-guidance{background:rgba(145,175,150,.1);border-color:rgba(173,190,171,.23)}
 .mobile-category-chips{padding-bottom:14px}
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){
 .navigation,.topbar{background:var(--glass-solid);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
 .navigation::before{display:none}
 .navigation .nav-item.active{background:var(--brand-soft);box-shadow:none}
 .mobile-home-header{background:var(--hero-surface);box-shadow:none}
 .tab-indicator[data-shape=pill]{background:var(--hero-active);box-shadow:none}
 .mobile-pace{background:var(--hero-surface);border-color:var(--hero-border)}
 .mobile-guidance{background:var(--hero-guidance);border-color:var(--hero-border)}
}
@media(forced-colors:active){
 .navigation,.topbar{background:Canvas;backdrop-filter:none;-webkit-backdrop-filter:none;border:1px solid CanvasText;box-shadow:none}
 .navigation::before{display:none}
 .navigation .nav-item.active{background:Canvas;outline:2px solid Highlight;outline-offset:-2px}
}

/* Branch prototype: transmit the center; refract only the curved perimeter. */
.glass-filter-defs{position:absolute;width:0;height:0;pointer-events:none;overflow:hidden}
@media(max-width:599px){
 @supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .navigation{isolation:isolate;background:rgba(249,250,243,.32);-webkit-backdrop-filter:blur(3px) saturate(160%);backdrop-filter:blur(3px) saturate(160%)}
  :root[data-theme=dark] .navigation{background:rgba(21,26,24,.48)}
  .navigation::before{inset:0;padding:10px;border:0;border-radius:inherit;opacity:1;background:rgba(234,242,229,.15);-webkit-backdrop-filter:blur(1px) saturate(170%);backdrop-filter:blur(1px) saturate(170%);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;z-index:0}
  @supports (backdrop-filter:url('#glass-refraction')){
   .navigation::before{backdrop-filter:url('#glass-refraction') blur(1px) saturate(170%)}
  }
  .navigation::after{content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;background:radial-gradient(ellipse at var(--reflection-x,18%) var(--reflection-y,0%),var(--glass-light),transparent 55%);box-shadow:inset 0 2px 1px var(--glass-edge),inset 0 -2px 1px var(--glass-rim);z-index:0}
  .navigation .nav-items{z-index:1}
  .navigation .nav-add{z-index:2}
  /* Local material beneath text preserves readability as the scenery changes. */
  .navigation .nav-item{background:var(--glass-tint);box-shadow:none;border:1px solid transparent}
  .navigation .nav-item.active{background:linear-gradient(135deg,var(--glass-light),transparent 60%),var(--glass-solid);box-shadow:inset 0 2px 1px var(--glass-edge),inset 0 -1px 1px var(--glass-rim),0 3px 8px var(--glass-shade)}
 }
}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more),(forced-colors:active){
 .navigation{background:var(--glass-solid);-webkit-backdrop-filter:none;backdrop-filter:none}
 :root[data-theme=dark] .navigation{background:var(--glass-solid)}
 .navigation::before,.navigation::after{display:none}
 .navigation .nav-item{background:none;box-shadow:none;border-color:transparent}
 .navigation .nav-item.active{background:var(--brand-soft);box-shadow:none}
}
@media(forced-colors:active){.navigation,:root[data-theme=dark] .navigation{background:Canvas}.navigation .nav-item.active{background:Canvas}}
@media(prefers-reduced-motion:reduce){.navigation{--reflection-x:18%!important;--reflection-y:0%!important}}
