@keyframes tamz-mesh {
    0% {
        --tamz-y-0: 90%;
        --tamz-c-0: #3B2458;
        --tamz-s-start-0: 1%;
        --tamz-s-end-0: 61%;
        --tamz-x-0: 91%;
        --tamz-c-1: #3B2458;
        --tamz-x-1: 2%;
        --tamz-s-start-1: 0%;
        --tamz-s-end-1: 55%;
        --tamz-y-1: 101%;
        --tamz-y-2: 56%;
        --tamz-c-2: #73509B;
        --tamz-x-2: 21%;
        --tamz-s-start-2: 19%;
        --tamz-s-end-2: 54%;
        --tamz-x-3: 51%;
        --tamz-c-3: #73509B;
        --tamz-s-start-3: 0%;
        --tamz-s-end-3: 67%;
        --tamz-y-3: 80%;
        --tamz-x-4: 74%;
        --tamz-c-4: #3B2458;
        --tamz-y-4: 93%;
        --tamz-s-start-4: 12%;
        --tamz-s-end-4: 82%;
        --tamz-x-5: 94%;
        --tamz-s-start-5: 12%;
        --tamz-s-end-5: 82%;
        --tamz-c-5: #3B2458;
        --tamz-y-5: 38%;
    }

    100% {
        --tamz-y-0: 8%;
        --tamz-c-0: #73509B;
        --tamz-s-start-0: 4.686035613870666%;
        --tamz-s-end-0: 94.34052125739515%;
        --tamz-x-0: 15%;
        --tamz-c-1: #3B2458;
        --tamz-x-1: 79%;
        --tamz-s-start-1: 4.686035613870666%;
        --tamz-s-end-1: 77%;
        --tamz-y-1: 36%;
        --tamz-y-2: 88%;
        --tamz-c-2: #3B2458;
        --tamz-x-2: 91%;
        --tamz-s-start-2: 6%;
        --tamz-s-end-2: 73%;
        --tamz-x-3: 82%;
        --tamz-c-3: #3B2458;
        --tamz-s-start-3: 8%;
        --tamz-s-end-3: 86%;
        --tamz-y-3: 18%;
        --tamz-x-4: 10%;
        --tamz-c-4: #3B2458;
        --tamz-y-4: 69%;
        --tamz-s-start-4: 20%;
        --tamz-s-end-4: 75%;
        --tamz-x-5: 66%;
        --tamz-s-start-5: 20%;
        --tamz-s-end-5: 75%;
        --tamz-c-5: #3B2458;
        --tamz-y-5: 10%;
    }
}

@property --tamz-y-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 90%
}

@property --tamz-c-0 {
    syntax: '<color>';
    inherits: false;
    initial-value: #3B2458
}

@property --tamz-s-start-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 1%
}

@property --tamz-s-end-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 61%
}

@property --tamz-x-0 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 91%
}

@property --tamz-c-1 {
    syntax: '<color>';
    inherits: false;
    initial-value: #3B2458
}

@property --tamz-x-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 2%
}

@property --tamz-s-start-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%
}

@property --tamz-s-end-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 55%
}

@property --tamz-y-1 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 101%
}

@property --tamz-y-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 56%
}

@property --tamz-c-2 {
    syntax: '<color>';
    inherits: false;
    initial-value: #73509B
}

@property --tamz-x-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 21%
}

@property --tamz-s-start-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 19%
}

@property --tamz-s-end-2 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 54%
}

@property --tamz-x-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 51%
}

@property --tamz-c-3 {
    syntax: '<color>';
    inherits: false;
    initial-value: #73509B
}

@property --tamz-s-start-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 0%
}

@property --tamz-s-end-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 67%
}

@property --tamz-y-3 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 80%
}

@property --tamz-x-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 74%
}

@property --tamz-c-4 {
    syntax: '<color>';
    inherits: false;
    initial-value: #3B2458
}

@property --tamz-y-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 93%
}

@property --tamz-s-start-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 12%
}

@property --tamz-s-end-4 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 82%
}

@property --tamz-x-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 94%
}

@property --tamz-s-start-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 12%
}

@property --tamz-s-end-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 82%
}

@property --tamz-c-5 {
    syntax: '<color>';
    inherits: false;
    initial-value: #3B2458
}

@property --tamz-y-5 {
    syntax: '<percentage>';
    inherits: false;
    initial-value: 38%
}

