/* v526 iOS 26 Liquid Glass switch + slider (shared by glass-controls.js, app + demo). */
:root{--fc-brand:#bd2940}
html body .fc-switch{position:relative;display:inline-block!important;padding:0!important;margin:0!important;min-width:64px;max-width:64px;flex:none;width:64px;height:28px;border-radius:999px;background:rgba(120,120,128,.16);box-shadow:inset 0 0 0 .5px rgba(0,0,0,.04);transition:background .25s ease;vertical-align:middle;isolation:isolate;-webkit-tap-highlight-color:transparent}
html body .fc-switch.is-on{background:var(--fc-brand)}
html body .fc-switch.is-disabled{opacity:.45}
html body .fc-switch>input[type=checkbox]{all:unset;position:absolute!important;inset:-8px -6px!important;width:auto!important;height:auto!important;min-width:0!important;min-height:0!important;margin:0!important;padding:0!important;opacity:0!important;z-index:3;cursor:pointer;touch-action:pan-y;background:none!important;border:0!important;box-shadow:none!important;outline:0!important}
html body .fc-switch>input[type=checkbox]::before,html body .fc-switch>input[type=checkbox]::after{content:none!important;display:none!important}
html body .fc-switch:has(>input:focus-visible){box-shadow:0 0 0 3px rgba(10,132,255,.45)}
html body .fc-switch-thumb{display:block!important;padding:0!important;min-width:0;max-width:none;flex:none;position:absolute;z-index:2;top:2px;left:2px;width:38px;height:24px;border-radius:999px;pointer-events:none;
 background:linear-gradient(180deg,#fff,rgba(255,255,255,.9));box-shadow:0 3px 8px rgba(0,0,0,.15),0 1px 1px rgba(0,0,0,.06),0 0 0 .5px rgba(0,0,0,.04);
 transform:translateX(0);transition:transform .38s cubic-bezier(.3,1.35,.5,1),width .26s cubic-bezier(.3,1.35,.5,1),height .26s cubic-bezier(.3,1.35,.5,1),top .26s cubic-bezier(.3,1.35,.5,1),left .26s cubic-bezier(.3,1.35,.5,1),background .2s,box-shadow .2s}
html body .fc-switch.is-on .fc-switch-thumb{transform:translateX(22px)}
/* pressed / dragged: the knob grows past the track into a clear glass lens (refraction, rim light, specular highlight) */
html body .fc-switch.is-pressed .fc-switch-thumb{top:-4px;left:-4px;width:52px;height:36px;
 background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.4),rgba(255,255,255,.02) 55%,rgba(255,255,255,.1));
 -webkit-backdrop-filter:blur(.6px) saturate(115%) brightness(1.08);backdrop-filter:blur(.6px) saturate(115%) brightness(1.08);
 box-shadow:inset 0 1.5px 1px rgba(255,255,255,.95),inset 0 -2px 3px rgba(255,255,255,.55),inset 0 0 0 1px rgba(255,255,255,.75),inset 0 0 12px rgba(255,255,255,.35),0 8px 20px rgba(60,10,30,.22)}
