/* Foreground integration only. Live background geometry and motion are Vanta. */
html,body{background:#eaf7ff}
body{min-width:0}
#vanta-stage{position:fixed;inset:0;z-index:0;pointer-events:none;background-color:#eaf7ff;overflow:hidden}
#vanta-stage canvas{pointer-events:none!important}
/* The official JPG is unchanged. This CSS tint is a STATIC palette reference,
   not an exact capture of the WebGL scene or a substitute particle renderer. */
#vanta-stage[data-renderer="official-image-fallback"]::before{content:"";position:absolute;inset:0;background:url("/assets/vanta-birds-official.jpg") center/cover no-repeat;filter:grayscale(1) sepia(1) hue-rotate(170deg) saturate(2.4) brightness(1.05);opacity:.76}
.site-header,.site-footer{border-color:#9dbed84d}
.intro h1{color:#102d4e;text-shadow:0 1px 28px #eaf7ff}
.intro>p{color:#416c8e;text-shadow:0 1px 18px #eaf7ff}
.brand,.text-button{color:#153451}
.site-footer,.footer-link,.motion-toggle{color:#496e8b}
.demo-notice,.demo-notice .quiet-link{color:#486e8a}
.card-glow{box-shadow:0 18px 60px -24px #548caf33,0 3px 14px -6px #4677981a}
.background-preview-tools{position:fixed;bottom:10px;left:50%;transform:translateX(-50%);z-index:5;font-size:11px;line-height:1.4;width:max-content;max-width:calc(100% - 32px)}
.background-controls{display:flex;justify-content:center;align-items:center;gap:5px;padding:5px 8px;background:#fffffff0;border:1px solid #b8d2e680;border-radius:12px;box-shadow:0 3px 15px #20536b09;color:#456982;width:max-content;margin:auto}
.preview-tool-label{display:flex;align-items:center;gap:7px;padding:0 5px;color:#456982}
.sky-swatch{width:9px;height:9px;border-radius:50%;background:#68b8ef;box-shadow:0 0 0 3px #dff1ff}
.background-controls a{font:inherit;min-height:28px;border-radius:7px;white-space:nowrap;color:#456982;display:flex;align-items:center;padding:0 7px;text-decoration:none}
.background-controls a:hover{background:#eaf6ff}
.preview-tool-divider{width:1px;height:14px;background:#d7e6f0;margin:0 3px}
.background-status{margin:0 auto 7px;padding:7px 10px;border:1px solid #c5dce9;background:#fffffff2;border-radius:8px;max-width:400px;color:#486b83;text-align:center;font-size:11px;box-shadow:0 3px 12px #23476c0b}
.background-status[hidden]{display:none}
.motion-toggle:disabled{opacity:.65;cursor:default}
@media(max-width:820px){
 .background-preview-tools{position:relative;bottom:auto;left:auto;transform:none;margin:14px auto 18px}
 .background-controls{gap:2px;flex-wrap:wrap}
 .background-controls a{min-height:36px}
 .background-status{font-size:10px;max-width:320px}
}