#about::before {
    --tamz-y-0: 90%;
    --tamz-c-0: #3B2458;
    --tamz-x-0: 91%;
    --tamz-c-1: #3B2458;
    --tamz-x-1: 2%;
    --tamz-y-1: 101%;
    --tamz-y-2: 56%;
    --tamz-c-2: #73509B;
    --tamz-x-2: 21%;
    --tamz-x-3: 51%;
    --tamz-c-3: #73509B;
    --tamz-y-3: 80%;
    --tamz-x-4: 74%;
    --tamz-c-4: #3B2458;
    --tamz-y-4: 93%;
    --tamz-x-5: 94%;
    --tamz-c-5: #3B2458;
    --tamz-y-5: 38%;
    background-color: #3B2458;
    background-image: radial-gradient(circle at var(--tamz-x-0) var(--tamz-y-0), var(--tamz-c-0) var(--tamz-s-start-0), transparent var(--tamz-s-end-0)), radial-gradient(circle at var(--tamz-x-1) var(--tamz-y-1), var(--tamz-c-1) var(--tamz-s-start-1), transparent var(--tamz-s-end-1)), radial-gradient(circle at var(--tamz-x-2) var(--tamz-y-2), var(--tamz-c-2) var(--tamz-s-start-2), transparent var(--tamz-s-end-2)), radial-gradient(circle at var(--tamz-x-3) var(--tamz-y-3), var(--tamz-c-3) var(--tamz-s-start-3), transparent var(--tamz-s-end-3)), radial-gradient(circle at var(--tamz-x-4) var(--tamz-y-4), var(--tamz-c-4) var(--tamz-s-start-4), transparent var(--tamz-s-end-4)), radial-gradient(circle at var(--tamz-x-5) var(--tamz-y-5), var(--tamz-c-5) var(--tamz-s-start-5), transparent var(--tamz-s-end-5));
    animation: tamz-mesh 10s linear infinite alternate;
    background-blend-mode: normal, normal, normal, normal, normal, normal;
    will-change: transform, opacity;
    contain: paint;
}
#about::before{inset:0;transform:none;filter:none;opacity:var(--about-gradient,0);animation-play-state:paused;will-change:auto}
#about.background-visible:not(.background-hidden)::before{animation-play-state:running}
#about.background-hidden::before{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){#about::before{animation:none}}
@media(min-width:861px){#guidelines,#studio-home{scroll-margin-top:-105px}.scroll-chapter>.font-release .release-poster{padding-block:0}.scroll-chapter>.usage-guide .usage-stage{height:clamp(160px,23svh,240px)}}
body::after{content:"";position:fixed;inset:0;z-index:100;pointer-events:none;background-image:var(--site-grain);background-repeat:repeat;opacity:.12;mix-blend-mode:soft-light}
/* Centre the full showcase group, not the carousel alone. */
#works{scroll-margin-top:-105px}
#works .rules-sticky{justify-content:center;gap:0;padding-top:calc(var(--menu-height,88px) + 24px);padding-bottom:24px}
#works .section-heading{margin-bottom:clamp(24px,4svh,48px)}
#works .rules-rail{flex-shrink:0}
#works .mock-card{width:min(600px,53svh)}
#works .rail-hint{margin-top:18px;flex-shrink:0}
.ending #faq.footer-faq{display:block;padding:0;margin-top:28px;max-width:520px;min-height:0}
.footer-faq details{padding:12px 0;border-color:var(--rule)}
.footer-faq summary{font-size:14px}
.footer-faq details p{font-size:13px;line-height:1.55;padding-top:12px;color:var(--ink-muted)}
@media(max-width:809px){#works .mock-card{width:min(105vw,48svh)}#works .section-heading{margin-bottom:24px}#works .rules-sticky{padding-block:20px}.ending #faq.footer-faq{max-width:none}}
@media(prefers-reduced-motion:reduce){#works .rules-sticky{height:auto;padding-block:64px}}
/* Centre complete compositions in the viewport below navigation. */
@media(prefers-reduced-motion:no-preference){
 #proof{height:227svh}
 #works{height:calc(2400px + 17svh)}
}
@media(max-width:809px) and (prefers-reduced-motion:no-preference){#works{height:calc(2500px + 17svh)}}
footer .site-brand .brand-edition .brand-name{font-family:'Big Shoulders',sans-serif!important}
#contact-home .download-copy:focus-within{transform:translate3d(0,var(--finale-y,0px),0)}
#contact-home h2{margin-block:0 20px}
#contact-home h2 br,#contact-home .intro br{display:none}
#contact-home h2 span::before,#contact-home .intro br::after{content:' '}
#contact-home .intro{font-size:clamp(14px,1.3vw,18px);max-width:none;margin-bottom:24px}
#contact-home .intro br{display:inline}
#contact-home .download-note{margin-top:18px}
.ending #faq.footer-faq{margin-top:20px}
.ending #faq.footer-faq details p{color:#D8C8E4;padding:12px 16px 14px;margin-top:8px;background:#D8C8E40a}
.footer-faq details[open] summary{color:#F7F7F3}
@media(min-width:861px){
 .scroll-chapter>section{scroll-margin-top:-105px;padding-top:calc(var(--menu-height,88px) + 24px);padding-bottom:24px}
 .scroll-chapter>.hero,.scroll-chapter>.manifest,.scroll-chapter>.formats{display:flex;align-items:center}
 .scroll-chapter>.usage-guide,.scroll-chapter>.font-release,.scroll-chapter>.tamer-about{display:flex;flex-direction:column;justify-content:center;padding-top:calc(var(--menu-height,88px) + 24px);padding-bottom:24px}
 .proof{--proof-centre-top:max(24px,calc((100svh + var(--menu-height,88px) - var(--proof-copy-height,260px))/2));padding-top:var(--proof-centre-top);scroll-margin-top:-105px}
 .proof-copy{top:var(--proof-centre-top)}
}