html body .fc-switch.is-on.is-pressed .fc-switch-thumb{transform:translateX(16px)}
html body .fc-switch.is-dragging .fc-switch-thumb{transform:translateX(calc(var(--fc-drag,0px) - 3px))!important;transition:width .2s,height .2s,top .2s,left .2s,background .2s}
/* slider: thin track, red fill, capsule glass thumb that turns into a lens while dragging; [data-fc-range] = two thumbs */
html body .fc-slider{position:relative;display:block;width:100%;height:36px;-webkit-tap-highlight-color:transparent;--lo:0;--hi:0}
html body .fc-slider-track{position:absolute;left:14px;right:14px;top:50%;height:6px;margin-top:-3px;border-radius:999px;background:rgba(120,120,128,.2);overflow:hidden}
html body .fc-slider-fill{position:absolute;top:0;bottom:0;left:calc(var(--lo)*1%);width:calc((var(--hi) - var(--lo))*1%);background:var(--fc-brand);border-radius:999px}
html body .fc-slider-thumb{--p:0;display:block!important;padding:0!important;flex:none;position:absolute;z-index:2;top:50%;left:calc(14px + (100% - 28px)*var(--p)/100);width:38px;height:24px;margin:-12px 0 0 -19px;border-radius:999px;pointer-events:none;
 background:linear-gradient(180deg,#fff,rgba(255,255,255,.9));box-shadow:0 3px 8px rgba(0,0,0,.15),0 0 0 .5px rgba(0,0,0,.05);
 transition:width .24s cubic-bezier(.3,1.35,.5,1),height .24s cubic-bezier(.3,1.35,.5,1),margin .24s cubic-bezier(.3,1.35,.5,1),background .2s,box-shadow .2s}
html body .fc-slider-thumb.is-pressed{width:54px;height:36px;margin:-18px 0 0 -27px;
 background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.4),rgba(255,255,255,.02) 55%,rgba(255,255,255,.1));
 -webkit-backdrop-filter:blur(.6px) saturate(115%) brightness(1.08);backdrop-filter:blur(.6px) saturate(115%) brightness(1.08);
 box-shadow:inset 0 1.5px 1px rgba(255,255,255,.95),inset 0 -2px 3px rgba(255,255,255,.55),inset 0 0 0 1px rgba(255,255,255,.75),0 8px 20px rgba(60,10,30,.22)}
html body .fc-slider>input[type=range]{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0 0;opacity:0;z-index:3;cursor:pointer;-webkit-appearance:none;appearance:none;background:none;touch-action:pan-y}
html body .fc-slider>input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:44px;height:36px}
html body .fc-slider-dual>input[type=range]{pointer-events:none}
html body .fc-slider-dual>input[type=range]::-webkit-slider-thumb{pointer-events:auto}
html body .fc-slider-dual>input[type=range]::-moz-range-thumb{pointer-events:auto;width:44px;height:36px}
html body .fc-slider:has(>input:focus-visible) .fc-slider-track{box-shadow:0 0 0 3px rgba(10,132,255,.35)}
@media(prefers-reduced-motion:reduce){.fc-switch-thumb,.fc-slider-thumb{transition:none!important}.fc-switch.is-pressed .fc-switch-thumb{top:2px;left:2px;width:38px;height:24px}.fc-slider-thumb.is-pressed{width:38px;height:24px;margin:-12px 0 0 -19px}}

