/* A separate material study. The white version continues using site/style.css. */
.glass-demo{background:#02091f;--glass-a:#f8fbff57;--glass-b:#e8efff4d;--glass-filter:blur(24px) saturate(1.35) brightness(1.05);--glass-text:#f5f8ff;--glass-hairline:#ffffff33;--glass-pill:#ffffffeb}
.glass-demo .backdrop{background:#041340 url('fabric-first-frame.webp') center/100% 100% no-repeat}
.glass-demo .backdrop canvas{opacity:0;transition:opacity 180ms ease-out}
.glass-demo[data-fabric-ready] .backdrop canvas:not([hidden]){opacity:1}
.glass-demo .backdrop:after{background:linear-gradient(130deg,#03124412,#03124455)}
.glass-demo .buzz-card,.glass-demo .department-paper,.glass-demo .department-header,.glass-demo .home-album,.glass-demo .film-panel,.glass-demo .home-sponsors,.glass-demo .home-library,.glass-demo main>div[lang],.glass-demo .page-directory,.glass-demo .home-projects>div:last-child,.glass-demo .mobile-nav,.glass-demo .portal-card,.glass-demo .author-profile,.glass-demo .author-directory,.glass-demo .account-static,.glass-demo .error-card{--ink:var(--glass-text);--blue:var(--glass-text);color:var(--glass-text);text-shadow:0 1px 14px #0008304d;background:linear-gradient(135deg,var(--glass-a),var(--glass-b));backdrop-filter:var(--glass-filter);-webkit-backdrop-filter:var(--glass-filter);border:1px solid #ffffff3d;box-shadow:inset 0 1px 0 #ffffff73,inset 0 0 0 1px #ffffff14,inset 0 -1px 0 #ffffff1f,0 24px 64px #00082e47}
.glass-demo .department-paper{display:none}
.selected.glass-demo .department-cards .department-tile{--ink:var(--glass-text);--blue:var(--glass-text);color:var(--glass-text);text-shadow:0 1px 14px #0008304d;background:linear-gradient(135deg,var(--glass-a),var(--glass-b));backdrop-filter:var(--glass-filter);-webkit-backdrop-filter:var(--glass-filter);border:1px solid #ffffff4d;box-shadow:inset 0 1px 0 #ffffff73,inset 0 0 0 1px #ffffff14,inset 0 -1px 0 #ffffff1f,0 24px 64px #00082e47}
.glass-demo .department-tile{border:0;transform-origin:0 0}
.glass-demo .department-cards{overflow-anchor:none}
@media(min-width:801px){
 .glass-demo .department-cards[data-card-system]{position:relative}
 .glass-demo .department-cards[data-card-system] .department-tile{overflow:hidden}
 .selected.glass-demo .departments.department-cards[data-card-system] summary{position:static;height:100%;padding:0;display:block;min-height:0}
 .selected.glass-demo .departments.department-cards[data-card-system] .department-tile[open] summary{height:var(--demo-header-height);flex-shrink:0}
 .selected.glass-demo .department-cards[data-card-system] .department-title{position:absolute;top:40px;left:156px;width:var(--demo-title-width);font-size:clamp(56px,5.5vw,100px);transform-origin:0 0}
 .selected.glass-demo .department-cards[data-card-system] .department-tile:not([open]) .department-title{transform:translateX(-52px) scale(.5)}
 .selected.glass-demo .department-cards[data-card-system] .department-shape{position:absolute;top:40px;left:40px;width:80px;height:80px}
 .selected.glass-demo .department-cards[data-card-system] .department-tile:not([open]) .department-shape{transform:translateX(-8px) scale(.6)}
 .selected.glass-demo .departments.department-cards[data-card-system] .plus{display:grid;position:absolute;bottom:32px;left:104px}
 .selected.glass-demo .department-cards[data-card-system] .department-tile[open] .plus{opacity:0;pointer-events:none}
 .selected.glass-demo .department-cards[data-switching] .department-copy{padding-top:20px;flex-shrink:0}
}
@media(min-width:801px) and (max-width:1100px){
 .selected.glass-demo .department-cards[data-card-system] .department-title{top:30px;left:110px}
 .selected.glass-demo .department-cards[data-card-system] .department-tile:not([open]) .department-title{transform:translateX(-34px) scale(.5)}
 .selected.glass-demo .department-cards[data-card-system] .department-shape{top:30px;left:30px;width:56px;height:56px}
 .selected.glass-demo .department-cards[data-card-system] .department-tile:not([open]) .department-shape{transform:translateX(-8px) scale(.642857)}
 .selected.glass-demo .departments.department-cards[data-card-system] .plus{left:76px;bottom:30px}
}
.selected.glass-demo .departments.department-cards .plus{transform:none;background:#ffffff2e;border:1px solid #ffffff5c}
.glass-demo .about-card .card-action,.selected.glass-demo .department-cards .department-action{background:var(--glass-pill);color:#06134f;text-shadow:none}
.glass-demo .blog-categories a,.glass-demo .blog-card-copy,.glass-demo .page-directory>a,.glass-demo .beliefs,.glass-demo .home-project,.glass-demo .chapter-nav,.glass-demo .story-chapter,.glass-demo .project-row,.glass-demo .project-items p,.glass-demo .document-row{border-color:var(--glass-hairline)}
.glass-demo .blog-categories a[aria-current]{color:#fff;border-bottom-color:#fff}
.glass-demo .journal-number{color:#bacdff}
.glass-demo .sponsor-grid{background:#06259312}.glass-demo .sponsor-card{background:#f5f8ff80;color:#06134f;text-shadow:none}
.glass-demo .mobile-nav{--glass-a:#0a1b66d6;--glass-b:#07124ec7;--glass-filter:blur(36px) saturate(1.7)}
.glass-demo .blog-intro:empty{display:none;margin:0}
.glass-demo .blog-tools{background:transparent;padding-bottom:36px}
.glass-demo .blog-tools>label{font-size:13px;margin-bottom:12px}
.glass-demo .search-row{gap:12px}
.glass-demo .search-row input{background:#ffffff26;min-height:52px;padding:14px 16px;border-color:#ffffff55;color:#fff;text-shadow:none}
.glass-demo .search-row input::placeholder{color:#ffffffa6}
.glass-demo .search-row input:focus-visible{outline-color:#fff}
.glass-demo .search-row button{height:52px;min-width:52px;background:#ffffff1f}
.glass-demo .blog-grid{gap:48px 28px}
.glass-demo .blog-image{height:auto;aspect-ratio:16/9}
.glass-demo .blog-card-copy{padding:20px 0 0;margin-top:20px}
.glass-demo .blog-card h2{font-size:clamp(28px,2.3vw,38px);line-height:1.12;letter-spacing:0;margin:14px 0 18px;text-wrap:balance}
.glass-demo .blog-card p{font-size:16px;line-height:1.6}
.glass-demo .blog-read{padding-top:24px;min-height:44px}
@media(max-width:800px){.glass-demo .blog-tools{padding-bottom:28px}.glass-demo .blog-grid{gap:36px}.glass-demo .blog-categories{margin-bottom:28px}.glass-demo .blog-card h2{font-size:30px}.glass-demo .search-row{gap:10px}}
.glass-demo .department-action{text-decoration:none}
.glass-demo .demo-engine{position:fixed;inset:0;display:grid;place-items:center;pointer-events:none;z-index:0;overflow:hidden;color:#eaf4ff}
.demo-engine svg{width:min(76vw,1050px);height:auto;opacity:.095}
.glass-demo main,.glass-demo .contact,.glass-demo .footer{position:relative;z-index:1}
.demo-intro,.demo-loader{position:fixed;inset:0;z-index:100;background:#06134ff5;color:white;display:grid;place-content:center;justify-items:center;overflow:hidden}
.demo-intro[hidden],.demo-loader[hidden]{display:none}
body[data-demo-overlay=intro]{overflow:hidden}
html[data-demo-intro] .demo-intro[hidden]{display:grid}
html[data-demo-intro] .glass-demo>main{opacity:0}
html[data-demo-intro=pending] .intro-assembly,html[data-demo-intro=pending] .intro-name{opacity:0}
.intro-assembly{position:relative;display:grid;place-items:center;width:clamp(260px,48vw,380px);aspect-ratio:1}
.intro-cog{position:absolute;inset:0;color:#bacdff}.intro-cog svg{display:block;width:100%;height:100%}
.intro-assembly>img{position:relative;width:44%;height:auto;object-fit:contain}
.intro-name{font-family:var(--display);font-size:clamp(42px,7vw,70px);font-weight:800;line-height:1;margin:24px 0 0;letter-spacing:.015em}
.intro-name>span{font-weight:800;color:#bacdff}
.intro-skip{margin-top:32px;border:1px solid #ffffff55;border-radius:5px;background:none;color:white;padding:12px 22px;font-size:14px;min-height:44px}
.intro-skip:active{transform:scale(.97)}
.demo-loader{z-index:95;background:#06134fdd;backdrop-filter:blur(10px);gap:20px;pointer-events:none}
.demo-loader>div{width:110px;height:110px;color:#dce8ff}
.demo-loader svg{width:100%;height:100%}.demo-loader span{font-size:14px}
.glass-demo .journal-article{position:relative}
.article-skeleton[hidden]{display:none}
html[data-article-pending] .article-skeleton{display:block;position:absolute;inset:60px 60px auto;z-index:2}
html[data-article-pending] .journal-article>:not(.article-skeleton){opacity:0}
.skeleton-cover,.skeleton-line{position:relative;overflow:hidden;background:#06259316;border-radius:5px}
.skeleton-cover{height:clamp(180px,35vw,500px);margin-bottom:35px}
.skeleton-line{height:22px;margin:18px 0;width:92%}.skeleton-line.wide{height:38px;width:75%;margin-bottom:30px}.skeleton-line.short{width:58%}
html[data-motion=full] .skeleton-cover:after,html[data-motion=full] .skeleton-line:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,#ffffff85,transparent);animation:glass-skeleton 1.2s ease-in-out infinite}
@keyframes glass-skeleton{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.error-brand{position:absolute;left:30px;top:20px;z-index:2}.error-brand img{width:132px;height:auto}
.error-page{min-height:100dvh;display:grid;place-items:center;padding:130px 20px 60px}
.error-card{width:min(100%,1000px);border-radius:5px;padding:clamp(30px,6vw,80px);text-align:center}
.error-number{display:block;font-family:var(--display);font-weight:800;font-size:clamp(140px,25vw,280px);line-height:.85;color:var(--blue)}
.error-card h1{font-family:var(--serif);font-size:clamp(32px,4vw,52px);line-height:1.1;margin:32px 0 20px}.error-card p{font-size:20px}
.error-actions{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-top:32px}.error-actions a{display:inline-flex;align-items:center;gap:16px;padding:18px 24px;border-radius:5px;min-height:44px}.error-home{background:var(--blue);color:white}
@media(max-width:800px){.demo-engine svg{width:150vw}.glass-demo{--glass-filter:blur(14px) saturate(1.3) brightness(1.05)}html[data-article-pending] .article-skeleton{inset:30px 24px auto}.skeleton-line{height:18px}.error-brand{left:20px}.error-card p{font-size:18px}}
@media(prefers-reduced-motion:reduce){.skeleton-cover:after,.skeleton-line:after{animation:none!important}.glass-demo .backdrop canvas{transition:none}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass-demo,.glass-demo .mobile-nav{--glass-a:#0c1f73;--glass-b:#0c1f73}}
@media(prefers-reduced-transparency:reduce),(prefers-contrast:more){.glass-demo,.glass-demo .mobile-nav{--glass-a:#0c1f73;--glass-b:#0c1f73;--glass-filter:none;--glass-hairline:#ffffff80}}
