/*
 * Learn with Vinod — "Liquid Glass" look (v1.9).
 * Loaded after style.css when Customize > Learn with Vinod Options > Look = Liquid Glass.
 *
 * How it works: a soft, fixed aurora gradient sits behind the page; surfaces are
 * translucent "glass" with a bright top edge, a hairline border and a deep, soft
 * shadow. Only the floating header, menus and pop-ups blur what scrolls beneath
 * them (backdrop-filter is costly on phones); cards and panels get the same look
 * from translucency over the smooth background, so scrolling stays fast.
 */

/* ---------- Tokens ---------- */
html.lwv-glass {
	--lwv-bg: #eef3fb;
	--lwv-radius: 20px;
	--g-bg: rgba(255, 255, 255, .62);
	--g-bg-strong: rgba(255, 255, 255, .78);
	--g-bg-soft: rgba(255, 255, 255, .42);
	--g-line: rgba(255, 255, 255, .85);
	--g-hair: rgba(31, 58, 110, .10);
	--g-shine: linear-gradient(180deg, rgba(255, 255, 255, .70) 0%, rgba(255, 255, 255, .18) 38%, rgba(255, 255, 255, 0) 60%);
	--g-shadow: 0 1px 0 rgba(255, 255, 255, .95) inset, 0 0 0 1px var(--g-hair), 0 18px 40px -20px rgba(24, 56, 120, .35), 0 4px 12px -6px rgba(24, 56, 120, .12);
	--g-shadow-hover: 0 1px 0 rgba(255, 255, 255, .95) inset, 0 0 0 1px rgba(31, 111, 235, .18), 0 28px 56px -24px rgba(24, 56, 120, .45), 0 8px 18px -8px rgba(24, 56, 120, .16);
	--g-blur: saturate(180%) blur(22px);
	--g-btn: linear-gradient(180deg, #5b9bff 0%, #1f6feb 55%, #1a5fd0 100%);
	--g-aurora-1: rgba(120, 170, 255, .55);
	--g-aurora-2: rgba(186, 160, 255, .45);
	--g-aurora-3: rgba(120, 220, 205, .40);
	--g-aurora-4: rgba(255, 196, 140, .30);
}
html.lwv-glass[data-theme="dark"] {
	--lwv-bg: #060b17;
	--g-bg: rgba(24, 34, 58, .55);
	--g-bg-strong: rgba(20, 30, 52, .78);
	--g-bg-soft: rgba(30, 42, 70, .40);
	--g-line: rgba(255, 255, 255, .10);
	--g-hair: rgba(255, 255, 255, .07);
	--g-shine: linear-gradient(180deg, rgba(255, 255, 255, .09) 0%, rgba(255, 255, 255, .02) 40%, rgba(255, 255, 255, 0) 60%);
	--g-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 0 0 1px var(--g-hair), 0 20px 44px -20px rgba(0, 0, 0, .7), 0 4px 12px -6px rgba(0, 0, 0, .4);
	--g-shadow-hover: 0 1px 0 rgba(255, 255, 255, .10) inset, 0 0 0 1px rgba(90, 169, 255, .25), 0 30px 60px -24px rgba(0, 0, 0, .8), 0 8px 18px -8px rgba(0, 0, 0, .45);
	--g-btn: linear-gradient(180deg, #7dbbff 0%, #4a98f5 55%, #3a83e0 100%);
	--g-aurora-1: rgba(48, 92, 200, .45);
	--g-aurora-2: rgba(110, 70, 200, .35);
	--g-aurora-3: rgba(20, 130, 130, .30);
	--g-aurora-4: rgba(160, 80, 40, .18);
}

/* ---------- Aurora background ---------- */
html.lwv-glass { background: var(--lwv-bg); }
html.lwv-glass body { background: transparent; }
.lwv-glass body::before {
	content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
	background:
		radial-gradient(42vmax 32vmax at 8% 6%, var(--g-aurora-1), transparent 70%),
		radial-gradient(38vmax 30vmax at 92% 12%, var(--g-aurora-2), transparent 70%),
		radial-gradient(46vmax 34vmax at 70% 96%, var(--g-aurora-3), transparent 70%),
		radial-gradient(30vmax 24vmax at 14% 82%, var(--g-aurora-4), transparent 70%);
}
/* Shared glass surface */
.lwv-glass .lwv-card,
.lwv-glass .lwv-article,
.lwv-glass .widget-area .widget,
.lwv-glass .lwv-hero > .lwv-container,
.lwv-glass .lwv-author-box,
.lwv-glass .lwv-toc,
.lwv-glass .lwv-push-prompt,
.lwv-glass .comments-area {
	background-color: var(--g-bg);
	background-image: var(--g-shine);
	border: 1px solid var(--g-line);
	box-shadow: var(--g-shadow);
}

/* ---------- Floating glass header ---------- */
.lwv-glass .site-header {
	background: transparent; border: 0; box-shadow: none;
	padding: 10px 0 0;
}
.lwv-glass .lwv-header-inner {
	min-height: 64px;
	padding: 0 8px 0 18px;
	border-radius: 22px;
	position: relative; z-index: 0;
}
/* The glass lives on a layer behind the header contents. backdrop-filter on the
   header itself would trap the phone menu (position: fixed) inside the header. */
.lwv-glass .lwv-header-inner::before {
	content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none;
	background-color: var(--g-bg-strong);
	background-image: var(--g-shine);
	border: 1px solid var(--g-line);
	box-shadow: var(--g-shadow);
	-webkit-backdrop-filter: var(--g-blur);
	backdrop-filter: var(--g-blur);
	transition: box-shadow .25s ease;
}
.lwv-glass .site-header.is-scrolled { box-shadow: none; }
@media (max-width: 1219px) { .lwv-glass .lwv-header-inner, .lwv-glass .lwv-hero > .lwv-container { width: auto; margin-left: 10px; margin-right: 10px; } }
.lwv-glass .site-header.is-scrolled .lwv-header-inner::before { box-shadow: var(--g-shadow-hover); }
.lwv-glass[data-theme="dark"] .site-header { background: transparent; }
.lwv-glass .lwv-icon-btn { border-radius: 14px; }
.lwv-glass .lwv-icon-btn:hover, .lwv-glass .lwv-icon-btn:focus-visible { background: var(--g-bg-soft); box-shadow: 0 0 0 1px var(--g-hair) inset; }

/* Desktop menu: pill highlight */
@media (min-width: 1024px) {
	.lwv-glass .main-navigation > div > ul > li > a,
	.lwv-glass .main-navigation > ul > li > a { padding: 9px 14px; border-radius: 999px; transition: background-color .2s, color .2s; }
	.lwv-glass .main-navigation > div > ul > li > a:hover,
	.lwv-glass .main-navigation > ul > li > a:hover { background: var(--g-bg-soft); }
	.lwv-glass .main-navigation .current-menu-item > a,
	.lwv-glass .main-navigation .current_page_item > a {
		background: var(--g-bg); box-shadow: 0 1px 0 var(--g-line) inset, 0 0 0 1px var(--g-hair), 0 6px 14px -8px rgba(24, 56, 120, .35);
	}
	.lwv-glass .main-navigation .sub-menu {
		border-radius: 18px; padding: 8px;
		background-color: var(--g-bg-strong); background-image: var(--g-shine);
		border: 1px solid var(--g-line); box-shadow: var(--g-shadow-hover);
		-webkit-backdrop-filter: var(--g-blur); backdrop-filter: var(--g-blur);
	}
	.lwv-glass .main-navigation .sub-menu a { border-radius: 12px; }
	.lwv-glass .main-navigation .sub-menu a:hover { background: var(--g-bg-soft); }
}

/* Mobile slide-in menu */
@media (max-width: 1023px) {
	.lwv-glass .main-navigation {
		top: 10px; right: 10px; bottom: 10px; width: min(84vw, 360px);
		border-radius: 26px;
		background-color: var(--g-bg-strong); background-image: var(--g-shine);
		border: 1px solid var(--g-line);
		box-shadow: var(--g-shadow-hover);
		-webkit-backdrop-filter: var(--g-blur); backdrop-filter: var(--g-blur);
		transform: translateX(calc(100% + 20px));
	}
	.lwv-glass .main-navigation.is-open { transform: translateX(0); }
	.lwv-glass .lwv-nav-head { border-bottom-color: var(--g-hair); }
	.lwv-glass .main-navigation li { border-bottom-color: var(--g-hair); }
	.lwv-glass .main-navigation a { border-radius: 14px; margin: 2px 8px; padding: 12px 14px; }
	.lwv-glass .main-navigation .sub-menu { background: transparent; }
	.lwv-glass .lwv-nav-overlay { background: rgba(10, 20, 40, .28); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
}

/* Language menu */
.lwv-glass .lwv-lang-menu {
	border-radius: 18px;
	background-color: var(--g-bg-strong); background-image: var(--g-shine);
	border: 1px solid var(--g-line); box-shadow: var(--g-shadow-hover);
	-webkit-backdrop-filter: var(--g-blur); backdrop-filter: var(--g-blur);
}
.lwv-glass .lwv-lang-menu button { border-radius: 12px; }

/* ---------- Hero: a big glass panel ---------- */
.lwv-glass .lwv-hero { background: transparent; color: var(--lwv-ink); padding: 26px 0 6px; margin-bottom: 18px; }
.lwv-glass .lwv-hero > .lwv-container {
	position: relative; overflow: hidden;
	border-radius: 32px; padding: 38px 26px 34px;
	background-color: var(--g-bg);
}
@media (min-width: 768px) { .lwv-glass .lwv-hero > .lwv-container { padding: 54px 56px 50px; } }
.lwv-glass .lwv-hero > .lwv-container > * { position: relative; z-index: 1; }
.lwv-glass .lwv-hero h1 {
	color: var(--lwv-ink);
	font-size: clamp(2rem, 5.2vw, 3.3rem); letter-spacing: -.025em; line-height: 1.08;
	background: linear-gradient(120deg, var(--lwv-ink) 0%, var(--lwv-ink) 45%, var(--lwv-primary) 100%);
	-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.lwv-glass .lwv-hero p { color: var(--lwv-text); font-size: 1.08rem; }
.lwv-glass .lwv-hero [class*="leaf"], .lwv-glass .lwv-hero-art { opacity: .35; }

/* ---------- Search & buttons ---------- */
.lwv-glass .search-field {
	border-radius: 999px; padding-left: 20px;
	background: var(--g-bg-strong); color: var(--lwv-ink);
	border: 1px solid var(--g-line);
	box-shadow: 0 1px 2px rgba(24, 56, 120, .10) inset, 0 0 0 1px var(--g-hair);
}
.lwv-glass .lwv-hero .search-field { border: 1px solid var(--g-line); }
.lwv-glass .search-field:focus { outline: none; box-shadow: 0 0 0 4px rgba(31, 111, 235, .18), 0 0 0 1px var(--lwv-primary); }
.lwv-glass .search-submit,
.lwv-glass .lwv-btn,
.lwv-glass button[type="submit"],
.lwv-glass input[type="submit"],
.lwv-glass .lwv-hero .search-submit,
.lwv-glass .lwv-push-allow,
.lwv-glass .lwv-contact-form .lwv-btn {
	border-radius: 999px; border: 0;
	background: var(--g-btn); color: #fff;
	box-shadow: 0 1px 0 rgba(255, 255, 255, .45) inset, 0 -1px 0 rgba(0, 0, 0, .12) inset, 0 8px 18px -8px rgba(31, 111, 235, .65);
	transition: transform .15s ease, box-shadow .2s ease, filter .2s ease;
}
.lwv-glass .search-submit:hover,
.lwv-glass .lwv-btn:hover,
.lwv-glass button[type="submit"]:hover,
.lwv-glass input[type="submit"]:hover,
.lwv-glass .lwv-hero .search-submit:hover {
	background: var(--g-btn); color: #fff; filter: brightness(1.06); transform: translateY(-1px);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset, 0 -1px 0 rgba(0, 0, 0, .12) inset, 0 12px 24px -10px rgba(31, 111, 235, .75);
}
.lwv-glass[data-theme="dark"] .search-submit,
.lwv-glass[data-theme="dark"] .lwv-btn,
.lwv-glass[data-theme="dark"] button[type="submit"] { color: #06101f; }

/* ---------- Section title ---------- */
.lwv-glass .lwv-section-title {
	border-left: 0; padding-left: 0; display: flex; align-items: center; gap: 10px;
	font-size: 1.3rem; letter-spacing: -.01em;
}
.lwv-glass .lwv-section-title::before {
	content: ""; width: 10px; height: 10px; border-radius: 50%;
	background: var(--g-btn); box-shadow: 0 0 0 4px rgba(31, 111, 235, .15);
}

/* ---------- Cards ---------- */
.lwv-glass .lwv-posts-grid { gap: 22px; }
.lwv-glass .lwv-card {
	border-radius: 24px; padding: 8px;
	transition: transform .25s cubic-bezier(.2, .8, .2, 1), box-shadow .25s ease;
}
.lwv-glass .lwv-card:hover { transform: translateY(-4px); box-shadow: var(--g-shadow-hover); }
.lwv-glass .lwv-card-thumb { border-radius: 17px; background-color: var(--g-bg-soft); }
.lwv-glass .lwv-card-thumb.is-placeholder { background: linear-gradient(135deg, #5b9bff, #1f4ea8 60%, #6b4fd8); }
.lwv-glass .lwv-card-thumb img { transition: transform .5s cubic-bezier(.2, .8, .2, 1); }
.lwv-glass .lwv-card:hover .lwv-card-thumb img { transform: scale(1.035); }
.lwv-glass .lwv-card-body { padding: 14px 12px 12px; }
.lwv-glass .lwv-card-title { letter-spacing: -.01em; }
.lwv-glass .lwv-card.is-featured { padding: 10px; }
@media (min-width: 600px) { .lwv-glass .lwv-card.is-featured .lwv-card-body { padding: 18px 18px 16px; } }

.lwv-glass .lwv-cat-badge {
	background: var(--g-bg-strong); color: var(--lwv-primary);
	box-shadow: 0 1px 0 var(--g-line) inset, 0 0 0 1px var(--g-hair);
	padding: 4px 11px;
}
.lwv-glass .lwv-cat-badge:hover { background: var(--g-btn); color: #fff; }

/* ---------- Article ---------- */
.lwv-glass .lwv-article { border-radius: 28px; }
@media (min-width: 768px) { .lwv-glass .lwv-article { padding: 40px 44px; } }
.lwv-glass .lwv-featured-image { margin: 0 0 26px; }
.lwv-glass .lwv-featured-image img { border-radius: 20px; box-shadow: 0 14px 30px -18px rgba(24, 56, 120, .45); }
.lwv-glass .entry-header .entry-title { letter-spacing: -.02em; }
.lwv-glass .entry-content img { border-radius: 16px; }
.lwv-glass .entry-content blockquote {
	border-left: 0; border-radius: 18px; padding: 16px 20px;
	background: var(--g-bg-soft); box-shadow: 0 1px 0 var(--g-line) inset, 0 0 0 1px var(--g-hair);
}
.lwv-glass .entry-content table { border-radius: 16px; overflow: hidden; border-collapse: separate; border-spacing: 0; box-shadow: 0 0 0 1px var(--g-hair); }
.lwv-glass .entry-content th, .lwv-glass .entry-content td { border: 0; border-bottom: 1px solid var(--g-hair); }
.lwv-glass .entry-content th { background: var(--g-bg-soft); }
.lwv-glass .lwv-toc { border-radius: 20px; background-color: var(--g-bg-soft); }
.lwv-glass .lwv-author-box { border-radius: 22px; }
.lwv-glass .lwv-author-box .lwv-author-photo { box-shadow: 0 0 0 3px var(--g-line), 0 8px 18px -8px rgba(24, 56, 120, .5); }
.lwv-glass .lwv-share a { border-radius: 999px; box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset, 0 6px 14px -8px rgba(0, 0, 0, .35); }

/* Phones: the article stays edge to edge for full-width ads, as before */
@media (max-width: 599px) {
	.lwv-glass .lwv-article { border-radius: 0; border-left: 0; border-right: 0; box-shadow: none; background-color: var(--g-bg-strong); }
	.lwv-glass .lwv-hero > .lwv-container { border-radius: 26px; padding: 30px 22px 26px; }
}

/* ---------- Sidebar ---------- */
.lwv-glass .widget-area .widget { border-radius: 24px; padding: 20px 22px; }
.lwv-glass .widget-title, .lwv-glass .widget .wp-block-heading { border-bottom: 0; padding-bottom: 0; font-size: 1.08rem; display: flex; align-items: center; gap: 8px; }
.lwv-glass .widget-title::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--g-btn); }
.lwv-glass .widget li { border-bottom: 1px solid var(--g-hair); }
.lwv-glass .lwv-start-here { border-top: 0; }
.lwv-glass .lwv-topics li { border-bottom-color: var(--g-hair); }

/* ---------- Pagination ---------- */
.lwv-glass .pagination .page-numbers {
	border-radius: 999px; border: 1px solid var(--g-line);
	background-color: var(--g-bg); box-shadow: 0 0 0 1px var(--g-hair);
}
.lwv-glass .pagination .page-numbers.current { background: var(--g-btn); border-color: transparent; color: #fff; }

/* ---------- Footer: dark glass ---------- */
.lwv-glass .site-footer {
	margin: 32px 10px 10px; border-radius: 28px;
	background: linear-gradient(180deg, rgba(16, 33, 58, .92), rgba(10, 20, 38, .96));
	border: 1px solid rgba(255, 255, 255, .08);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .08) inset, 0 20px 40px -24px rgba(10, 20, 38, .6);
}
.lwv-glass .lwv-footer-bottom { border-top-color: rgba(255, 255, 255, .08); }

/* ---------- Small parts ---------- */
.lwv-glass .lwv-to-top {
	border-radius: 999px;
	background-color: var(--g-bg-strong); color: var(--lwv-ink);
	border: 1px solid var(--g-line); box-shadow: var(--g-shadow);
	-webkit-backdrop-filter: var(--g-blur); backdrop-filter: var(--g-blur);
}
.lwv-glass .lwv-progress span { background: linear-gradient(90deg, #7aa8ff, #1f6feb, #8b6cff); }
.lwv-glass .lwv-push-prompt { border-radius: 24px; background-color: var(--g-bg-strong); -webkit-backdrop-filter: var(--g-blur); backdrop-filter: var(--g-blur); }
.lwv-glass .lwv-push-later { border-radius: 999px; background: var(--g-bg-soft); border-color: var(--g-hair); }
.lwv-glass .lwv-contact-form input[type="text"], .lwv-glass .lwv-contact-form input[type="email"], .lwv-glass .lwv-contact-form textarea {
	border-radius: 14px; background: var(--g-bg-strong); border-color: var(--g-line); box-shadow: 0 0 0 1px var(--g-hair);
}
.lwv-glass .lwv-breadcrumbs a { color: var(--lwv-muted); }

/* ---------- Accessibility & fallbacks ---------- */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	.lwv-glass .lwv-header-inner::before, .lwv-glass .main-navigation, .lwv-glass .lwv-lang-menu, .lwv-glass .lwv-push-prompt { background-color: var(--lwv-surface); }
}
@media (prefers-reduced-transparency: reduce) {
	html.lwv-glass { --g-bg: var(--lwv-surface); --g-bg-strong: var(--lwv-surface); --g-bg-soft: var(--lwv-soft); }
	.lwv-glass body::before { display: none; }
}
@media (forced-colors: active) {
	.lwv-glass body::before { display: none; }
	.lwv-glass .lwv-hero h1 { -webkit-text-fill-color: currentColor; background: none; }
}

/* Hero: the old floating leaves become soft liquid blobs inside the glass panel */
.lwv-glass .lwv-hero { overflow: visible; isolation: auto; }
.lwv-glass .lwv-hero::before, .lwv-glass .lwv-hero::after { display: none; }
.lwv-glass .lwv-hero > .lwv-container { isolation: isolate; }
.lwv-glass .lwv-hero > .lwv-container::before {
	content: ""; position: absolute; z-index: 0; pointer-events: none;
	width: 300px; height: 300px; right: -40px; top: -70px;
	border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%;
	background: linear-gradient(135deg, rgba(91, 155, 255, .50), rgba(139, 108, 255, .32));
	filter: blur(6px);
}
.lwv-glass .lwv-hero > .lwv-container::after {
	content: ""; position: absolute; z-index: 0; pointer-events: none;
	width: 220px; height: 220px; right: 22%; top: auto; bottom: -110px;
	border-radius: 58% 42% 38% 62% / 52% 61% 39% 48%;
	background: linear-gradient(135deg, rgba(42, 200, 190, .40), rgba(91, 155, 255, .20));
	filter: blur(6px);
}
html.lwv-anim.lwv-glass .lwv-hero > .lwv-container::before { animation: lwv-blob 14s ease-in-out infinite alternate; }
html.lwv-anim.lwv-glass .lwv-hero > .lwv-container::after { animation: lwv-blob 18s ease-in-out infinite alternate-reverse; }
@keyframes lwv-blob {
	from { transform: translate(0, 0) rotate(0deg); border-radius: 42% 58% 63% 37% / 41% 44% 56% 59%; }
	to { transform: translate(-18px, 14px) rotate(18deg); border-radius: 58% 42% 38% 62% / 52% 61% 39% 48%; }
}
@media (max-width: 599px) {
	.lwv-glass .lwv-hero > .lwv-container::before { width: 190px; height: 190px; right: -60px; top: -60px; }
	.lwv-glass .lwv-hero > .lwv-container::after { display: none; }
}

/* ==========================================================================
   Liquid Glass v2 (1.9.1): specular rims, light that follows the pointer,
   a sliding menu pill, film grain, and tinted glass parts.
   ========================================================================== */
html.lwv-glass {
	--g-rim: linear-gradient(140deg, rgba(255, 255, 255, .95) 0%, rgba(255, 255, 255, .25) 28%, rgba(255, 255, 255, .06) 55%, rgba(255, 255, 255, .55) 100%);
	--g-sheen: rgba(255, 255, 255, .55);
	--g-tint: rgba(31, 111, 235, .06);
}
html.lwv-glass[data-theme="dark"] {
	--g-rim: linear-gradient(140deg, rgba(255, 255, 255, .28) 0%, rgba(255, 255, 255, .06) 30%, rgba(255, 255, 255, .02) 55%, rgba(140, 190, 255, .22) 100%);
	--g-sheen: rgba(150, 200, 255, .16);
	--g-tint: rgba(90, 169, 255, .06);
}

/* Fine film grain over the aurora: removes colour banding, feels like real glass */
.lwv-glass body::after {
	content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .05;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.lwv-glass[data-theme="dark"] body::after { opacity: .07; }

/* Specular rim: a light edge that is brighter at the top-left and bottom-right,
   drawn as a 1px gradient ring (mask), like light caught in the edge of glass. */
.lwv-glass .lwv-card,
.lwv-glass .lwv-article,
.lwv-glass .widget-area .widget,
.lwv-glass .lwv-hero > .lwv-container,
.lwv-glass .lwv-author-box,
.lwv-glass .lwv-push-prompt { position: relative; }
.lwv-glass .lwv-card::after,
.lwv-glass .widget-area .widget::after,
.lwv-glass .lwv-article::after,
.lwv-glass .lwv-author-box::after,
.lwv-glass .lwv-header-inner::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 2;
	padding: 1px;
	background: var(--g-rim);
	-webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.lwv-glass .lwv-header-inner::after { z-index: -1; }
.lwv-glass .lwv-card, .lwv-glass .widget-area .widget, .lwv-glass .lwv-article, .lwv-glass .lwv-author-box { border-color: transparent; }

/* Light that follows the pointer (desktop; set by glass.js) */
.lwv-glass .lwv-card::before,
.lwv-glass .widget-area .widget::before {
	content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; z-index: 1;
	background: radial-gradient(420px circle at var(--mx, 50%) var(--my, -20%), var(--g-sheen), transparent 42%);
	opacity: 0; transition: opacity .35s ease;
}
.lwv-glass .lwv-card:hover::before, .lwv-glass .widget-area .widget:hover::before { opacity: 1; }
.lwv-glass .lwv-card > *, .lwv-glass .widget-area .widget > * { position: relative; z-index: 3; }
@media (hover: none) { .lwv-glass .lwv-card::before, .lwv-glass .widget-area .widget::before { display: none; } }

/* Cards: slightly deeper lift, soft colour tint in the body */
.lwv-glass .lwv-card { background-color: color-mix(in srgb, var(--g-bg) 92%, var(--g-tint)); }
.lwv-glass .lwv-card:hover { transform: translateY(-5px) scale(1.006); }
.lwv-glass .lwv-card-thumb { box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset, 0 10px 24px -16px rgba(24, 56, 120, .5); }
.lwv-glass .lwv-card.is-featured .lwv-card-title { font-size: clamp(1.4rem, 2.6vw, 1.9rem); letter-spacing: -.02em; line-height: 1.2; }

/* Header: slimmer and clearer once you scroll */
.lwv-glass .lwv-header-inner { transition: min-height .3s ease; }
.lwv-glass .site-header.is-scrolled .lwv-header-inner { min-height: 56px; }
.lwv-glass .site-header.is-scrolled .lwv-logo-svg { height: 38px; }
.lwv-glass .lwv-logo-svg { transition: height .3s ease; }

/* Desktop menu: one glass pill that slides to the hovered item (glass.js) */
@media (min-width: 1024px) {
	.lwv-glass .main-navigation > div > ul, .lwv-glass .main-navigation > ul { position: relative; }
	.lwv-glass .lwv-nav-pill {
		position: absolute; top: 50%; left: 0; height: 40px; width: 0; margin-top: -20px; z-index: 0;
		border-radius: 999px; pointer-events: none; opacity: 0;
		background: var(--g-bg); background-image: var(--g-shine);
		box-shadow: 0 1px 0 var(--g-line) inset, 0 0 0 1px var(--g-hair), 0 8px 18px -10px rgba(24, 56, 120, .45);
		transition: transform .45s cubic-bezier(.3, 1.4, .4, 1), width .45s cubic-bezier(.3, 1.4, .4, 1), opacity .25s ease;
	}
	.lwv-glass .lwv-nav-pill.is-on { opacity: 1; }
	.lwv-glass .main-navigation > div > ul > li, .lwv-glass .main-navigation > ul > li { z-index: 1; }
	/* With the sliding pill, items themselves stay clear */
	.lwv-glass.lwv-has-pill .main-navigation > div > ul > li > a,
	.lwv-glass.lwv-has-pill .main-navigation > ul > li > a,
	.lwv-glass.lwv-has-pill .main-navigation .current-menu-item > a,
	.lwv-glass.lwv-has-pill .main-navigation .current_page_item > a { background: transparent !important; box-shadow: none !important; }
}

/* Buttons: liquid press */
.lwv-glass .search-submit:active, .lwv-glass .lwv-btn:active, .lwv-glass button[type="submit"]:active,
.lwv-glass .lwv-push-allow:active, .lwv-glass .lwv-icon-btn:active { transform: scale(.96); transition-duration: .08s; }
.lwv-glass .search-submit, .lwv-glass .lwv-btn, .lwv-glass button[type="submit"] { position: relative; overflow: hidden; }
.lwv-glass .search-submit::after, .lwv-glass .lwv-btn::after, .lwv-glass button[type="submit"]::after {
	content: ""; position: absolute; left: 8%; right: 8%; top: 1px; height: 45%; border-radius: 999px; pointer-events: none;
	background: linear-gradient(180deg, rgba(255, 255, 255, .45), rgba(255, 255, 255, 0));
}

/* Visitor counter: deep blue liquid glass */
.lwv-glass .lwv-counter-main {
	border-radius: 18px; position: relative; overflow: hidden;
	background: linear-gradient(135deg, rgba(16, 33, 58, .92), rgba(31, 78, 168, .88));
	box-shadow: 0 1px 0 rgba(255, 255, 255, .18) inset, 0 14px 30px -16px rgba(16, 33, 58, .7);
}
.lwv-glass .lwv-counter-main::after {
	content: ""; position: absolute; width: 160px; height: 160px; right: -50px; top: -70px; border-radius: 50%;
	background: radial-gradient(circle, rgba(124, 200, 255, .45), transparent 65%); pointer-events: none;
}
.lwv-glass .lwv-counter-icon { background: rgba(255, 255, 255, .14); box-shadow: 0 1px 0 rgba(255, 255, 255, .25) inset; }
.lwv-glass .widget .lwv-counter-stats li { border-radius: 14px; border-color: var(--g-line); background: var(--g-bg-soft); box-shadow: 0 0 0 1px var(--g-hair); }

/* Popular-post rank badges and list thumbnails */
.lwv-glass .widget img { border-radius: 12px; }

/* Tags/meta chips in the article */
.lwv-glass .entry-meta span { background: var(--g-bg-soft); padding: 3px 10px; border-radius: 999px; box-shadow: 0 0 0 1px var(--g-hair); }
.lwv-glass .lwv-card .entry-meta span { background: transparent; padding: 0; box-shadow: none; }

/* Reading progress: a thin liquid bar with a glow */
.lwv-glass .lwv-progress { height: 3px; }
.lwv-glass .lwv-progress span { box-shadow: 0 0 12px rgba(91, 155, 255, .8); border-radius: 0 3px 3px 0; }

/* Scrollbar to match */
.lwv-glass { scrollbar-color: rgba(31, 111, 235, .35) transparent; }

/* Older browsers without mask-composite or color-mix: plain glass, still fine */
@supports not (mask-composite: exclude) {
	.lwv-glass .lwv-card::after, .lwv-glass .widget-area .widget::after, .lwv-glass .lwv-article::after, .lwv-glass .lwv-author-box::after, .lwv-glass .lwv-header-inner::after { display: none; }
	.lwv-glass .lwv-card, .lwv-glass .widget-area .widget, .lwv-glass .lwv-article, .lwv-glass .lwv-author-box { border-color: var(--g-line); }
}
@supports not (background-color: color-mix(in srgb, red 50%, blue)) {
	.lwv-glass .lwv-card { background-color: var(--g-bg); }
}
@media (prefers-reduced-motion: reduce) {
	.lwv-glass .lwv-nav-pill, .lwv-glass .lwv-card, .lwv-glass .lwv-header-inner { transition: none !important; }
}
@media (max-width: 599px) {
	.lwv-glass .lwv-article::after { display: none; }
}

/* Scrolled header: hide the tagline so the slimmer bar stays tidy */
@media (min-width: 1024px) {
	.lwv-glass .lwv-logo-tagline { transition: opacity .2s ease, max-height .3s ease; max-height: 20px; overflow: hidden; }
	.lwv-glass .site-header.is-scrolled .lwv-logo-tagline { opacity: 0; max-height: 0; }
}
/* A soft frosted mist above the floating header, so content fades as it slides under */
.lwv-glass .site-header::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 46px; pointer-events: none; z-index: -1;
	background: linear-gradient(180deg, color-mix(in srgb, var(--lwv-bg) 70%, transparent), transparent);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	-webkit-mask: linear-gradient(180deg, #000 30%, transparent); mask: linear-gradient(180deg, #000 30%, transparent);
}
