/* Variante Glas: halbdurchsichtige Flächen über weichen Farbfeldern, gleiche Farben */
:root{--glass:rgba(251,251,250,.42);--glass-line:rgba(255,255,255,.7);--glass-edge:rgba(20,30,60,.10);--field1:rgba(42,79,208,.34);--field2:rgba(42,79,208,.16);--sunk-glass:rgba(233,235,232,.45)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--glass:rgba(26,29,32,.45);--glass-line:rgba(255,255,255,.10);--glass-edge:rgba(0,0,0,.4);--field1:rgba(130,153,255,.26);--field2:rgba(130,153,255,.12);--sunk-glass:rgba(12,14,16,.35)}}
:root[data-theme="dark"]{--glass:rgba(26,29,32,.45);--glass-line:rgba(255,255,255,.10);--glass-edge:rgba(0,0,0,.4);--field1:rgba(130,153,255,.26);--field2:rgba(130,153,255,.12);--sunk-glass:rgba(12,14,16,.35)}

body{position:relative;isolation:isolate}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(26rem 22rem at 78% 30%,var(--field1),transparent 70%),
    radial-gradient(30rem 24rem at 8% 62%,var(--field2),transparent 70%),
    radial-gradient(34rem 26rem at 70% 96%,var(--field2),transparent 70%)}
.sec--sunk{background:var(--sunk-glass)}

.memo,.calc,.plan,.form,.memo-switch{
  background:var(--glass);
  -webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);
  border:1px solid var(--glass-line);
  box-shadow:inset 0 1px 0 var(--glass-line),0 1px 2px var(--glass-edge),0 18px 40px -18px var(--glass-edge)}
.plan--main{border-color:var(--accent);box-shadow:inset 0 1px 0 var(--glass-line),0 22px 48px -18px rgba(42,79,208,.35)}
.memo__foot{background:transparent;border-top:1px solid var(--line)}
.memo__top,.memo__row,.calc__out,.plan__extra{border-color:color-mix(in srgb,var(--line) 70%,transparent)}
input,select,textarea{background:color-mix(in srgb,var(--bg) 60%,transparent)}
.nav{background:color-mix(in srgb,var(--bg) 60%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}

/* Fallback ohne Unschärfe oder bei reduzierter Transparenz: feste Flächen */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.memo,.calc,.plan,.form,.memo-switch{background:var(--surface)}}
@media (prefers-reduced-transparency:reduce){.memo,.calc,.plan,.form,.memo-switch,.nav{background:var(--surface);backdrop-filter:none;-webkit-backdrop-filter:none}}