:root{--bg: #faf9f8;--text: #1a1a1a;--text-muted: #888;--text-faint: #bbb;--border-subtle: #f0f0f0;--ease-out: cubic-bezier(.16, 1, .3, 1)}body.dark-mode{--bg: #111;--text: #e0e0e0;--text-muted: #999;--text-faint: #555;--border-subtle: #2a2a2a}html{scroll-behavior:smooth;background:var(--bg)}html.dark-mode{background:#111!important}body{font-family:DM Sans,sans-serif;font-weight:300;line-height:1.55;background:transparent!important}body.dark-mode{background:#111}.family-grid{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:1px;background:#eee;border:1px solid #eee}.family-grid.two-col{grid-template-columns:repeat(2,1fr)!important}.family-card{background:#fff;aspect-ratio:1 / 1;box-shadow:0 2px 8px #00000059,0 1px 2px #00000040,inset 0 1px #ffffff06;position:relative;overflow:hidden}.family-card:has(a){padding:0;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s ease,background .2s ease;will-change:transform}.family-card a{display:flex;flex-direction:column;justify-content:space-between;padding:1.75rem;height:100%;box-sizing:border-box;text-decoration:none;color:#1a1a1a}.family-card a:focus-visible{outline:2px solid #1a1a1a;outline-offset:-2px}.family-card:has(a):hover{box-shadow:inset 0 0 0 1.5px #ffffff14,0 8px 24px #00000073,0 2px 8px #0000004d,inset 0 1px #ffffff06}.family-card:nth-child(1):before{content:"";position:absolute;inset:-30%;pointer-events:none;z-index:0;background:radial-gradient(ellipse 70% 70% at 19% 19%,hsla(215,44%,40%,.45),transparent 65%);opacity:.08;transition:opacity .4s ease}.family-card:nth-child(2):before{content:"";position:absolute;inset:-30%;pointer-events:none;z-index:0;background:radial-gradient(ellipse 70% 70% at 81% 19%,hsla(215,44%,40%,.45),transparent 65%);opacity:.08;transition:opacity .4s ease}.family-card:hover:before{opacity:1}.family-card a{position:relative;z-index:1}body.dark-mode .family-grid{background:#333;border-color:#333}body.dark-mode .family-card{background:#1a1a1a}body.dark-mode .family-card a{color:#e0e0e0}body.dark-mode .family-card a:focus-visible{outline-color:#e0e0e0}body.dark-mode .family-card:has(a):hover{box-shadow:inset 0 0 0 1.5px #ffffff0f,0 8px 24px #0000008c,0 2px 8px #0006,inset 0 1px #ffffff06}.dark-toggle{position:fixed;bottom:1.5rem;right:1.5rem;font-family:DM Mono,monospace;font-size:18px;color:#bbb;background:none;border:1px solid #ddd;width:40px;height:40px;border-radius:50%;cursor:pointer;z-index:999;display:flex;align-items:center;justify-content:center;transition:border-color .2s ease,color .2s ease,transform .3s ease}.dark-toggle:hover{color:#888;border-color:#bbb}.dark-toggle.rotated{transform:rotate(180deg)}body.dark-mode .dark-toggle{color:#666;border-color:#333;transform:rotate(180deg)}body:after{content:"";position:fixed;inset:-100%;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 32% 32% at 22% 68%,hsla(215,34%,28%,.36),transparent 70%),radial-gradient(ellipse 26% 26% at 76% 28%,hsla(205,28%,28%,.26),transparent 70%),radial-gradient(ellipse 24% 24% at 50% 82%,hsla(220,26%,26%,.18),transparent 70%);opacity:1;animation:bgFlow 28s ease-in-out infinite alternate}body:before{content:"";position:fixed;inset:-20px;pointer-events:none;z-index:9999;opacity:.055;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");background-size:160px 160px;animation:grainDrift 18s ease-in-out infinite alternate}.concert-row{display:grid;grid-template-columns:80px 1fr;gap:0 2rem;border-bottom:1px solid #f0f0f0;align-items:start;border-left:1.5px solid transparent;margin-left:-1rem;padding:1.25rem 0 1.25rem 1rem;transition:border-left-color .2s ease,background .2s ease}.concert-row:hover{border-left-color:#567db373;background:#212c3b14}.concert-row.muted .concert-title,.concert-row.muted .concert-date{color:#ccc}.concert-row.muted .concert-meta{color:#ddd}.concert-date{font-family:DM Mono,monospace;font-size:11px;color:#bbb;padding-top:2px;white-space:nowrap}.concert-title{font-size:14px;font-weight:400;margin-bottom:4px;color:#1a1a1a;transition:color .2s ease}.concert-meta{font-family:DM Mono,monospace;font-size:11px;color:#aaa}.concert-row:hover .concert-title{color:#d8d8d8}.concert-row:hover .concert-date{color:#666}body.dark-mode .concert-row{border-bottom-color:#222}body.dark-mode .concert-title{color:#e0e0e0}.note-row{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;border-bottom:1px solid #f0f0f0;border-left:1.5px solid transparent;margin-left:-1rem;padding:1.25rem 0 1.25rem 1rem;transition:border-left-color .2s ease,background .2s ease}.note-row:hover{border-left-color:#567db373;background:#212c3b14}.note-title{font-size:14px;font-weight:400;margin-bottom:4px;color:#1a1a1a;transition:color .2s ease}.note-meta{font-family:DM Mono,monospace;font-size:11px;color:#aaa}.note-dl{font-family:DM Mono,monospace;font-size:11px;color:#bbb;text-decoration:none;white-space:nowrap;transition:color .2s ease;flex-shrink:0}.note-dl:hover{color:#759ed7}.note-row:hover .note-title{color:#d8d8d8}.note-row:hover .note-meta{color:#666}body.dark-mode .note-row{border-bottom-color:#222}body.dark-mode .note-title{color:#e0e0e0}body.dark-mode .note-dl:hover{color:#759ed7}body.dark-mode [style*="color:#1a1a1a"]{color:#e0e0e0!important}body.dark-mode [style*="color:#888"]{color:#aaa!important}.fade-in{opacity:0;transform:translateY(16px);transition:opacity .5s ease,transform .5s ease}.fade-in.visible{opacity:1;transform:translateY(0)}@keyframes bgFlow{0%{transform:translate(0) scale(1)}50%{transform:translate(8%,-6%) scale(1.03)}to{transform:translate(14%,-10%) scale(1)}}@keyframes grainDrift{0%{transform:translate(0)}50%{transform:translate(-12px,8px)}to{transform:translate(6px,-10px)}}@media(max-width:580px){.family-grid.two-col{grid-template-columns:1fr!important}.concert-row{grid-template-columns:60px 1fr;gap:0 1rem}.note-row{flex-wrap:wrap;gap:.5rem 1.5rem}}@media(prefers-reduced-motion:reduce){body:after{animation:none}body:before{animation:none}.family-card:before{transition:none}.fade-in{opacity:1!important;transform:none!important;transition:none!important}}