/* v527 Liquid Glass everywhere (shared): clear glass token, used by buttons, sheets, photo actions, floating chrome. */
:root{--fc-glass-bg:rgba(255,255,255,.22);--fc-glass-filter:blur(14px) saturate(160%) brightness(1.04);--fc-glass-rim:inset 0 1px .5px rgba(255,255,255,.9),inset 0 -1px 1px rgba(255,255,255,.35),inset 0 0 0 .5px rgba(255,255,255,.6);--fc-glass-shadow:0 6px 18px rgba(40,10,25,.12)}
/* clear lens: the pressed switch thumb shows the track through it instead of tinting it pink */
html body .fc-switch.is-on.is-pressed .fc-switch-thumb{background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.5),rgba(255,255,255,.06) 55%,rgba(255,255,255,.14))}
/* (2) secondary buttons: one glass style app-wide (.fc-glass-button + the existing flat .ghost buttons) */
html body :is(.fc-glass-button,button.ghost,a.ghost,.button.ghost):not(.chrome-link):not([class*="chat-"]):not(#fc-x){background:var(--fc-glass-bg)!important;-webkit-backdrop-filter:var(--fc-glass-filter);backdrop-filter:var(--fc-glass-filter);border:0!important;border-radius:999px!important;box-shadow:var(--fc-glass-rim),var(--fc-glass-shadow)!important;color:#64162b!important;font-weight:600;transition:transform .22s cubic-bezier(.3,1.4,.5,1),background .18s}
html body :is(.fc-glass-button,button.ghost,a.ghost,.button.ghost):not(.chrome-link):not([class*="chat-"]):not(#fc-x):active{transform:scale(1.04);background:rgba(255,255,255,.4)!important}
html body :is(.fc-glass-button,button.ghost,.button.ghost):disabled{opacity:.45}
/* (1) Entdecken photo card actions: clear interactive glass circles, colour only on the glyph, press = lens scale */
html body .real-discovery .real-actions.real-actions.real-actions>button:not(#fc-x){background:rgba(255,255,255,.16)!important;-webkit-backdrop-filter:blur(10px) saturate(170%) brightness(1.06)!important;backdrop-filter:blur(10px) saturate(170%) brightness(1.06)!important;border:0!important;box-shadow:inset 0 1.5px 1px rgba(255,255,255,.75),inset 0 -1px 2px rgba(255,255,255,.3),inset 0 0 0 .8px rgba(255,255,255,.55),0 8px 22px rgba(0,0,0,.22)!important;color:#fff!important;-webkit-font-smoothing:antialiased;text-rendering:geometricPrecision;transition:transform .26s cubic-bezier(.3,1.5,.5,1),background .2s,box-shadow .2s!important}
html body .real-discovery .real-actions.real-actions.real-actions>button.action-pass:not(#fc-x){color:#ff5a6e!important}
html body .real-discovery .real-actions.real-actions.real-actions>button.like:not(#fc-x){color:#ff3b5c!important}
html body .real-discovery .real-actions.real-actions.real-actions>button[data-profile-toggle]:not(#fc-x){color:#fff!important}
html body .real-discovery .real-actions.real-actions.real-actions>button.action-small:not(.action-back):not(#fc-x){color:#5ac8fa!important}
html body .real-discovery .real-actions.real-actions.real-actions>button.action-back:not(#fc-x){color:#ffd60a!important}
html body .real-discovery .real-actions.real-actions.real-actions>button:not(#fc-x):active{transform:scale(1.14);background:rgba(255,255,255,.3)!important;box-shadow:inset 0 2px 1px rgba(255,255,255,.95),inset 0 0 14px rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.8),0 12px 28px rgba(0,0,0,.26)!important}
html body .real-discovery .real-actions.real-actions.real-actions>button:disabled:not(#fc-x){opacity:.4}
/* (3) bottom sheets + action sheets: glass material (inset + concentric corners stay from action-sheet.css) */
html body :is(dialog.chat-action-sheet:not(.chat-profile-full),dialog.portal-dialog,dialog.panel-confirm-dialog,dialog.location-settings-sheet,dialog.be-removed-sheet,.fc-action-sheet)[open]:not(#fc-x){background:rgba(255,250,252,.62)!important;-webkit-backdrop-filter:blur(30px) saturate(180%)!important;backdrop-filter:blur(30px) saturate(180%)!important;box-shadow:var(--fc-glass-rim),0 18px 50px rgba(40,10,25,.22)!important}
@media(prefers-reduced-transparency:reduce){html body :is(dialog.chat-action-sheet,dialog.portal-dialog,dialog.panel-confirm-dialog,dialog.location-settings-sheet,dialog.be-removed-sheet)[open]:not(#fc-x){background:#fff8fa!important}}
/* (4) web/demo burger + bell mirror the native buttons: plain untinted glass, quick crossfade-scale morph on glyph swap */
html body .app-chrome .chrome-mobile-top>.chrome-link:not(#fc-x){background:var(--fc-glass-bg)!important;-webkit-backdrop-filter:var(--fc-glass-filter)!important;backdrop-filter:var(--fc-glass-filter)!important;border:0!important;box-shadow:var(--fc-glass-rim),var(--fc-glass-shadow)!important;transition:transform .24s cubic-bezier(.3,1.5,.5,1)}
html body .app-chrome .chrome-mobile-top>.chrome-link:not(#fc-x):active{transform:scale(1.1)}
/* v544: no pop-in keyframe on top-bar glyphs: it replayed on BOTH buttons at every chrome re-render (route change), so a menu→back change also flashed the bell. The class-driven transition in app-chrome.css handles the swap. */
@keyframes fc-symbol-replace{0%{opacity:0;transform:scale(.55)}100%{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){html body .app-chrome .chrome-mobile-top>.chrome-link svg{animation:none}html body .real-discovery .real-actions>button:active{transform:none}}
/* v536 segmented controls + web/demo dock = the native iOS 26 UITabBar look (reference: build 1033 bar):
   glass track, grey translucent selected capsule with the content in brand red, clear magnifying lens while held/dragged. */
html body .glass-segment:not(#fc-x){background:rgba(255,255,255,.28)!important;-webkit-backdrop-filter:blur(18px) saturate(170%)!important;backdrop-filter:blur(18px) saturate(170%)!important;box-shadow:inset 0 1px .5px rgba(255,255,255,.9),inset 0 0 0 .5px rgba(255,255,255,.6),0 8px 24px rgba(40,10,25,.10)!important}
html body .glass-segment>.glass-lens:not(#fc-x){background:rgba(120,120,128,.16)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;box-shadow:none!important;border:0!important}
html body .glass-segment.glass-segment-lifted>.glass-lens:not(#fc-x),html body .glass-segment.glass-segment-dragging>.glass-lens:not(#fc-x){background:radial-gradient(120% 90% at 50% 0%,rgba(255,255,255,.45),rgba(255,255,255,.04) 55%,rgba(255,255,255,.12))!important;-webkit-backdrop-filter:blur(.6px) saturate(115%) brightness(1.08)!important;backdrop-filter:blur(.6px) saturate(115%) brightness(1.08)!important;box-shadow:inset 0 1.5px 1px rgba(255,255,255,.95),inset 0 -2px 3px rgba(255,255,255,.5),inset 0 0 0 1px rgba(255,255,255,.75),0 10px 26px rgba(40,10,25,.18)!important}
html body .glass-segment.glass-segment-has-active>:is(a,button,[role=tab],label):is([aria-current],[aria-selected="true"],[aria-pressed="true"],.active,.selected,:has(input:checked)):not(#fc-x){color:#bd2940!important}
html body .glass-segment.glass-segment-has-active>:is(a,button,[role=tab],label):is([aria-current],[aria-selected="true"],[aria-pressed="true"],.active,.selected,:has(input:checked)) svg{color:#bd2940;stroke:currentColor}
html body .glass-segment>.glass-under svg{transform:scale(1.18);transition:transform .2s cubic-bezier(.3,1.4,.5,1)}
@media(prefers-reduced-transparency:reduce){html body .glass-segment:not(#fc-x){background:#f4eef0!important}}
/* the native bar has a single selection capsule: no extra per-link fill in the web/demo dock */
html body :is(.chrome-dock,.fc-mobile-dock).glass-segment>.chrome-link:not(#fc-x){background:transparent!important;box-shadow:none!important}
/* v537 dock = native UITabBar exactly: inactive glyphs near-black (system label), active glyph filled in brand red */
html body :is(.chrome-dock,.fc-mobile-dock)>.chrome-link:not(#fc-x){color:rgba(28,28,30,.92)!important}
html body :is(.chrome-dock,.fc-mobile-dock)>.chrome-link svg{stroke-width:1.85}
html body :is(.chrome-dock,.fc-mobile-dock)>.chrome-link[aria-current]:not(#fc-x){color:#bd2940!important}
/* only person and bubble.left have .fill variants in the native bar; calendar, clock, sparkles stay outlined */
html body :is(.chrome-dock,.fc-mobile-dock)>.chrome-link[aria-current]:is([href$="profile"],[href$="matches"]) svg{fill:currentColor}
/* v539 login has no title bar or dock anywhere: whenever the auth card is the page (logged-out web, demo sign-in), the app chrome steps aside like web.festlchecker.app logged out */
html body:has(#app>.auth-shell) .unified-navigation{display:none!important}
html body:has(#app>.auth-shell) #app{padding-top:0!important;padding-bottom:0!important;margin-top:0!important}
html body #app>.auth-shell .auth-hello.chrome-relocated-heading{position:static!important;width:auto!important;height:auto!important;margin:0 0 4px!important;overflow:visible;clip-path:none;white-space:normal}
html body main#app>.shell.auth-shell:not(#fc-x):not(#fc-y){padding:12px 12px 8px!important}
