/* Three glass densities; layout, typography and paper cards remain unchanged. */
:root{--glass-thin:linear-gradient(135deg,rgba(255,255,255,.84),rgba(231,241,255,.76));--glass-thick:linear-gradient(140deg,rgba(255,255,255,.93),rgba(236,245,255,.88));--glass-light:linear-gradient(135deg,rgba(255,255,255,.91),rgba(240,247,255,.85));--glass-edge:rgba(117,165,228,.27);--glass-highlight:rgba(255,255,255,.92);--glass-shadow:rgba(35,72,129,.085);--glass-fallback:#f1f6fd}
html.dark-mode{--glass-thin:linear-gradient(135deg,rgba(49,64,85,.82),rgba(29,43,64,.77));--glass-thick:linear-gradient(140deg,rgba(45,61,83,.94),rgba(29,43,64,.90));--glass-light:linear-gradient(135deg,rgba(48,63,84,.89),rgba(31,46,67,.85));--glass-edge:rgba(159,196,243,.25);--glass-highlight:rgba(213,232,255,.16);--glass-shadow:rgba(0,8,25,.23);--glass-fallback:#28364a}
@media(min-width:1024px){
 html body .sidebar .profile-card{background:var(--glass-light);border-color:var(--glass-edge);-webkit-backdrop-filter:blur(12px) saturate(135%);backdrop-filter:blur(12px) saturate(135%);box-shadow:inset 0 1px 0 var(--glass-highlight),inset 1px 0 0 rgba(255,255,255,.12),0 10px 28px var(--glass-shadow)}
 html body .mode-toggle{background:var(--glass-thin);border-color:var(--glass-edge);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);box-shadow:inset 0 1px 0 var(--glass-highlight),0 5px 16px var(--glass-shadow)}
 html body .mode-toggle .slider{box-shadow:inset 0 1px 3px rgba(16,51,98,.10),0 1px 0 rgba(255,255,255,.18)}
 html body .pub-filter-shell{background:var(--glass-light);border-color:var(--glass-edge);-webkit-backdrop-filter:blur(14px) saturate(135%);backdrop-filter:blur(14px) saturate(135%);box-shadow:inset 0 1px 0 var(--glass-highlight),0 8px 24px var(--glass-shadow)}
}
@media(max-width:1023px){
 html body .ref-topbar{background:var(--glass-thin);border-bottom-color:var(--glass-edge);-webkit-backdrop-filter:blur(20px) saturate(145%);backdrop-filter:blur(20px) saturate(145%);box-shadow:inset 0 1px 0 var(--glass-highlight),0 4px 18px var(--glass-shadow)}
 html.glass-scrolled body .ref-topbar{background:var(--glass-thin);box-shadow:inset 0 1px 0 var(--glass-highlight),0 6px 24px var(--glass-shadow)}
 html body .ref-topbar button{background:var(--glass-light);border-color:var(--glass-edge);box-shadow:inset 0 1px 0 var(--glass-highlight),0 3px 10px var(--glass-shadow)}
 html body .mobile-menu{background:var(--glass-thick)!important;border-color:var(--glass-edge);-webkit-backdrop-filter:blur(28px) saturate(140%);backdrop-filter:blur(28px) saturate(140%);box-shadow:inset 0 1px 0 var(--glass-highlight),inset 1px 0 0 rgba(255,255,255,.12),0 18px 44px var(--glass-shadow)}
 html body .mobile-menu-backdrop{background:rgba(21,43,76,.11);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
 html body.dark-mode .mobile-menu-backdrop{background:rgba(4,10,23,.25)}
 html body .mobile-menu ul li a{color:var(--text-main)}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){html body .ref-topbar,html body .mobile-menu,html body .mode-toggle,html body .sidebar .profile-card,html body .pub-filter-shell{background:var(--glass-panel)!important}}

/* Experimental all-card glass: keep existing bounds, labels and type colors. */
:root{--glass-panel:linear-gradient(135deg,rgba(255,255,255,.80),rgba(238,247,255,.66));--glass-inset:linear-gradient(135deg,rgba(255,255,255,.56),rgba(241,248,255,.38));--card-glow:rgba(94,153,245,.015)}
html.dark-mode{--glass-panel:linear-gradient(135deg,rgba(47,62,84,.82),rgba(31,47,68,.70));--glass-inset:linear-gradient(135deg,rgba(66,83,108,.47),rgba(36,53,75,.38));--card-glow:rgba(111,174,255,.015)}
html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,#service li){background:radial-gradient(ellipse at 100% 0%,var(--card-glow),transparent 62%),var(--glass-panel);border-color:var(--glass-edge);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);box-shadow:inset 0 1px 0 var(--glass-highlight),inset 1px 0 0 rgba(255,255,255,.12),0 10px 30px var(--glass-shadow)}
html body .poster-card{--card-glow:rgba(233,179,77,.025)}
html body .publication-card[data-pub-type="journal"]{--card-glow:rgba(75,192,193,.02)}
html body .publication-card[data-pub-type="conference"]{--card-glow:rgba(144,124,229,.022)}
html body :is(.timeline-card,.mode-toggle,.mobile-mode-toggle){background:var(--glass-inset);border-color:var(--glass-edge);-webkit-backdrop-filter:blur(12px) saturate(130%);backdrop-filter:blur(12px) saturate(130%);box-shadow:inset 0 1px 0 var(--glass-highlight),0 4px 16px var(--glass-shadow)}
html body .blog-post :is(.post-header,.post-content),html body .blog-card .card-content{background:transparent}
html body :is(.publication-card,.poster-card,.blog-card):is(.press-active,.card-pressed){background:var(--glass-panel)!important}

/* A nonrepeating circuit atlas replaces every light-mode grid layer. */
html:not(.dark-mode){--page-bg-decorated:radial-gradient(ellipse at 3% 9%,rgba(109,173,255,.20),transparent 34%),radial-gradient(ellipse at 97% 24%,rgba(161,148,237,.14),transparent 35%),radial-gradient(ellipse at 11% 89%,rgba(93,203,209,.15),transparent 35%),linear-gradient(155deg,#f7fbff 0%,#f2f7ff 48%,#f7f5ff 100%)}
html body:not(.dark-mode)::before,.theme-transition-overlay.theme-light::before{background-image:url('/images/circuit-atlas.svg?v=transmission-4');background-size:cover;background-position:center;background-repeat:no-repeat;opacity:1;mix-blend-mode:normal}
html body:not(.dark-mode)::after,.theme-transition-overlay.theme-light::after{background-image:radial-gradient(ellipse at 94% 10%,rgba(126,162,240,.11),transparent 28%),radial-gradient(ellipse at 4% 76%,rgba(83,202,211,.09),transparent 27%);background-size:100% 100%;background-repeat:no-repeat;opacity:1;mix-blend-mode:normal}
.theme-transition-overlay.theme-light{background:radial-gradient(ellipse at 3% 9%,rgba(109,173,255,.20),transparent 34%),radial-gradient(ellipse at 97% 24%,rgba(161,148,237,.14),transparent 35%),linear-gradient(155deg,#f7fbff,#f2f7ff 48%,#f7f5ff)}
@media(max-width:767px){html body:not(.dark-mode)::before,.theme-transition-overlay.theme-light::before{background-image:url('/images/circuit-atlas-mobile.svg?v=transmission-4');background-size:cover;background-position:center top}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,#service li){background:var(--glass-panel)!important}}

/* Lower only the glass tint's alpha; never fade or blur the card's contents. */
:root{--glass-panel:linear-gradient(135deg,rgba(255,255,255,.68),rgba(238,247,255,.48));--glass-inset:linear-gradient(135deg,rgba(255,255,255,.44),rgba(241,248,255,.28));--glass-down-surface:linear-gradient(135deg,rgba(255,255,255,.34),rgba(225,241,255,.16))}
html.dark-mode{--glass-panel:linear-gradient(135deg,rgba(47,62,84,.70),rgba(31,47,68,.52));--glass-inset:linear-gradient(135deg,rgba(66,83,108,.40),rgba(36,53,75,.24));--glass-down-surface:linear-gradient(135deg,rgba(47,66,91,.36),rgba(25,43,66,.20))}
html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,.ref-topbar,.mobile-menu,#service li){--glass-rest-blur:5px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background-color .16s ease,backdrop-filter .16s ease,-webkit-backdrop-filter .16s ease}
html body:is(.dark-mode,:not(.dark-mode)) :is(.timeline-card,.mode-toggle,.mobile-mode-toggle){--glass-rest-blur:3px!important;background:var(--glass-inset)}
html body .ref-topbar{--glass-rest-blur:8px!important}html body .mobile-menu{--glass-rest-blur:12px!important}
html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,.ref-topbar,.mobile-menu,#service li).glass-pressed{background:var(--glass-down-surface)!important;-webkit-backdrop-filter:blur(2px) saturate(110%)!important;backdrop-filter:blur(2px) saturate(110%)!important;transition:transform 65ms ease-out,box-shadow .12s ease-out,border-color .12s ease-out,background-color .14s ease-out,backdrop-filter .14s ease-out,-webkit-backdrop-filter .14s ease-out!important}
html body .glass-pressed>.theme-card-fade{opacity:0!important}
html body #service li:hover{background:var(--glass-panel)}
@media(prefers-reduced-motion:reduce){html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,.ref-topbar,.mobile-menu,#service li):is(.glass-pressed,:not(.glass-pressed)){transition:none!important}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,.ref-topbar,.mobile-menu,#service li):is(.glass-pressed,:not(.glass-pressed)){background:var(--glass-panel)!important}}

/* Let the actual page artwork transmit through the entire glass surface. */
:root{--glass-panel:linear-gradient(135deg,rgba(255,255,255,.035),rgba(238,247,255,.012));--glass-inset:linear-gradient(135deg,rgba(255,255,255,.015),rgba(241,248,255,.005));--glass-thin:linear-gradient(135deg,rgba(255,255,255,.05),rgba(231,241,255,.025));--glass-thick:linear-gradient(140deg,rgba(255,255,255,.10),rgba(236,245,255,.06));--glass-light:linear-gradient(135deg,rgba(255,255,255,.05),rgba(240,247,255,.02));--glass-down-surface:transparent}
html.dark-mode{--glass-panel:linear-gradient(135deg,rgba(47,62,84,.10),rgba(31,47,68,.045));--glass-inset:linear-gradient(135deg,rgba(66,83,108,.045),rgba(36,53,75,.02));--glass-thin:linear-gradient(135deg,rgba(49,64,85,.12),rgba(29,43,64,.065));--glass-thick:linear-gradient(140deg,rgba(45,61,83,.18),rgba(29,43,64,.12));--glass-light:linear-gradient(135deg,rgba(48,63,84,.11),rgba(31,46,67,.06));--glass-down-surface:transparent}
html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,.ref-topbar,.mobile-menu,#service li)>.theme-card-fade{display:none!important}
html body .research-timeline::before{background:none}

/* Rest keeps a soft frost; pressing removes the tint and reveals more detail. */
html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,.ref-topbar,.mobile-menu,#service li):not(.glass-pressed){-webkit-backdrop-filter:blur(var(--glass-rest-blur)) saturate(130%);backdrop-filter:blur(var(--glass-rest-blur)) saturate(130%)}

/* Broad inset shading and a lower rim highlight form a gently recessed glass edge. */
:root{--glass-pressed-edge:rgba(136,180,223,.16);--glass-pressed-shadow:inset var(--liquid-shadow-x,0px) var(--liquid-shadow-y,9px) 30px -4px rgba(35,62,100,.30),inset 0 4px 12px -3px rgba(23,47,79,.20),inset 0 0 22px -7px rgba(25,50,80,.13),inset 0 -4px 20px -3px rgba(255,255,255,.60),0 1px 10px -5px rgba(35,72,129,.045)}
html.dark-mode{--glass-pressed-edge:rgba(180,212,245,.14);--glass-pressed-shadow:inset var(--liquid-shadow-x,0px) var(--liquid-shadow-y,9px) 28px -3px rgba(0,5,16,.72),inset 0 4px 10px -1px rgba(0,5,16,.48),inset 0 0 24px -6px rgba(0,5,16,.32),inset 0 -3px 12px -1px rgba(215,238,255,.34),0 1px 6px -4px rgba(0,8,25,.10)}
html body :is(.profile-card,.publication-card,.poster-card,.blog-card,.blog-post,.research-timeline,.pub-filter-shell,.timeline-card,.mode-toggle,.mobile-mode-toggle,.ref-topbar,.mobile-menu,#service li):is(.glass-pressed,.press-active,.card-pressed){border-color:var(--glass-pressed-edge)!important;box-shadow:var(--glass-pressed-shadow)!important}

/* Liquid glass is reserved for genuine action surfaces. */
:root{--liquid-light:rgba(255,255,255,.12);--liquid-rim-light:rgba(255,255,255,.92);--liquid-rim-blue:rgba(157,208,247,.36);--liquid-rim-violet:rgba(196,180,240,.28);--liquid-hover-shadow:inset 0 1px 9px rgba(255,255,255,.68),inset 0 -1px 12px rgba(157,208,247,.09),var(--liquid-cast-x,0px) var(--liquid-cast-y,18px) 42px -7px rgba(35,72,129,.24),0 6px 18px -7px rgba(35,72,129,.15),0 0 32px rgba(127,184,239,.10)}
html.dark-mode{--liquid-light:rgba(218,238,255,.08);--liquid-rim-light:rgba(228,243,255,.55);--liquid-rim-blue:rgba(131,197,244,.30);--liquid-rim-violet:rgba(177,160,229,.25);--liquid-hover-shadow:inset 0 1px 9px rgba(218,237,255,.26),inset 0 -1px 12px rgba(131,197,244,.08),var(--liquid-cast-x,0px) var(--liquid-cast-y,18px) 46px -7px rgba(0,8,25,.40),0 6px 18px -7px rgba(0,8,25,.24),0 0 36px rgba(109,174,245,.10)}
html body .liquid-ready{transform-origin:var(--liquid-x,50%) var(--liquid-y,50%)}
html body .liquid-positioned{position:relative!important}
html body .liquid-rounded{border-radius:12px}
html body .liquid-control.switch{border-radius:999px}
html body .liquid-control{--glass-rest-blur:3px;transition:transform .24s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease,border-color .18s ease,backdrop-filter .16s ease}
html body .liquid-ready>.liquid-glass-skin{position:absolute!important;inset:0;z-index:0!important;pointer-events:none;border-radius:inherit;overflow:hidden;opacity:0;background:none;transition:opacity .16s ease}
html body .liquid-pressed>.liquid-glass-skin{opacity:1}
/* A fine specular rim sits over a much wider, feathered refraction band. */
html body .liquid-card{--liquid-rim-width:3.5px;--liquid-halo-width:12px;--liquid-edge-core:4px;--liquid-edge-falloff:1;--liquid-edge-opacity:.68}
html body .liquid-card.liquid-pressed{--liquid-halo-width:16px}
html body .liquid-control{--liquid-rim-width:1.5px;--liquid-halo-width:5px;--liquid-edge-core:2px;--liquid-edge-falloff:1.3;--liquid-edge-opacity:.58}
html body .liquid-ready>.liquid-glass-skin::before,html body .liquid-ready>.liquid-glass-skin::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none}
/* The broad light uses edge gradients, never a punched-out content rectangle.
   Filters run before masks, so blurring an XOR ring cannot soften its inner cut. */
html body .liquid-ready>.liquid-glass-skin::after{padding:0;filter:none;-webkit-mask:none;mask:none;opacity:var(--liquid-edge-opacity,.58);background:linear-gradient(to bottom,var(--liquid-edge-top,var(--liquid-rim-light)) 0px,var(--liquid-edge-top,var(--liquid-rim-light)) var(--liquid-edge-core,2px),transparent calc(var(--liquid-halo-width,12px) * var(--liquid-edge-falloff,1.3))),linear-gradient(to top,var(--liquid-edge-bottom,var(--liquid-rim-violet)) 0px,var(--liquid-edge-bottom,var(--liquid-rim-violet)) var(--liquid-edge-core,2px),transparent calc(var(--liquid-halo-width,12px) * var(--liquid-edge-falloff,1.3))),linear-gradient(to right,var(--liquid-rim-blue) 0px,var(--liquid-rim-blue) var(--liquid-edge-core,2px),transparent calc(var(--liquid-halo-width,12px) * var(--liquid-edge-falloff,1.3))),linear-gradient(to left,var(--liquid-rim-blue) 0px,var(--liquid-rim-blue) var(--liquid-edge-core,2px),transparent calc(var(--liquid-halo-width,12px) * var(--liquid-edge-falloff,1.3)))}
/* In dark mode a dark upper bevel and a luminous lower bevel read as a recess. */
html.dark-mode body .liquid-card.liquid-pressed{--liquid-edge-top:rgba(13,22,38,.60);--liquid-edge-bottom:rgba(210,236,255,.42)}
@supports ((mask-composite:exclude) or (-webkit-mask-composite:xor)){
 html body .liquid-ready>.liquid-glass-skin::before{padding:var(--liquid-rim-width,2px);background:linear-gradient(var(--liquid-angle,135deg),var(--liquid-rim-light),var(--liquid-rim-blue) 32%,transparent 52%,var(--liquid-rim-violet) 74%,var(--liquid-rim-light));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
}
/* Old hover lift must not animate a card when its nested button owns the pointer. */
html body :is(.clickable-card:hover:not(.liquid-hover),.poster-card:not(.clickable-card):hover,#service li:not(.clickable-card):hover):not(.liquid-pressed):not(.liquid-releasing){transform:none!important}
html body .liquid-control.timeline-marker{--liquid-control-prefix:translateX(-50%)}
@media(hover:hover) and (pointer:fine){
 html body .liquid-hover:not(.liquid-pressed)>.liquid-glass-skin{opacity:.9}
 html body :is(.liquid-card,.liquid-control).liquid-hover:not(.glass-pressed){border-color:var(--glass-edge)!important;box-shadow:var(--liquid-hover-shadow)!important;-webkit-backdrop-filter:blur(3px) saturate(120%)!important;backdrop-filter:blur(3px) saturate(120%)!important}
 html body .liquid-card.liquid-hover:not(.liquid-pressed){transform:perspective(1000px) translateY(-5px) rotateX(var(--liquid-rx,0deg)) rotateY(var(--liquid-ry,0deg)) scale(1.008)!important;transition:transform .22s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease,border-color .18s ease,backdrop-filter .16s ease!important}
 html body .liquid-control.liquid-hover:not(.liquid-pressed){transform:var(--liquid-control-prefix,translateX(0)) translateY(-1px) scale(1.015)!important}
}
html body .liquid-card.liquid-pressed{transform:perspective(1000px) translateY(3px) rotateX(var(--liquid-rx,0deg)) rotateY(var(--liquid-ry,0deg)) scale(.975,.958)!important;transition:transform .12s cubic-bezier(.2,.8,.2,1),box-shadow .12s ease,border-color .12s ease,backdrop-filter .14s ease,-webkit-backdrop-filter .14s ease!important}
html body .liquid-control.liquid-pressed{transform:var(--liquid-control-prefix,translateX(0)) translateY(1px) scale(.972)!important;border-color:var(--glass-pressed-edge)!important;box-shadow:var(--glass-pressed-shadow)!important;filter:none!important;-webkit-backdrop-filter:blur(2px) saturate(110%)!important;backdrop-filter:blur(2px) saturate(110%)!important;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease!important}
/* Keep selected filter and PDF button fills, so their labels remain legible. */
html body :is(.mobile-menu ul li a,.nav ul li a,.ref-topbar button,.ref-brand,.profile-card .social-links a,.blog-back-link).liquid-pressed{background:transparent!important}
html body .liquid-ready.liquid-releasing{transition:transform .42s cubic-bezier(.16,1.4,.3,1),box-shadow .3s ease,border-color .25s ease,backdrop-filter .22s ease,-webkit-backdrop-filter .22s ease!important}
html body .liquid-releasing>.liquid-glass-skin{transition:opacity .3s ease}
@media(prefers-reduced-motion:reduce){
 html body :is(.liquid-card,.liquid-control).liquid-ready:is(.liquid-hover,.liquid-pressed,.liquid-releasing){transform:var(--liquid-control-prefix,none)!important;transition:none!important}
 html body .liquid-ready>.liquid-glass-skin{transition:none!important}
}

/* One transparent glass face: typography never sits on a separate white plate. */
html body .liquid-card:is(.liquid-hover,.liquid-pressed,.liquid-releasing){background:transparent!important;filter:none!important}
html body .liquid-card>:is(h3,p,.card-content,.pub-card-header),html body .liquid-card .card-content>:is(h3,p,.blog-card-meta){background:transparent!important}

/* Social buttons and every liquid layer share the same circular silhouette.
   Clip the inner optics, while keeping the button's round outer shadow visible. */
html body .profile-card .social-links a{border-radius:50%!important;aspect-ratio:1;flex-shrink:0;overflow:hidden}
html body .profile-card .social-links a>.liquid-glass-skin,html body .profile-card .social-links a>.liquid-glass-skin::before,html body .profile-card .social-links a>.liquid-glass-skin::after{border-radius:50%!important;clip-path:circle(50% at 50% 50%)}

/* Compact controls retain a close upper edge with a stronger curved recess. */
html body .liquid-control:not(.blog-cover-link){--glass-pressed-shadow:inset calc(var(--liquid-shadow-x,0px) * .25) calc(var(--liquid-shadow-y,9px) * .32) 10px -1px rgba(23,47,79,.30),inset 0 2px 5px -1px rgba(23,47,79,.20),inset 0 0 8px -3px rgba(23,47,79,.09),inset 0 -2px 6px -1px rgba(255,255,255,.65),0 1px 4px -2px rgba(35,72,129,.06)}
html.dark-mode body .liquid-control:not(.blog-cover-link){--glass-pressed-shadow:inset calc(var(--liquid-shadow-x,0px) * .25) calc(var(--liquid-shadow-y,9px) * .32) 10px -1px rgba(0,5,16,.64),inset 0 2px 5px -1px rgba(0,5,16,.36),inset 0 0 8px -3px rgba(0,5,16,.18),inset 0 -2px 6px -1px rgba(215,238,255,.38),0 1px 4px -2px rgba(0,8,25,.10)}