@import url('https://fonts.googleapis.com/css2?family=Audiowide&family=Baloo+2:wght@400..700&family=Berkshire+Swash&family=Bitcount+Grid+Double&family=Cherry+Bomb+One&family=Chewy&family=Concert+One&family=Cookie&family=Cinzel+Decorative:wght@700&family=Cormorant+Garamond:ital,wght@1,600&family=Croissant+One&family=DynaPuff:wght@400..700&family=Eagle+Lake&family=Eater&family=Emilys+Candy&family=Fredoka:wght@600..700&family=Griffy&family=Henny+Penny&family=Imperial+Script&family=Leckerli+One&family=Montez&family=Mystery+Quest&family=Parisienne&family=Petit+Formal+Script&family=Pirata+One&family=Pixelify+Sans:wght@400..700&family=Satisfy&family=UnifrakturCook:wght@700&display=swap');

/* Title effects belong to the text itself. Post themes may style the outer
   .post-mini-title badge/background without erasing the equipped title effect. */
.milk-title {
    display: inline-block;
    padding-inline: .16em;
    font-weight: 800;
    letter-spacing: .025em;
}

.post-mini-title > .milk-title {
    max-width: 100%;
    text-shadow: none !important;
}

/* Plain/Tier 1 titles should not inherit theme effects. Tier 2 and 3 need
   their own drop-shadows and animations, so do not flatten their filters. */
.post-mini-title > .milk-title:not(.milk-title-tier-2):not(.milk-title-tier-3) {
    filter: none !important;
}

/* Give decorative titles enough breathing room inside themed mini-profile badges. */
.post-mini-title {
    min-width: 6.25rem !important;
    min-height: 1.55rem;
    padding: .25rem .68rem !important;
    box-sizing: border-box;
    overflow: visible !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.post-mini-title > .milk-title {
    max-width: none;
    overflow: visible;
}

.milk-title-tier-1,
.milk-title-tier-2,
.milk-title-tier-3 {
    background-image: linear-gradient(
        90deg,
        var(--title-gradient-start, #d8b6d3),
        var(--title-gradient-end, #d1d2dd)
    ) !important;
    background-color: transparent !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
}

/* Tier 2 keeps the title's Tier 1 gradient and adds its signature typeface. */
.milk-title-tier-2,
.milk-title-tier-3 { line-height: 1.15; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-dreamer { font-family: 'Cookie', cursive; font-size: 1.28em; font-weight: 400; letter-spacing: .01em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-fairy { font-family: 'Emilys Candy', Georgia, serif; font-size: 1.06em; font-weight: 400; letter-spacing: .025em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-magical { font-family: 'Fontdiner Swanky', Georgia, serif; font-size: .94em; font-weight: 400; letter-spacing: .01em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-witchy { font-family: 'Imperial Script', cursive; font-size: 1.34em; font-weight: 400; letter-spacing: .01em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-cozy { font-family: 'DynaPuff', sans-serif; font-size: .96em; font-weight: 600; letter-spacing: .005em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-gothic { font-family: 'UnifrakturCook', Georgia, serif; font-size: 1.08em; font-weight: 700; letter-spacing: .02em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-pixel { font-family: 'Bitcount Grid Double', ui-monospace, monospace; font-size: 1em; font-weight: 400; letter-spacing: .015em; text-transform: none; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-moonlit { font-family: 'Parisienne', cursive; font-size: 1.28em; font-weight: 400; letter-spacing: .01em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-whimsical { font-family: 'Griffy', Georgia, serif; font-size: 1.06em; font-weight: 400; letter-spacing: .025em; }
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-enchanted { font-family: 'Montez', cursive; font-size: 1.3em; font-weight: 400; letter-spacing: .01em; }

/* Mini-profile themes intentionally style the outer badge, but must not alter
   the equipped title's capitalization, font metrics, or signature typeface. */
.post-mini-title > .milk-title {
    font-size: .78rem !important;
    line-height: 1.22 !important;
    font-style: normal;
    font-variant: normal;
    text-transform: none !important;
    letter-spacing: .025em !important;
    white-space: nowrap;
}

/* Use fixed mini-profile sizes instead of em values. The outer badge is only
   .58rem in forum_posts.css, so em-based Tier 2 fonts were being shrunk. */
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-dreamer { font-size: 1.12rem !important; font-weight: 400 !important; letter-spacing: .01em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-fairy { font-size: .86rem !important; font-weight: 400 !important; letter-spacing: .025em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-magical { font-size: .82rem !important; padding-inline: .3em !important; font-weight: 400 !important; letter-spacing: .01em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-witchy { font-size: 1.16rem !important; font-weight: 400 !important; letter-spacing: .01em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-cozy { font-size: .78rem !important; font-weight: 600 !important; letter-spacing: .005em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-gothic { font-size: .9rem !important; font-weight: 700 !important; letter-spacing: .02em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-pixel { font-size: .8rem !important; font-weight: 400 !important; letter-spacing: .015em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-moonlit { font-size: 1.12rem !important; font-weight: 400 !important; letter-spacing: .01em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-whimsical { font-size: .88rem !important; font-weight: 400 !important; letter-spacing: .025em !important; }
.post-mini-title > .milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-enchanted { font-size: 1.14rem !important; font-weight: 400 !important; letter-spacing: .01em !important; }

/* Tier 2 readability: decorative fonts keep their gradient, with a very soft
   neutral drop shadow so pale colors remain legible on light theme badges. */
.milk-title-tier-2 {
    filter:
        drop-shadow(0 1px 0 rgba(67, 46, 58, .34))
        drop-shadow(0 0 1px rgba(67, 46, 58, .18)) !important;
}

/* Keep the small forum version crisp without turning the scripts muddy. */
.post-mini-title > .milk-title-tier-2 {
    filter:
        drop-shadow(0 .75px 0 rgba(67, 46, 58, .4))
        drop-shadow(0 0 .65px rgba(67, 46, 58, .2)) !important;
}

/* Tier 3: Animated Gradient
   Every Tier 3 title uses the same clear progression: its Tier 2 signature
   font remains, while its curated gradient moves in one seamless loop. */
.milk-title-tier-3 {
    position: relative;
    background-image: linear-gradient(
        90deg,
        var(--title-gradient-start, #d8b6d3) 0%,
        var(--title-gradient-end, #d1d2dd) 25%,
        var(--title-gradient-start, #d8b6d3) 50%,
        var(--title-gradient-end, #d1d2dd) 75%,
        var(--title-gradient-start, #d8b6d3) 100%
    ) !important;
    background-size: 200% 100% !important;
    animation: milk-title-gradient-flow 7.2s linear infinite !important;
    filter:
        drop-shadow(0 1px 0 rgba(67, 46, 58, .4))
        drop-shadow(0 0 1.25px rgba(67, 46, 58, .22)) !important;
    will-change: background-position;
}

/* A duplicated start/end pattern makes the loop continuous: the final frame
   is visually identical to the first, so there is no wipe or snap-back. */
@keyframes milk-title-gradient-flow {
    from { background-position: 0% 50%; }
    to { background-position: 200% 50%; }
}

/* The themed forum badge remains untouched; only its inner text animates. */
.post-mini-title > .milk-title-tier-3 {
    transform-origin: center;
}

@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-3 {
        animation: none !important;
        background-position: 50% 50% !important;
        transform: none !important;
    }
}


/* User accessibility preference: remove motion across Milk while preserving
   final visual states. The class is placed on <body> for the signed-in user. */
.site-animations-off *,
.site-animations-off *::before,
.site-animations-off *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
}

/* Advanced account motion preferences. Each category preserves the final
   styling and removes only the movement the member chose to stop. */
.site-title-animations-off .milk-title,
.site-title-animations-off .milk-title *,
.site-title-animations-off .milk-title::before,
.site-title-animations-off .milk-title::after,
.site-title-animations-off .milk-title *::before,
.site-title-animations-off .milk-title *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
}

.site-decorative-animations-off,
.site-decorative-animations-off .site-main-banner,
.site-decorative-animations-off .site-main-banner *,
.site-decorative-animations-off .site-event-banner,
.site-decorative-animations-off .site-event-banner *,
.site-decorative-animations-off .forum-post-card,
.site-decorative-animations-off .forum-post-card *,
.site-decorative-animations-off .profile-canvas,
.site-decorative-animations-off .profile-canvas *,
.site-decorative-animations-off .profile-banner,
.site-decorative-animations-off .profile-banner * {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
}

.site-interface-animations-off :where(a, button, input, select, textarea, summary, dialog, .milk-toast, .milk-pill, .milk-btn),
.site-interface-animations-off :where(a, button, input, select, textarea, summary, dialog, .milk-toast, .milk-pill, .milk-btn)::before,
.site-interface-animations-off :where(a, button, input, select, textarea, summary, dialog, .milk-toast, .milk-pill, .milk-btn)::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
}

.site-minigame-page.site-minigame-animations-off .site-page-content,
.site-minigame-page.site-minigame-animations-off .site-page-content *,
.site-minigame-page.site-minigame-animations-off .site-page-content *::before,
.site-minigame-page.site-minigame-animations-off .site-page-content *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
}

/* Full profile titles are treated like an actual honorific above the name. */
.profile-display-title {
    display: block;
    width: fit-content;
    max-width: 100%;
    margin: 0 0 .18rem;
    font-size: 1.18rem;
    line-height: 1.2;
    overflow: visible;
}
.profile-display-title .milk-title {
    font-size: 1.32em;
    overflow: visible;
}
.profile-display-title .milk-title-font-magical {
    padding-inline: .35em;
}


/* Magical glyph safety
   Fontdiner Swanky's capital G has ink that extends outside the browser's
   normal text paint box. Give the OUTER containers real room instead of
   repeatedly padding the gradient-clipped text itself. */
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-magical {
    padding-inline: .18em !important;
    margin: 0 !important;
    overflow: visible !important;
    clip-path: none !important;
}

.post-mini-title:has(> .milk-title-font-magical) {
    padding-left: 1rem !important;
    padding-right: 1rem !important;
    min-width: 7.25rem !important;
    overflow: visible !important;
}

.profile-display-title:has(.milk-title-font-magical) {
    padding-left: .8rem;
    padding-right: .45rem;
    overflow: visible !important;
}

.profile-display-title:has(.milk-title-font-magical) .milk-title-font-magical {
    overflow: visible !important;
}

/* Tier 3 contrast polish
   Tier 3 should read clearly as an upgrade even on white and pastel badges.
   color-mix keeps each title's own palette while creating richer anchor tones. */
.milk-title-tier-3 {
    --title-tier3-deep-start: color-mix(
        in srgb,
        var(--title-gradient-start, #d8b6d3) 72%,
        #6f315f 28%
    );
    --title-tier3-deep-end: color-mix(
        in srgb,
        var(--title-gradient-end, #d1d2dd) 72%,
        #4b587d 28%
    );
    background-image: linear-gradient(
        90deg,
        var(--title-tier3-deep-start) 0%,
        var(--title-gradient-end, #d1d2dd) 12.5%,
        var(--title-tier3-deep-end) 25%,
        var(--title-gradient-start, #d8b6d3) 37.5%,
        var(--title-tier3-deep-start) 50%,
        var(--title-gradient-end, #d1d2dd) 62.5%,
        var(--title-tier3-deep-end) 75%,
        var(--title-gradient-start, #d8b6d3) 87.5%,
        var(--title-tier3-deep-start) 100%
    ) !important;
    background-size: 200% 100% !important;
    filter:
        saturate(1.28)
        contrast(1.08)
        drop-shadow(0 1px 0 rgba(54, 35, 48, .46))
        drop-shadow(0 0 1.2px rgba(54, 35, 48, .25)) !important;
}

.post-mini-title > .milk-title-tier-3 {
    filter:
        saturate(1.34)
        contrast(1.1)
        drop-shadow(0 .8px 0 rgba(54, 35, 48, .52))
        drop-shadow(0 0 .8px rgba(54, 35, 48, .3)) !important;
}

/* Fontdiner Swanky paints the capital G to the left of its measured glyph box.
   Real spacer glyphs expand the background-clipped text canvas itself; ordinary
   padding and outer-container room do not reliably affect that WebKit paint box. */
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-magical::before,
.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-magical::after {
    content: "\00a0";
    display: inline;
    font-family: inherit;
    font-size: .48em;
    letter-spacing: 0;
}

.milk-title:is(.milk-title-tier-2, .milk-title-tier-3).milk-title-font-magical {
    padding-inline: 0 !important;
    min-width: max-content;
}

.profile-display-title:has(.milk-title-font-magical),
.post-mini-title:has(> .milk-title-font-magical) {
    overflow: visible !important;
}


/* Stable title paint layer
   Fontdiner Swanky's G can be initially clipped by Chromium/WebKit until a
   hover causes a repaint. The outer element now owns layout and breathing
   room; the inner ink span owns gradient clipping and animation. */
.milk-title:has(> .milk-title-ink) {
    background-image: none !important;
    background-color: transparent !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important;
    color: inherit !important;
    animation: none !important;
    filter: none !important;
}

.milk-title > .milk-title-ink {
    display: inline-block;
    box-sizing: content-box;
    min-width: max-content;
    overflow: visible !important;
    white-space: nowrap;
    -webkit-font-smoothing: antialiased;
    backface-visibility: hidden;
    transform: translateZ(0);
    isolation: isolate;
}

.milk-title-tier-1 > .milk-title-ink,
.milk-title-tier-2 > .milk-title-ink,
.milk-title-tier-3 > .milk-title-ink {
    background-image: linear-gradient(
        90deg,
        var(--title-gradient-start, #d8b6d3),
        var(--title-gradient-end, #d1d2dd)
    ) !important;
    background-color: transparent !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
}

.milk-title-tier-2 > .milk-title-ink {
    filter:
        drop-shadow(0 1px 0 rgba(67, 46, 58, .34))
        drop-shadow(0 0 1px rgba(67, 46, 58, .18)) !important;
}

.milk-title-tier-3 > .milk-title-ink {
    --title-tier3-deep-start: color-mix(in srgb, var(--title-gradient-start, #d8b6d3) 72%, #6f315f 28%);
    --title-tier3-deep-end: color-mix(in srgb, var(--title-gradient-end, #d1d2dd) 72%, #4b587d 28%);
    background-image: linear-gradient(
        90deg,
        var(--title-tier3-deep-start) 0%,
        var(--title-gradient-end, #d1d2dd) 12.5%,
        var(--title-tier3-deep-end) 25%,
        var(--title-gradient-start, #d8b6d3) 37.5%,
        var(--title-tier3-deep-start) 50%,
        var(--title-gradient-end, #d1d2dd) 62.5%,
        var(--title-tier3-deep-end) 75%,
        var(--title-gradient-start, #d8b6d3) 87.5%,
        var(--title-tier3-deep-start) 100%
    ) !important;
    background-size: 200% 100% !important;
    animation: milk-title-gradient-flow 7.2s linear infinite !important;
    filter:
        saturate(1.28)
        contrast(1.08)
        drop-shadow(0 1px 0 rgba(54, 35, 48, .46))
        drop-shadow(0 0 1.2px rgba(54, 35, 48, .25)) !important;
    will-change: background-position;
}

/* Literal non-breaking spaces in the template expand the actual text fragment,
   unlike pseudo-element padding, which Chromium may omit from the clipped ink box. */
.milk-title-font-magical > .milk-title-ink {
    padding-inline: .08em;
}

.post-mini-title > .milk-title-tier-2 > .milk-title-ink,
.post-mini-title > .milk-title-tier-3 > .milk-title-ink {
    filter:
        saturate(1.18)
        contrast(1.06)
        drop-shadow(0 .8px 0 rgba(54, 35, 48, .48))
        drop-shadow(0 0 .8px rgba(54, 35, 48, .26)) !important;
}

@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-3 > .milk-title-ink {
        animation: none !important;
        background-position: 50% 50% !important;
    }
}

.site-animations-off .milk-title-tier-3 > .milk-title-ink {
    animation: none !important;
    background-position: 50% 50% !important;
}


/* Magical title font replacement
   Mystery Quest is used at every tier, including plain Tier 0 and gradient Tier 1. */
.milk-title.milk-title-font-magical {
    font-family: 'Mystery Quest', Georgia, serif !important;
    font-size: 1.06em;
    font-weight: 400 !important;
    letter-spacing: .015em !important;
    padding-inline: .12em !important;
    margin: 0 !important;
    overflow: visible !important;
}

.post-mini-title > .milk-title.milk-title-font-magical {
    font-family: 'Mystery Quest', Georgia, serif !important;
    font-size: .9rem !important;
    padding-inline: .12em !important;
}

.profile-display-title .milk-title.milk-title-font-magical {
    font-family: 'Mystery Quest', Georgia, serif !important;
    font-size: 1.38em !important;
    padding-inline: .08em !important;
}

/* Mystery Quest has normal glyph metrics, so disable the old Fontdiner spacer hack. */
.milk-title.milk-title-font-magical::before,
.milk-title.milk-title-font-magical::after {
    content: none !important;
}
.milk-title.milk-title-font-magical > .milk-title-ink {
    padding-inline: 0 !important;
}


/* 2026-07 polish: cleaner full-profile title alignment, slower Tier 3 flow,
   and a mintier Enchanted palette. These overrides intentionally sit at the
   end of the file so they win over earlier Magical-era experiments. */
.profile-identity {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: .12rem;
}

.profile-display-title {
    display: block;
    width: auto;
    max-width: 100%;
    margin: 0 0 .04rem;
    padding: .04rem 0 .16rem;
    font-size: 1.08rem;
    line-height: 1.05;
    text-align: left;
    overflow: visible;
}

.profile-display-title .milk-title {
    display: inline-block;
    font-size: 1.24em;
    line-height: 1.02;
    padding: .02em .06em .12em 0;
    overflow: visible;
    vertical-align: top;
}

.profile-display-title .milk-title.milk-title-font-magical {
    font-size: 1.26em !important;
    padding: .03em .04em .16em 0 !important;
    margin: 0 !important;
}

.profile-display-title:has(.milk-title-font-magical) {
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: visible !important;
}

/* Keep mini-profile Magical roomy, but stop full-profile indents from old hacks. */
.post-mini-title:has(> .milk-title-font-magical) {
    padding-left: .82rem !important;
    padding-right: .82rem !important;
    min-width: 6.9rem !important;
}

.profile-username {
    line-height: 1.05;
}

/* Enchanted reads prettier with a mintier pastel start color. */
.milk-title.milk-title-font-enchanted {
    --title-gradient-start: #b8ead8 !important;
    --title-gradient-end: #d7c3f0 !important;
}

/* Tier 3 should feel elegant, not hurried. */
.milk-title-tier-3,
.milk-title-tier-3 > .milk-title-ink {
    animation-duration: 7.2s !important;
}


/* Full-profile title descender safety
   Decorative fonts such as Mystery Quest need a taller paint box below the
   baseline. Keep the left alignment, but add real bottom breathing room. */
.profile-display-title {
    line-height: 1.24 !important;
    padding-top: .08rem !important;
    padding-bottom: .34rem !important;
    overflow: visible !important;
}

.profile-display-title .milk-title,
.profile-display-title .milk-title > .milk-title-ink {
    line-height: 1.18 !important;
    padding-bottom: .16em !important;
    overflow: visible !important;
}

.profile-display-title .milk-title.milk-title-font-magical,
.profile-display-title .milk-title.milk-title-font-magical > .milk-title-ink {
    line-height: 1.22 !important;
    padding-bottom: .22em !important;
}


/* Tier 4 · Playful Dimension
   Keeps the Tier 3 living gradient, adds a richer dimensional finish, and
   gives each title a restrained per-letter motion. */
.milk-title-tier-4 {
    position: relative;
    line-height: 1.16;
}

.milk-title-tier-4 > .milk-title-ink {
    --title-tier4-deep-start: color-mix(in srgb, var(--title-gradient-start, #d8b6d3) 68%, #56334d 32%);
    --title-tier4-deep-end: color-mix(in srgb, var(--title-gradient-end, #d1d2dd) 68%, #3e506f 32%);
    display: inline-flex;
    align-items: baseline;
    overflow: visible !important;
    background-image: linear-gradient(
        90deg,
        var(--title-tier4-deep-start) 0%,
        var(--title-gradient-end, #d1d2dd) 12.5%,
        var(--title-tier4-deep-end) 25%,
        var(--title-gradient-start, #d8b6d3) 37.5%,
        var(--title-tier4-deep-start) 50%,
        var(--title-gradient-end, #d1d2dd) 62.5%,
        var(--title-tier4-deep-end) 75%,
        var(--title-gradient-start, #d8b6d3) 87.5%,
        var(--title-tier4-deep-start) 100%
    ) !important;
    background-size: 200% 100% !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    animation: milk-title-gradient-flow 7.2s linear infinite !important;
    filter:
        saturate(1.35)
        contrast(1.1)
        drop-shadow(0 -1px 0 rgba(255,255,255,.42))
        drop-shadow(0 1.5px 0 rgba(52,34,47,.48))
        drop-shadow(0 2.5px 1.4px rgba(52,34,47,.23)) !important;
    will-change: background-position;
}

.milk-title-tier-4 .milk-title-letter {
    display: inline-block;
    position: relative;
    transform-origin: 50% 82%;
    animation-duration: 5.6s;
    animation-timing-function: ease-in-out;
    animation-iteration-count: infinite;
    animation-delay: calc(var(--letter-index, 0) * .11s);
    will-change: transform;
}

/* Title-specific motion personalities. Most of each loop is intentionally still. */
.milk-title-font-dreamer.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-float-wave; }
.milk-title-font-fairy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-flutter; }
.milk-title-font-magical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-cascade; }
.milk-title-font-witchy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-sway; }
.milk-title-font-cozy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-squish; }
.milk-title-font-gothic.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-rise; }
.milk-title-font-pixel.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-pixel-step; animation-timing-function: steps(2, end); }
.milk-title-font-moonlit.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-moon-drift; }
.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-bouncy; animation-delay: calc(var(--letter-index, 0) * .09s + (var(--letter-index, 0) % 2) * .12s); }
.milk-title-font-enchanted.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-ripple; }

@keyframes milk-letter-float-wave {
    0%, 18%, 68%, 100% { transform: translateY(0); }
    30% { transform: translateY(-1.8px); }
    42% { transform: translateY(.4px); }
}
@keyframes milk-letter-flutter {
    0%, 20%, 70%, 100% { transform: translateY(0) rotate(0); }
    31% { transform: translateY(-2px) rotate(-2deg); }
    39% { transform: translateY(-.6px) rotate(1.5deg); }
    47% { transform: translateY(0) rotate(0); }
}
@keyframes milk-letter-cascade {
    0%, 18%, 72%, 100% { transform: translateY(0) scale(1); }
    31% { transform: translateY(-2.2px) scale(1.035); }
    42% { transform: translateY(.3px) scale(.99); }
}
@keyframes milk-letter-sway {
    0%, 18%, 72%, 100% { transform: translateY(0) rotate(0); }
    31% { transform: translateY(-.8px) rotate(-2deg); }
    43% { transform: translateY(.2px) rotate(1.3deg); }
}
@keyframes milk-letter-squish {
    0%, 18%, 72%, 100% { transform: translateY(0) scale(1); }
    30% { transform: translateY(-1.4px) scale(1.035, .97); }
    40% { transform: translateY(.35px) scale(.98, 1.035); }
    50% { transform: translateY(0) scale(1); }
}
@keyframes milk-letter-rise {
    0%, 20%, 72%, 100% { transform: translateY(0); }
    34% { transform: translateY(-1.7px); }
    48% { transform: translateY(0); }
}
@keyframes milk-letter-pixel-step {
    0%, 20%, 70%, 100% { transform: translate(0,0); }
    30% { transform: translateY(-2px); }
    38% { transform: translate(1px,-1px); }
    46% { transform: translate(0,0); }
}
@keyframes milk-letter-moon-drift {
    0%, 18%, 72%, 100% { transform: translateY(0) translateX(0); }
    32% { transform: translateY(-1.6px) translateX(.35px); }
    45% { transform: translateY(-.2px) translateX(0); }
}
@keyframes milk-letter-bouncy {
    0%, 18%, 70%, 100% { transform: translateY(0) rotate(0); }
    29% { transform: translateY(-2.3px) rotate(-1deg); }
    39% { transform: translateY(.5px) rotate(1deg); }
    48% { transform: translateY(0) rotate(0); }
}
@keyframes milk-letter-ripple {
    0%, 18%, 72%, 100% { transform: translateY(0) scale(1); }
    31% { transform: translateY(-1.8px) scale(1.025); }
    42% { transform: translateY(.2px) scale(1); }
}

/* Tier 4 uses the same signature fonts as Tier 2/3. */
.milk-title:is(.milk-title-tier-4).milk-title-font-dreamer { font-family:'Cookie',cursive; font-size:1.28em; font-weight:400; letter-spacing:.01em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-fairy { font-family:'Emilys Candy',Georgia,serif; font-size:1.06em; font-weight:400; letter-spacing:.025em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-magical { font-family:'Mystery Quest',Georgia,serif !important; font-size:1.06em; font-weight:400 !important; letter-spacing:.015em !important; }
.milk-title:is(.milk-title-tier-4).milk-title-font-witchy { font-family:'Imperial Script',cursive; font-size:1.34em; font-weight:400; letter-spacing:.01em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-cozy { font-family:'DynaPuff',sans-serif; font-size:.96em; font-weight:600; letter-spacing:.005em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-gothic { font-family:'UnifrakturCook',Georgia,serif; font-size:1.08em; font-weight:700; letter-spacing:.02em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-pixel { font-family:'Bitcount Grid Double',ui-monospace,monospace; font-size:1em; font-weight:400; letter-spacing:.015em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-moonlit { font-family:'Parisienne',cursive; font-size:1.28em; font-weight:400; letter-spacing:.01em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-whimsical { font-family:'Griffy',Georgia,serif; font-size:1.06em; font-weight:400; letter-spacing:.025em; }
.milk-title:is(.milk-title-tier-4).milk-title-font-enchanted { font-family:'Montez',cursive; font-size:1.3em; font-weight:400; letter-spacing:.01em; }

.post-mini-title > .milk-title-tier-4 { font-style:normal; font-variant:normal; text-transform:none !important; white-space:nowrap; }
.post-mini-title > .milk-title-tier-4 > .milk-title-ink {
    filter:
        saturate(1.4)
        contrast(1.12)
        drop-shadow(0 -.65px 0 rgba(255,255,255,.42))
        drop-shadow(0 1px 0 rgba(52,34,47,.52))
        drop-shadow(0 1.8px .8px rgba(52,34,47,.25)) !important;
}
.post-mini-title > .milk-title-tier-4.milk-title-font-dreamer { font-size:1.12rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-fairy { font-size:.86rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-magical { font-size:.9rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-witchy { font-size:1.16rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-cozy { font-size:.78rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-gothic { font-size:.9rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-pixel { font-size:.8rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-moonlit { font-size:1.12rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-whimsical { font-size:.88rem !important; }
.post-mini-title > .milk-title-tier-4.milk-title-font-enchanted { font-size:1.14rem !important; }

@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-4 > .milk-title-ink,
    .milk-title-tier-4 .milk-title-letter {
        animation: none !important;
        transform: none !important;
        background-position: 50% 50% !important;
    }
}
.site-animations-off .milk-title-tier-4 > .milk-title-ink,
.site-animations-off .milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    transform: none !important;
    background-position: 50% 50% !important;
}

/* Tier 4 visibility fix
   The title is split into individual spans, so the gradient must be painted on
   each letter rather than clipped on the flex parent. */
.milk-title-tier-4 > .milk-title-ink {
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: currentColor !important;
    color: inherit !important;
    animation: none !important;
    filter: none !important;
}

.milk-title-tier-4 .milk-title-letter {
    --title-tier4-deep-start: color-mix(in srgb, var(--title-gradient-start, #d8b6d3) 68%, #56334d 32%);
    --title-tier4-deep-end: color-mix(in srgb, var(--title-gradient-end, #d1d2dd) 68%, #3e506f 32%);
    background-image: linear-gradient(
        90deg,
        var(--title-tier4-deep-start) 0%,
        var(--title-gradient-end, #d1d2dd) 25%,
        var(--title-tier4-deep-end) 50%,
        var(--title-gradient-start, #d8b6d3) 75%,
        var(--title-tier4-deep-start) 100%
    ) !important;
    background-size: 220% 100% !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    filter:
        saturate(1.34)
        contrast(1.1)
        drop-shadow(0 -1px 0 rgba(255,255,255,.4))
        drop-shadow(0 1.4px 0 rgba(52,34,47,.46))
        drop-shadow(0 2.2px 1.2px rgba(52,34,47,.22)) !important;
}

.milk-title-font-dreamer.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-float-wave 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-fairy.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-flutter 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-magical.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-cascade 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-witchy.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-sway 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-cozy.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-squish 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-gothic.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-rise 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-pixel.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-pixel-step 5.6s steps(2, end) infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-moonlit.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-moon-drift 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-bouncy 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .09s + (var(--letter-index, 0) % 2) * .12s);
}
.milk-title-font-enchanted.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-ripple 5.6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}

@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-4 .milk-title-letter {
        animation: none !important;
        background-position: 50% 50% !important;
        transform: none !important;
    }
}
.site-animations-off .milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    background-position: 50% 50% !important;
    transform: none !important;
}


/* Batch two title families: Haunted, Mossy, Electric, Petal, and Blushing. */
.milk-title.milk-title-font-haunted {
    font-family: 'Eater', Georgia, serif !important;
    font-size: 1.02em;
    font-weight: 400 !important;
    letter-spacing: .025em !important;
}
.milk-title.milk-title-font-mossy {
    font-family: 'Croissant One', Georgia, serif !important;
    font-size: 1.01em;
    font-weight: 400 !important;
    letter-spacing: .01em !important;
}
.milk-title.milk-title-font-electric {
    font-family: 'Audiowide', ui-sans-serif, sans-serif !important;
    font-size: .88em;
    font-weight: 400 !important;
    letter-spacing: .035em !important;
}
.milk-title.milk-title-font-petal {
    font-family: 'Berkshire Swash', Georgia, serif !important;
    font-size: 1.08em;
    font-weight: 400 !important;
    letter-spacing: .012em !important;
}
.milk-title.milk-title-font-blushing {
    font-family: 'Petit Formal Script', cursive !important;
    font-size: 1.18em;
    font-weight: 400 !important;
    letter-spacing: .01em !important;
}

.post-mini-title > .milk-title.milk-title-font-haunted { font-size: .82rem !important; }
.post-mini-title > .milk-title.milk-title-font-mossy { font-size: .8rem !important; }
.post-mini-title > .milk-title.milk-title-font-electric { font-size: .68rem !important; letter-spacing: .025em !important; }
.post-mini-title > .milk-title.milk-title-font-petal { font-size: .9rem !important; }
.post-mini-title > .milk-title.milk-title-font-blushing { font-size: 1rem !important; }

.profile-display-title .milk-title.milk-title-font-haunted { font-size: 1.2em !important; }
.profile-display-title .milk-title.milk-title-font-mossy { font-size: 1.16em !important; }
.profile-display-title .milk-title.milk-title-font-electric { font-size: .98em !important; }
.profile-display-title .milk-title.milk-title-font-petal { font-size: 1.24em !important; }
.profile-display-title .milk-title.milk-title-font-blushing { font-size: 1.34em !important; }

/* Tier 4 personalities for the second title batch. */
.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-haunted-drift 6.2s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .12s);
}
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-mossy-sway 6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .1s);
}
.milk-title-font-electric.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-electric-step 5.8s steps(2, end) infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .08s);
}
.milk-title-font-petal.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-petal-open 6s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .11s);
}
.milk-title-font-blushing.milk-title-tier-4 .milk-title-letter {
    animation: milk-title-gradient-flow 7.2s linear infinite, milk-letter-blushing-flutter 6.1s ease-in-out infinite;
    animation-delay: 0s, calc(var(--letter-index, 0) * .105s);
}

@keyframes milk-letter-haunted-drift {
    0%, 18%, 72%, 100% { transform: translate(0, 0); }
    31% { transform: translate(.35px, -2px); }
    43% { transform: translate(-.25px, -.45px); }
}
@keyframes milk-letter-mossy-sway {
    0%, 18%, 72%, 100% { transform: translateY(0) rotate(0); }
    31% { transform: translateY(-1.25px) rotate(-1.6deg); }
    44% { transform: translateY(.2px) rotate(1.1deg); }
}
@keyframes milk-letter-electric-step {
    0%, 20%, 72%, 100% { transform: translate(0, 0); }
    30% { transform: translate(0, -2px); }
    36% { transform: translate(1px, -2px); }
    43% { transform: translate(-1px, 0); }
    49% { transform: translate(0, 0); }
}
@keyframes milk-letter-petal-open {
    0%, 18%, 72%, 100% { transform: translateY(0) scale(1); }
    31% { transform: translateY(-1.7px) scale(1.045, .98); }
    43% { transform: translateY(.2px) scale(.99, 1.025); }
}
@keyframes milk-letter-blushing-flutter {
    0%, 20%, 72%, 100% { transform: translateY(0) rotate(0); }
    31% { transform: translateY(-1.65px) rotate(-1.3deg); }
    39% { transform: translateY(-.45px) rotate(1deg); }
    47% { transform: translateY(0) rotate(0); }
}


/* Title tier corrections
   Tier 0 and Tier 1 intentionally use Milk's normal interface typeface.
   Signature fonts begin at Tier 2 and remain available in higher tiers. */
.milk-title.milk-title-tier-0,
.milk-title.milk-title-tier-1,
.post-mini-title > .milk-title.milk-title-tier-0,
.post-mini-title > .milk-title.milk-title-tier-1,
.profile-display-title .milk-title.milk-title-tier-0,
.profile-display-title .milk-title.milk-title-tier-1 {
    font-family: inherit !important;
    font-style: normal !important;
    font-weight: 800 !important;
    letter-spacing: .025em !important;
}
.post-mini-title > .milk-title.milk-title-tier-0,
.post-mini-title > .milk-title.milk-title-tier-1 {
    font-size: .78rem !important;
    line-height: 1.22 !important;
}
.profile-display-title .milk-title.milk-title-tier-0,
.profile-display-title .milk-title.milk-title-tier-1 {
    font-size: 1.24em !important;
    line-height: 1.2 !important;
}

/* Tier 4 gradient correction
   Paint one continuous living gradient across the whole word. Individual
   letters only animate their position, preventing the broken per-letter
   gradient/zipper effect. */
.milk-title-tier-4 > .milk-title-ink {
    display: inline-block !important;
    background-image: linear-gradient(
        90deg,
        var(--title-tier4-deep-start, var(--title-gradient-start, #d8b6d3)) 0%,
        var(--title-gradient-end, #d1d2dd) 25%,
        var(--title-tier4-deep-end, var(--title-gradient-end, #d1d2dd)) 50%,
        var(--title-gradient-start, #d8b6d3) 75%,
        var(--title-tier4-deep-start, var(--title-gradient-start, #d8b6d3)) 100%
    ) !important;
    background-size: 220% 100% !important;
    background-color: transparent !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    animation: milk-title-gradient-flow 7.2s linear infinite !important;
    filter:
        saturate(1.34)
        contrast(1.1)
        drop-shadow(0 -1px 0 rgba(255,255,255,.4))
        drop-shadow(0 1.4px 0 rgba(52,34,47,.46))
        drop-shadow(0 2.2px 1.2px rgba(52,34,47,.22)) !important;
}
.milk-title-tier-4 .milk-title-letter {
    display: inline-block;
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    filter: none !important;
    will-change: transform;
    animation-duration: 5.8s !important;
    animation-timing-function: ease-in-out !important;
    animation-iteration-count: infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .11s) !important;
}
.milk-title-font-dreamer.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-float-wave !important; }
.milk-title-font-fairy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-flutter !important; }
.milk-title-font-magical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-cascade !important; }
.milk-title-font-witchy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-sway !important; }
.milk-title-font-cozy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-squish !important; }
.milk-title-font-gothic.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-rise !important; }
.milk-title-font-pixel.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-pixel-step !important; animation-timing-function: steps(2,end) !important; }
.milk-title-font-moonlit.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-moon-drift !important; }
.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-bouncy !important; }
.milk-title-font-enchanted.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-ripple !important; }
.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-haunted-drift !important; }
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-mossy-sway !important; }
.milk-title-font-electric.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-electric-step !important; animation-timing-function: steps(2,end) !important; }
.milk-title-font-petal.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-petal-open !important; }
.milk-title-font-blushing.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-blushing-flutter !important; }

/* Respect both operating-system and per-account motion preferences. */
@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-3 > .milk-title-ink,
    .milk-title-tier-4 > .milk-title-ink,
    .milk-title-tier-4 .milk-title-letter {
        animation: none !important;
        transform: none !important;
        background-position: 50% 50% !important;
    }
}
.site-animations-off .milk-title-tier-3 > .milk-title-ink,
.site-animations-off .milk-title-tier-4 > .milk-title-ink,
.site-animations-off .milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    transform: none !important;
    background-position: 50% 50% !important;
}


/* Tier 4 visibility + shared-gradient correction
   Parent background-clip cannot paint through descendant letter spans in
   Chromium/WebKit. Each letter therefore owns a synchronized slice of the
   same repeated gradient. The motion remains word-coherent instead of each
   character running an unrelated miniature gradient. */
.milk-title-tier-4 > .milk-title-ink {
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: initial !important;
    color: inherit !important;
    animation: none !important;
    filter: none !important;
}

.milk-title-tier-4 .milk-title-letter {
    --tier4-gradient-start: 0%;
    --tier4-gradient-end: 200%;
    background-image: linear-gradient(
        90deg,
        var(--title-tier4-deep-start, var(--title-gradient-start, #d8b6d3)) 0%,
        var(--title-gradient-end, #d1d2dd) 25%,
        var(--title-tier4-deep-end, var(--title-gradient-end, #d1d2dd)) 50%,
        var(--title-gradient-start, #d8b6d3) 75%,
        var(--title-tier4-deep-start, var(--title-gradient-start, #d8b6d3)) 100%
    ) !important;
    background-size: 420% 100% !important;
    background-position: var(--tier4-gradient-start) 50%;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    filter:
        saturate(1.34)
        contrast(1.1)
        drop-shadow(0 -1px 0 rgba(255,255,255,.4))
        drop-shadow(0 1.4px 0 rgba(52,34,47,.46))
        drop-shadow(0 2.2px 1.2px rgba(52,34,47,.22)) !important;
    animation-duration: 5.8s, 7.2s !important;
    animation-timing-function: ease-in-out, linear !important;
    animation-iteration-count: infinite, infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .11s), 0s !important;
}

/* Append the shared gradient motion to each title's letter-motion animation. */
.milk-title-font-dreamer.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-float-wave, milk-tier4-shared-gradient !important; }
.milk-title-font-fairy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-flutter, milk-tier4-shared-gradient !important; }
.milk-title-font-magical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-cascade, milk-tier4-shared-gradient !important; }
.milk-title-font-witchy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-sway, milk-tier4-shared-gradient !important; }
.milk-title-font-cozy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-squish, milk-tier4-shared-gradient !important; }
.milk-title-font-gothic.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-rise, milk-tier4-shared-gradient !important; }
.milk-title-font-pixel.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-pixel-step, milk-tier4-shared-gradient !important; animation-timing-function: steps(2,end), linear !important; }
.milk-title-font-moonlit.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-moon-drift, milk-tier4-shared-gradient !important; }
.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-bouncy, milk-tier4-shared-gradient !important; }
.milk-title-font-enchanted.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-ripple, milk-tier4-shared-gradient !important; }
.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-haunted-drift, milk-tier4-shared-gradient !important; }
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-mossy-sway, milk-tier4-shared-gradient !important; }
.milk-title-font-electric.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-electric-step, milk-tier4-shared-gradient !important; animation-timing-function: steps(2,end), linear !important; }
.milk-title-font-petal.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-petal-open, milk-tier4-shared-gradient !important; }
.milk-title-font-blushing.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-blushing-flutter, milk-tier4-shared-gradient !important; }

@keyframes milk-tier4-shared-gradient {
    from { background-position: var(--tier4-gradient-start) 50%; }
    to { background-position: var(--tier4-gradient-end) 50%; }
}

@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-4 .milk-title-letter {
        animation: none !important;
        transform: none !important;
        background-position: var(--tier4-gradient-start) 50% !important;
    }
}
.site-animations-off .milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    transform: none !important;
    background-position: var(--tier4-gradient-start) 50% !important;
}


/* Tier 4 gradient motion repair
   Explicit percentage endpoints are assigned by JavaScript for each letter.
   This avoids invalid calc(unitless * %) keyframes in Chromium/WebKit. */
.milk-title-tier-4 .milk-title-letter {
    background-size: 520% 100% !important;
}

@keyframes milk-tier4-shared-gradient {
    from { background-position: var(--tier4-gradient-start, 0%) 50%; }
    to { background-position: var(--tier4-gradient-end, 200%) 50%; }
}

/* Tier 4 layered rendering — reliable continuous gradient + independent letters
   ---------------------------------------------------------------------------
   The full word is painted once on ::before, so its living gradient remains a
   single uninterrupted animation. The real letter spans stay in normal flow
   and animate only their dimensional highlight/shadow. */
.milk-title-tier-4 > .milk-title-ink {
    position: relative !important;
    display: inline-flex !important;
    align-items: baseline;
    isolation: isolate;
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: initial !important;
    color: inherit !important;
    animation: none !important;
    filter: none !important;
    overflow: visible !important;
}

.milk-title-tier-4 > .milk-title-ink::before {
    content: attr(data-title-text);
    position: absolute;
    inset: 0 auto auto 0;
    z-index: 0;
    display: block;
    width: max-content;
    min-width: 100%;
    font: inherit;
    font-kerning: inherit;
    font-variant: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    white-space: pre;
    pointer-events: none;

    --title-tier4-deep-start: color-mix(in srgb, var(--title-gradient-start, #d8b6d3) 68%, #56334d 32%);
    --title-tier4-deep-end: color-mix(in srgb, var(--title-gradient-end, #d1d2dd) 68%, #3e506f 32%);
    background-image: linear-gradient(
        90deg,
        var(--title-tier4-deep-start) 0%,
        var(--title-gradient-end, #d1d2dd) 12.5%,
        var(--title-tier4-deep-end) 25%,
        var(--title-gradient-start, #d8b6d3) 37.5%,
        var(--title-tier4-deep-start) 50%,
        var(--title-gradient-end, #d1d2dd) 62.5%,
        var(--title-tier4-deep-end) 75%,
        var(--title-gradient-start, #d8b6d3) 87.5%,
        var(--title-tier4-deep-start) 100%
    ) !important;
    background-size: 200% 100% !important;
    background-position: 0% 50%;
    background-repeat: repeat-x;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    filter:
        saturate(1.34)
        contrast(1.1)
        drop-shadow(0 -1px 0 rgba(255,255,255,.38))
        drop-shadow(0 1.35px 0 rgba(52,34,47,.46))
        drop-shadow(0 2.1px 1.1px rgba(52,34,47,.2)) !important;
    animation: milk-title-gradient-flow 7.2s linear infinite !important;
    will-change: background-position;
}

/* The spans reserve the exact word width and carry only the dimensional motion.
   Their transparent fill lets the one-piece gradient underneath remain visible. */
.milk-title-tier-4 .milk-title-letter {
    position: relative;
    z-index: 1;
    display: inline-block;
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
    -webkit-text-stroke: .22px color-mix(in srgb, var(--title-gradient-end, #d1d2dd) 48%, rgba(255,255,255,.32));
    text-shadow:
        0 -.45px 0 rgba(255,255,255,.3),
        0 1px 0 color-mix(in srgb, var(--title-gradient-start, #d8b6d3) 55%, rgba(54,35,48,.35)),
        0 1.8px 1px rgba(54,35,48,.16);
    filter: none !important;
    will-change: transform;
    animation-duration: 5.8s !important;
    animation-timing-function: ease-in-out !important;
    animation-iteration-count: infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .11s) !important;
}

.milk-title-font-dreamer.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-float-wave !important; }
.milk-title-font-fairy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-flutter !important; }
.milk-title-font-magical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-cascade !important; }
.milk-title-font-witchy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-sway !important; }
.milk-title-font-cozy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-squish !important; }
.milk-title-font-gothic.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-rise !important; }
.milk-title-font-pixel.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-pixel-step !important; animation-timing-function: steps(2,end) !important; }
.milk-title-font-moonlit.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-moon-drift !important; }
.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-bouncy !important; }
.milk-title-font-enchanted.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-ripple !important; }
.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-haunted-drift !important; }
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-mossy-sway !important; }
.milk-title-font-electric.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-electric-step !important; animation-timing-function: steps(2,end) !important; }
.milk-title-font-petal.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-petal-open !important; }
.milk-title-font-blushing.milk-title-tier-4 .milk-title-letter { animation-name: milk-letter-blushing-flutter !important; }

@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-4 > .milk-title-ink::before,
    .milk-title-tier-4 .milk-title-letter {
        animation: none !important;
        transform: none !important;
    }
    .milk-title-tier-4 > .milk-title-ink::before {
        background-position: 50% 50% !important;
    }
}

.site-animations-off .milk-title-tier-4 > .milk-title-ink::before,
.site-animations-off .milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    transform: none !important;
}
.site-animations-off .milk-title-tier-4 > .milk-title-ink::before {
    background-position: 50% 50% !important;
}

/* -------------------------------------------------------------------------
   Tier 4 effect variety pass
   Tier 3 owns the living gradient. Tier 4 keeps that gradient and adds a
   title-specific premium finish/motion, rather than fifteen versions of the
   same letter bounce.
   ------------------------------------------------------------------------- */

/* Reset the older one-size-fits-most letter animation assignments. */
.milk-title-tier-4 .milk-title-letter {
    animation-name: none !important;
    animation-duration: 1s !important;
    animation-delay: 0s !important;
    animation-timing-function: ease-in-out !important;
    animation-iteration-count: infinite !important;
    transform-origin: 50% 75%;
}

/* A reusable duplicate text layer for shine, ghosts, neon, and color washes. */
.milk-title-tier-4 > .milk-title-ink::after {
    content: attr(data-title-text);
    position: absolute;
    inset: 0 auto auto 0;
    z-index: 2;
    display: block;
    width: max-content;
    min-width: 100%;
    font: inherit;
    font-kerning: inherit;
    font-variant: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    white-space: pre;
    pointer-events: none;
    opacity: 0;
    color: transparent;
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
}

/* Dreamer — slow breathing float. */
.milk-title-font-dreamer.milk-title-tier-4 > .milk-title-ink {
    animation: milk-t4-dreamer-float 6.8s ease-in-out infinite !important;
}
@keyframes milk-t4-dreamer-float {
    0%, 18%, 82%, 100% { transform: translateY(0) scale(1); }
    42% { transform: translateY(-1.6px) scale(1.012); }
    58% { transform: translateY(-1.1px) scale(1.006); }
}

/* Fairy — mostly still lettering with tiny travelling glints. */
.milk-title-font-fairy.milk-title-tier-4 > .milk-title-ink::after {
    opacity: 1;
    background-image: linear-gradient(
        105deg,
        transparent 0 38%,
        rgba(255,255,255,0) 42%,
        rgba(255,255,255,.98) 48%,
        rgba(255,255,255,.18) 53%,
        transparent 58% 100%
    );
    background-size: 260% 100%;
    filter: drop-shadow(0 0 1.5px rgba(255,255,255,.9));
    animation: milk-t4-fairy-glint 5.9s linear infinite !important;
}
@keyframes milk-t4-fairy-glint {
    0%, 16% { background-position: 180% 50%; opacity: 0; }
    22% { opacity: .95; }
    47% { background-position: -70% 50%; opacity: .9; }
    53%, 100% { background-position: -70% 50%; opacity: 0; }
}

/* Magical — polished enamel with a clean diagonal glare sweep. */
.milk-title-font-magical.milk-title-tier-4 > .milk-title-ink::after {
    opacity: 1;
    background-image: linear-gradient(
        115deg,
        transparent 0 40%,
        rgba(255,255,255,.12) 44%,
        rgba(255,255,255,1) 49%,
        rgba(255,255,255,.18) 54%,
        transparent 59% 100%
    );
    background-size: 300% 100%;
    filter: drop-shadow(0 0 1px rgba(255,255,255,.6));
    animation: milk-t4-magical-glare 6.4s linear infinite !important;
}
@keyframes milk-t4-magical-glare {
    0%, 18% { background-position: 170% 50%; opacity: 0; }
    24% { opacity: .9; }
    48% { background-position: -65% 50%; opacity: .9; }
    54%, 100% { background-position: -65% 50%; opacity: 0; }
}

/* Witchy — smoky candlelight flicker, almost no physical movement. */
.milk-title-font-witchy.milk-title-tier-4 > .milk-title-ink::before {
    animation:
        milk-title-gradient-flow 7.2s linear infinite,
        milk-t4-witchy-flicker 4.9s steps(1,end) infinite !important;
}
@keyframes milk-t4-witchy-flicker {
    0%, 19%, 23%, 61%, 65%, 100% {
        filter: saturate(1.28) contrast(1.08)
            drop-shadow(0 -1px 0 rgba(255,255,255,.25))
            drop-shadow(0 1.4px 0 rgba(52,34,47,.48))
            drop-shadow(0 0 1.2px rgba(122,76,118,.28)) !important;
        opacity: 1;
    }
    20%, 62% {
        filter: saturate(1.42) contrast(1.12)
            drop-shadow(0 -1px 0 rgba(255,255,255,.34))
            drop-shadow(0 1.4px 0 rgba(52,34,47,.5))
            drop-shadow(0 0 3px rgba(151,92,145,.62)) !important;
        opacity: .94;
    }
    22%, 64% { opacity: .82; }
}

/* Cozy — padded, gentle squash-and-rebound. */
.milk-title-font-cozy.milk-title-tier-4 > .milk-title-ink {
    animation: milk-t4-cozy-squish 6.6s ease-in-out infinite !important;
}
@keyframes milk-t4-cozy-squish {
    0%, 24%, 74%, 100% { transform: scale(1,1); }
    38% { transform: scale(1.035,.955); }
    49% { transform: scale(.99,1.025); }
    59% { transform: scale(1.012,.992); }
}

/* Gothic — dimensional shadow grows and retracts while text stays steady. */
.milk-title-font-gothic.milk-title-tier-4 .milk-title-letter {
    animation: milk-t4-gothic-shadow 6.2s ease-in-out infinite !important;
}
@keyframes milk-t4-gothic-shadow {
    0%, 20%, 78%, 100% {
        text-shadow:
            0 -.45px 0 rgba(255,255,255,.22),
            0 1px 0 rgba(63,17,39,.72),
            0 2px 1px rgba(40,9,24,.22);
        transform: translateY(0);
    }
    46% {
        text-shadow:
            0 -.45px 0 rgba(255,255,255,.3),
            0 2.2px 0 rgba(88,20,50,.82),
            0 4.4px 2.2px rgba(40,9,24,.38);
        transform: translateY(-.5px);
    }
}

/* Pixel — rare, controlled horizontal glitch with long calm periods. */
.milk-title-font-pixel.milk-title-tier-4 > .milk-title-ink {
    animation: milk-t4-pixel-glitch 7.4s steps(1,end) infinite !important;
}
.milk-title-font-pixel.milk-title-tier-4 > .milk-title-ink::after {
    opacity: 0;
    background-image: linear-gradient(90deg, #72f1ff, #cf8cff, #72f1ff);
    background-size: 200% 100%;
    animation: milk-t4-pixel-echo 7.4s steps(1,end) infinite !important;
}
@keyframes milk-t4-pixel-glitch {
    0%, 54%, 57%, 61%, 100% { transform: translate(0,0); }
    55% { transform: translate(1px,0); }
    56% { transform: translate(-1px,.5px); }
    59% { transform: translate(.5px,-.5px); }
}
@keyframes milk-t4-pixel-echo {
    0%, 54%, 61%, 100% { opacity: 0; transform: translate(0); }
    55% { opacity: .55; transform: translate(-1.5px,.5px); }
    56% { opacity: .38; transform: translate(1.5px,-.5px); }
    59% { opacity: .45; transform: translate(-1px,0); }
}

/* Moonlit — a narrow moon-silver highlight, without the old screen wipe. */
.milk-title-font-moonlit.milk-title-tier-4 > .milk-title-ink::after {
    opacity: 1;
    background-image: linear-gradient(
        100deg,
        transparent 0 45%,
        rgba(235,244,255,.08) 47%,
        rgba(245,248,255,.92) 50%,
        rgba(206,220,255,.12) 53%,
        transparent 55% 100%
    );
    background-size: 360% 100%;
    filter: drop-shadow(0 0 1px rgba(214,226,255,.55));
    animation: milk-t4-moonlit-shimmer 8.2s linear infinite !important;
}
@keyframes milk-t4-moonlit-shimmer {
    0%, 28% { background-position: 150% 50%; opacity: 0; }
    34% { opacity: .82; }
    55% { background-position: -45% 50%; opacity: .82; }
    61%, 100% { background-position: -45% 50%; opacity: 0; }
}

/* Whimsical — restrained whole-word jello wobble. */
.milk-title-font-whimsical.milk-title-tier-4 > .milk-title-ink {
    animation: milk-t4-whimsical-jello 7s ease-in-out infinite !important;
}
@keyframes milk-t4-whimsical-jello {
    0%, 28%, 72%, 100% { transform: skewX(0) scale(1); }
    40% { transform: skewX(-3deg) scale(1.012,.99); }
    48% { transform: skewX(2.2deg) scale(.995,1.01); }
    56% { transform: skewX(-1.2deg) scale(1.005,.998); }
    63% { transform: skewX(.5deg); }
}

/* Enchanted — opalescent hue bloom and tiny graceful scale. */
.milk-title-font-enchanted.milk-title-tier-4 > .milk-title-ink {
    animation: milk-t4-enchanted-bloom 7.6s ease-in-out infinite !important;
}
.milk-title-font-enchanted.milk-title-tier-4 > .milk-title-ink::before {
    animation:
        milk-title-gradient-flow 7.2s linear infinite,
        milk-t4-enchanted-hue 7.6s ease-in-out infinite !important;
}
@keyframes milk-t4-enchanted-bloom {
    0%, 22%, 78%, 100% { transform: scale(1); }
    49% { transform: scale(1.025); }
}
@keyframes milk-t4-enchanted-hue {
    0%, 100% { filter: saturate(1.25) hue-rotate(0deg) drop-shadow(0 1.4px 1px rgba(78,62,96,.26)) !important; }
    50% { filter: saturate(1.48) hue-rotate(13deg) drop-shadow(0 1.4px 1px rgba(78,62,96,.34)) drop-shadow(0 0 2px rgba(184,234,216,.45)) !important; }
}

/* Haunted — translucent duplicate drifts upward and disappears. */
.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after {
    opacity: 0;
    background-image: linear-gradient(90deg, rgba(208,198,235,.8), rgba(180,202,218,.72));
    filter: blur(.15px) drop-shadow(0 0 2px rgba(155,146,190,.35));
    animation: milk-t4-haunted-ghost 6.9s ease-out infinite !important;
}
@keyframes milk-t4-haunted-ghost {
    0%, 24% { opacity: 0; transform: translateY(0) scale(1); }
    31% { opacity: .52; }
    58% { opacity: 0; transform: translateY(-3.2px) scale(1.015); }
    59%, 100% { opacity: 0; transform: translateY(0) scale(1); }
}

/* Mossy — alternating stem-like sway. */
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter {
    animation: milk-t4-mossy-sway 6.8s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * -.18s) !important;
}
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter:nth-child(even) {
    animation-direction: reverse !important;
}
@keyframes milk-t4-mossy-sway {
    0%, 22%, 78%, 100% { transform: rotate(0deg) translateY(0); }
    44% { transform: rotate(-1.8deg) translateY(-.5px); }
    58% { transform: rotate(1.1deg) translateY(0); }
}

/* Electric — glow charges left-to-right, then one tiny release flicker. */
.milk-title-font-electric.milk-title-tier-4 .milk-title-letter {
    animation: milk-t4-electric-charge 6.4s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .09s) !important;
}
@keyframes milk-t4-electric-charge {
    0%, 20%, 72%, 100% {
        text-shadow: 0 1px 0 rgba(39,39,75,.38), 0 0 0 rgba(74,230,255,0);
        transform: translateX(0);
    }
    42% {
        text-shadow: 0 1px 0 rgba(39,39,75,.42), 0 0 3px rgba(74,230,255,.85), 0 0 5px rgba(179,95,255,.45);
        transform: translateX(0);
    }
    53% { transform: translateX(.7px); }
    55% { transform: translateX(-.7px); }
    57% { transform: translateX(0); }
}

/* Petal — letters gently open outward and return. */
.milk-title-font-petal.milk-title-tier-4 > .milk-title-ink {
    animation: milk-t4-petal-bloom 7.1s ease-in-out infinite !important;
}
@keyframes milk-t4-petal-bloom {
    0%, 24%, 78%, 100% { column-gap: 0; transform: scaleX(1); }
    48% { column-gap: .045em; transform: scaleX(1.015); }
    62% { column-gap: .018em; transform: scaleX(1.006); }
}

/* Blushing — warm rose wash plus one tiny shy dip. */
.milk-title-font-blushing.milk-title-tier-4 > .milk-title-ink {
    animation: milk-t4-blushing-dip 7.3s ease-in-out infinite !important;
}
.milk-title-font-blushing.milk-title-tier-4 > .milk-title-ink::after {
    opacity: 1;
    background-image: linear-gradient(
        100deg,
        transparent 0 34%,
        rgba(255,152,180,0) 40%,
        rgba(255,151,178,.8) 49%,
        rgba(255,191,205,.2) 57%,
        transparent 64% 100%
    );
    background-size: 260% 100%;
    animation: milk-t4-blushing-wash 7.3s ease-in-out infinite !important;
}
@keyframes milk-t4-blushing-dip {
    0%, 26%, 74%, 100% { transform: translateY(0) rotate(0); }
    48% { transform: translateY(1px) rotate(-.45deg); }
    57% { transform: translateY(.35px) rotate(.18deg); }
}
@keyframes milk-t4-blushing-wash {
    0%, 24% { background-position: 160% 50%; opacity: 0; }
    34% { opacity: .75; }
    59% { background-position: -55% 50%; opacity: .72; }
    67%, 100% { background-position: -55% 50%; opacity: 0; }
}

/* Accessibility: preserve the premium dimensional finish while disabling all
   decorative motion for either OS-level or the member's personal preference. */
@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-4 > .milk-title-ink,
    .milk-title-tier-4 > .milk-title-ink::before,
    .milk-title-tier-4 > .milk-title-ink::after,
    .milk-title-tier-4 .milk-title-letter {
        animation: none !important;
        transform: none !important;
    }
    .milk-title-tier-4 > .milk-title-ink::after { opacity: 0 !important; }
    .milk-title-tier-4 > .milk-title-ink::before { background-position: 50% 50% !important; }
}

.site-animations-off .milk-title-tier-4 > .milk-title-ink,
.site-animations-off .milk-title-tier-4 > .milk-title-ink::before,
.site-animations-off .milk-title-tier-4 > .milk-title-ink::after,
.site-animations-off .milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    transform: none !important;
}
.site-animations-off .milk-title-tier-4 > .milk-title-ink::after { opacity: 0 !important; }
.site-animations-off .milk-title-tier-4 > .milk-title-ink::before { background-position: 50% 50% !important; }

/* Tier 4 motion refinement · no shared heartbeat
   Most titles now keep their glyph geometry stable. Variety comes from light,
   shadow, tracking, tilt, trails, and rare accents instead of repeated scaling. */
.milk-title-tier-4 .milk-title-letter {
    transform: none;
    transform-origin: center;
}

/* Dreamer: one slow, weightless drift across the whole word. */
.milk-title-font-dreamer.milk-title-tier-4 > .milk-title-ink {
    animation: milk-title-gradient-flow 7.2s linear infinite,
               milk-tier4-dreamer-drift 9s ease-in-out infinite !important;
}
.milk-title-font-dreamer.milk-title-tier-4 .milk-title-letter { animation: none !important; }
@keyframes milk-tier4-dreamer-drift {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-1.5px); }
}

/* Fairy: tiny staggered glints, no bouncing. */
.milk-title-font-fairy.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-fairy-glint 6.8s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .23s) !important;
}
@keyframes milk-tier4-fairy-glint {
    0%, 22%, 34%, 100% { filter: brightness(1) drop-shadow(0 0 0 transparent); }
    27% { filter: brightness(1.7) drop-shadow(0 0 2px rgba(255,255,255,.95)); }
}

/* Magical: a calm polished shine, driven by brightness rather than scale. */
.milk-title-font-magical.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-magical-shine 7.6s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .12s) !important;
}
@keyframes milk-tier4-magical-shine {
    0%, 18%, 42%, 100% { filter: brightness(1) saturate(1); }
    29% { filter: brightness(1.38) saturate(1.18); }
}

/* Witchy: irregular candle flicker in the shadow and glow only. */
.milk-title-font-witchy.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-witchy-flicker 5.9s steps(1, end) infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .08s) !important;
}
@keyframes milk-tier4-witchy-flicker {
    0%, 24%, 27%, 61%, 64%, 100% { filter: brightness(1) drop-shadow(0 1px 0 rgba(53,31,50,.45)); }
    25%, 62% { filter: brightness(1.2) drop-shadow(0 1px 2px rgba(133,91,126,.55)); }
    26%, 63% { filter: brightness(.92) drop-shadow(0 1px 0 rgba(53,31,50,.35)); }
}

/* Cozy is intentionally the only true squash-and-stretch title. */
.milk-title-font-cozy.milk-title-tier-4 > .milk-title-ink {
    transform-origin: center bottom;
    animation: milk-title-gradient-flow 7.2s linear infinite,
               milk-tier4-cozy-squish 8.5s ease-in-out infinite !important;
}
.milk-title-font-cozy.milk-title-tier-4 .milk-title-letter { animation: none !important; }
@keyframes milk-tier4-cozy-squish {
    0%, 68%, 100% { transform: scale(1); }
    76% { transform: scale(1.025,.975); }
    83% { transform: scale(.992,1.018); }
    90% { transform: scale(1); }
}

/* Gothic: the title stays still while its depth grows and retracts. */
.milk-title-font-gothic.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-gothic-shadow 8s ease-in-out infinite !important;
}
@keyframes milk-tier4-gothic-shadow {
    0%, 100% { filter: drop-shadow(0 1px 0 rgba(35,20,30,.55)); }
    48%, 58% { filter: drop-shadow(0 3px 1px rgba(35,20,30,.72)); }
}

/* Pixel: short, rare horizontal glitch rather than a rhythmic hop. */
.milk-title-font-pixel.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-pixel-glitch 9s steps(1, end) infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .035s) !important;
}
@keyframes milk-tier4-pixel-glitch {
    0%, 72%, 75%, 78%, 100% { transform: translateX(0); filter: none; }
    73% { transform: translateX(1px); filter: brightness(1.35); }
    74% { transform: translateX(-1px); }
    76% { transform: translateX(1px); }
    77% { transform: translateX(0); }
}

/* Moonlit: no geometry change; only a cool silver shimmer. */
.milk-title-font-moonlit.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-moon-shimmer 8.8s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .16s) !important;
}
@keyframes milk-tier4-moon-shimmer {
    0%, 20%, 42%, 100% { filter: brightness(1) drop-shadow(0 0 0 transparent); }
    31% { filter: brightness(1.42) drop-shadow(0 0 1.6px rgba(218,225,255,.9)); }
}

/* Whimsical: a restrained whole-word jello tilt, with no zooming. */
.milk-title-font-whimsical.milk-title-tier-4 > .milk-title-ink {
    transform-origin: center bottom;
    animation: milk-title-gradient-flow 7.2s linear infinite,
               milk-tier4-whimsical-wobble 9.4s ease-in-out infinite !important;
}
.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter { animation: none !important; }
@keyframes milk-tier4-whimsical-wobble {
    0%, 70%, 100% { transform: rotate(0deg) skewX(0deg); }
    76% { transform: rotate(-1.2deg) skewX(-1.4deg); }
    82% { transform: rotate(.9deg) skewX(1deg); }
    88% { transform: rotate(-.45deg) skewX(-.4deg); }
    93% { transform: rotate(0deg) skewX(0deg); }
}

/* Enchanted: opalescent color bloom only. */
.milk-title-font-enchanted.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-enchanted-bloom 9s ease-in-out infinite !important;
}
@keyframes milk-tier4-enchanted-bloom {
    0%, 100% { filter: hue-rotate(0deg) brightness(1); }
    50% { filter: hue-rotate(14deg) brightness(1.18); }
}

/* Haunted: ghostly trailing shadow drifting behind otherwise still letters. */
.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-haunted-trail 8.6s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .09s) !important;
}
@keyframes milk-tier4-haunted-trail {
    0%, 100% { filter: drop-shadow(0 0 0 rgba(170,181,210,0)); }
    45% { filter: drop-shadow(.6px -2px 1px rgba(170,181,210,.55)); }
    62% { filter: drop-shadow(-.4px -3px 2px rgba(170,181,210,0)); }
}

/* Mossy: alternating stem-like tilts, never a vertical bounce. */
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-mossy-sway 7.8s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * -.18s) !important;
    transform-origin: 50% 100%;
}
.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter:nth-child(even) {
    animation-direction: reverse !important;
}
@keyframes milk-tier4-mossy-sway {
    0%, 100% { transform: rotate(-1.1deg); }
    50% { transform: rotate(1.1deg); }
}

/* Electric: neon charge passes across letters, followed by one rare flicker. */
.milk-title-font-electric.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-electric-charge 7.4s steps(1, end) infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .14s) !important;
}
@keyframes milk-tier4-electric-charge {
    0%, 19%, 30%, 82%, 85%, 100% { filter: brightness(1) drop-shadow(0 0 1px rgba(121,211,255,.35)); }
    24% { filter: brightness(1.75) drop-shadow(0 0 4px rgba(151,108,255,.9)); }
    83% { filter: brightness(.72); }
    84% { filter: brightness(1.5) drop-shadow(0 0 3px rgba(121,211,255,.8)); }
}

/* Petal: letters gently open outward through tracking, not scaling. */
.milk-title-font-petal.milk-title-tier-4 > .milk-title-ink {
    animation: milk-title-gradient-flow 7.2s linear infinite,
               milk-tier4-petal-open 10s ease-in-out infinite !important;
}
.milk-title-font-petal.milk-title-tier-4 .milk-title-letter { animation: none !important; }
@keyframes milk-tier4-petal-open {
    0%, 64%, 100% { letter-spacing: .012em; }
    78% { letter-spacing: .075em; }
    90% { letter-spacing: .012em; }
}

/* Blushing: warm color wash and a shy shadow shift, no bounce. */
.milk-title-font-blushing.milk-title-tier-4 .milk-title-letter {
    animation: milk-tier4-blush-wash 8.2s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * .1s) !important;
}
@keyframes milk-tier4-blush-wash {
    0%, 22%, 48%, 100% { filter: saturate(1) brightness(1) drop-shadow(0 1px 0 rgba(100,58,82,.25)); }
    35% { filter: saturate(1.35) brightness(1.18) drop-shadow(1px 1px 1px rgba(190,104,137,.38)); }
}

@media (prefers-reduced-motion: reduce) {
    .milk-title-tier-4 > .milk-title-ink,
    .milk-title-tier-4 .milk-title-letter {
        animation: none !important;
        transform: none !important;
        filter: none !important;
        letter-spacing: inherit !important;
    }
}
.site-animations-off .milk-title-tier-4 > .milk-title-ink,
.site-animations-off .milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    transform: none !important;
    filter: none !important;
    letter-spacing: inherit !important;
}

/* -------------------------------------------------------------------------
   Haunted Tier 4 — CodePen ghost crossing
   Uses the same five-tail CSS silhouette as the selected CodePen, scaled for
   MILK's compact title badges. The ghost is a real child element so its tail
   is not clipped by the title's text-paint layer.
   ------------------------------------------------------------------------- */
.milk-title-font-haunted.milk-title-tier-4 {
    position: relative;
    isolation: isolate;
    overflow: visible !important;
}

.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink {
    overflow: visible !important;
}

/* Disable every older pseudo-element version of the Haunted ghost. */
.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after {
    content: none !important;
    display: none !important;
    animation: none !important;
}

/* Keep the lettering steady; the crossing ghost is the premium movement. */
.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    filter: drop-shadow(0 1px 0 rgba(48, 42, 69, .38));
}

/* Give the original five-piece tail room above and below compact badges. */
.post-mini-title:has(> .milk-title-font-haunted.milk-title-tier-4) {
    min-height: 2.25rem;
    padding-top: .55rem !important;
    padding-bottom: .55rem !important;
    overflow: visible !important;
}

.profile-display-title:has(.milk-title-font-haunted.milk-title-tier-4) {
    padding-top: .3rem !important;
    padding-bottom: .5rem !important;
    overflow: visible !important;
}

/* Same ghost construction as the reference: rounded head, three face marks,
   and five alternating tail pieces. It is simply scaled down for MILK. */
.milk-haunted-ghost {
    --ghost-body: rgba(244, 242, 250, .96);
    position: absolute;
    z-index: 8;
    top: 50%;
    left: -1.55rem;
    width: 16px;
    height: 24px;
    display: block;
    overflow: visible;
    pointer-events: none;
    opacity: 0;
    border-radius: 100% / 70% 70% 0 0;
    background-color: var(--ghost-body);
    background-image:
        radial-gradient(ellipse at 35% 40%, rgba(20, 17, 27, .95) 0 8%, transparent 9%),
        radial-gradient(ellipse at 65% 40%, rgba(20, 17, 27, .95) 0 8%, transparent 9%),
        radial-gradient(ellipse at 50% 60%, rgba(20, 17, 27, .95) 0 8%, transparent 9%);
    mix-blend-mode: exclusion;
    filter:
        drop-shadow(0 0 2px rgba(229, 222, 255, .72))
        drop-shadow(-3px 1px 3px rgba(114, 119, 159, .24));
    transform: translateY(-50%) rotate(-90deg);
    transform-origin: center;
    animation: milk-tier4-haunted-codepen-cross 9.6s ease-out infinite !important;
    will-change: left, top, opacity, transform;
}

.milk-haunted-ghost > span {
    position: absolute;
    width: 20%;
    display: block;
    background-color: var(--ghost-body);
}

.milk-haunted-ghost > span:nth-child(1) {
    height: 14px;
    left: 0;
    bottom: -12px;
    border-radius: 100% / 0 0 50% 50%;
}

.milk-haunted-ghost > span:nth-child(2),
.milk-haunted-ghost > span:nth-child(4) {
    height: 8px;
    left: 20%;
    bottom: -6px;
    border-radius: 100% / 50% 50% 0 0;
    background-color: transparent;
}

.milk-haunted-ghost > span:nth-child(3) {
    height: 8px;
    left: 40%;
    bottom: -7.9px;
    border-radius: 100% / 0 0 60% 60%;
}

.milk-haunted-ghost > span:nth-child(4) {
    left: 60%;
}

.milk-haunted-ghost > span:nth-child(5) {
    height: 6px;
    left: 80%;
    bottom: -5.8px;
    border-radius: 100% / 0 0 70% 70%;
}

@keyframes milk-tier4-haunted-codepen-cross {
    0%, 16% {
        left: -1.55rem;
        top: 56%;
        opacity: 0;
        transform: translateY(-50%) rotate(-90deg);
    }
    19% {
        opacity: .9;
    }
    31% {
        top: 42%;
    }
    43% {
        top: 57%;
        opacity: .94;
    }
    55% {
        left: calc(100% + 1.55rem);
        top: 46%;
        opacity: .88;
        transform: translateY(-50%) rotate(-90deg);
    }
    59%, 100% {
        left: calc(100% + 1.55rem);
        top: 50%;
        opacity: 0;
        transform: translateY(-50%) rotate(-90deg);
    }
}

@media (prefers-reduced-motion: reduce) {
    .milk-haunted-ghost {
        display: none !important;
        animation: none !important;
        opacity: 0 !important;
    }
}

.site-animations-off .milk-haunted-ghost {
    display: none !important;
    animation: none !important;
    opacity: 0 !important;
}

/* -------------------------------------------------------------------------
   Haunted Tier 4 — true phase-through pass
   -------------------------------------------------------------------------
   The reference effect is not only a ghost travelling in front of a word:
   mix-blend-mode visibly changes the lettering directly beneath the ghost.
   The moving ghost remains the visual object, while this synchronized masked
   copy of the title guarantees that the letters invert exactly as it crosses.
   ------------------------------------------------------------------------- */
.milk-title-font-haunted.milk-title-tier-4 {
    position: relative;
    isolation: isolate;
    overflow: visible !important;
}

.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink {
    position: relative !important;
    z-index: 1;
    isolation: isolate;
    overflow: visible !important;
}

/* This is a duplicate of the title, visible only inside a small moving ghost-
   shaped window. White + exclusion produces the same pass-through inversion
   seen in the CodePen even when the equipped title uses a pale gradient. */
.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after {
    content: attr(data-title-text) !important;
    display: block !important;
    position: absolute;
    inset: 0 auto auto 0;
    z-index: 6;
    width: max-content;
    min-width: 100%;
    font: inherit;
    font-kerning: inherit;
    font-variant: inherit;
    letter-spacing: inherit;
    line-height: inherit;
    white-space: pre;
    pointer-events: none;

    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    mix-blend-mode: exclusion;
    opacity: 0;

    /* The mask follows the broad horizontal silhouette of the rotated ghost,
       rather than exposing a harsh rectangular strip across the lettering. */
    -webkit-mask-image: radial-gradient(
        ellipse 50% 72% at 50% 50%,
        #000 0 58%,
        rgba(0, 0, 0, .88) 66%,
        transparent 78%
    );
    mask-image: radial-gradient(
        ellipse 50% 72% at 50% 50%,
        #000 0 58%,
        rgba(0, 0, 0, .88) 66%,
        transparent 78%
    );
    -webkit-mask-size: 2.45rem 1.35rem;
    mask-size: 2.45rem 1.35rem;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: -2.45rem 50%;
    mask-position: -2.45rem 50%;

    animation: milk-tier4-haunted-phase-text 9.6s ease-out infinite !important;
    will-change: opacity, -webkit-mask-position, mask-position;
}

/* Follow the CodePen more closely: a straight, centered crossing instead of
   bobbing above and below the small MILK title line. */
.milk-haunted-ghost {
    z-index: 7;
    top: 50% !important;
    left: -2.25rem;
    opacity: 0;
    background-color: #fff;
    --ghost-body: #fff;
    mix-blend-mode: exclusion;
    transform: translateY(-50%) rotate(-90deg);
    animation: milk-tier4-haunted-phase-ghost 9.6s ease-out infinite !important;
    will-change: left, opacity, transform;
}

@keyframes milk-tier4-haunted-phase-ghost {
    0%, 16% {
        left: -2.25rem;
        top: 50%;
        opacity: 0;
        transform: translateY(-50%) rotate(-90deg);
    }
    19% {
        opacity: .92;
    }
    55% {
        left: calc(100% + .3rem);
        top: 50%;
        opacity: .92;
        transform: translateY(-50%) rotate(-90deg);
    }
    59%, 100% {
        left: calc(100% + .3rem);
        top: 50%;
        opacity: 0;
        transform: translateY(-50%) rotate(-90deg);
    }
}

@keyframes milk-tier4-haunted-phase-text {
    0%, 16% {
        opacity: 0;
        -webkit-mask-position: -2.45rem 50%;
        mask-position: -2.45rem 50%;
    }
    19% {
        opacity: 1;
    }
    55% {
        opacity: 1;
        -webkit-mask-position: calc(100% + .3rem) 50%;
        mask-position: calc(100% + .3rem) 50%;
    }
    59%, 100% {
        opacity: 0;
        -webkit-mask-position: calc(100% + .3rem) 50%;
        mask-position: calc(100% + .3rem) 50%;
    }
}

@media (prefers-reduced-motion: reduce) {
    .milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after,
    .milk-haunted-ghost {
        display: none !important;
        animation: none !important;
        opacity: 0 !important;
    }
}

.site-animations-off .milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after,
.site-animations-off .milk-haunted-ghost {
    display: none !important;
    animation: none !important;
    opacity: 0 !important;
}

/* -------------------------------------------------------------------------
   Haunted Tier 4 — compact phase-through ghost
   -------------------------------------------------------------------------
   The full CodePen silhouette was visually too large for MILK's compact title
   badges, causing it to cover most of the word at once. Keep the same ghost
   construction, but scale the travelling spirit and its synchronized text
   mask down so the effect reads as a small figure slipping through letters.
   ------------------------------------------------------------------------- */
.post-mini-title:has(> .milk-title-font-haunted.milk-title-tier-4) {
    min-height: 1.75rem;
    padding-top: .3rem !important;
    padding-bottom: .3rem !important;
}

.profile-display-title:has(.milk-title-font-haunted.milk-title-tier-4) {
    padding-top: .15rem !important;
    padding-bottom: .25rem !important;
}

.milk-haunted-ghost {
    left: -1.5rem;
    opacity: 0;
    filter:
        drop-shadow(0 0 1.25px rgba(229, 222, 255, .7))
        drop-shadow(-2px 1px 2px rgba(114, 119, 159, .2));
    transform: translateY(-50%) rotate(90deg) scale(.62);
    transform-origin: center;
    animation-name: milk-tier4-haunted-compact-ghost !important;
}

.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after {
    -webkit-mask-size: 1.48rem .8rem;
    mask-size: 1.48rem .8rem;
    -webkit-mask-position: -1.48rem 50%;
    mask-position: -1.48rem 50%;
    animation-name: milk-tier4-haunted-compact-text !important;
}

@keyframes milk-tier4-haunted-compact-ghost {
    0%, 16% {
        left: -1.5rem;
        top: 51%;
        opacity: 0;
        transform: translateY(-50%) rotate(90deg) scale(.62);
    }
    19% {
        opacity: .88;
    }
    55% {
        left: calc(100% + .05rem);
        top: 51%;
        opacity: .88;
        transform: translateY(-50%) rotate(90deg) scale(.62);
    }
    59%, 100% {
        left: calc(100% + .05rem);
        top: 51%;
        opacity: 0;
        transform: translateY(-50%) rotate(90deg) scale(.62);
    }
}

@keyframes milk-tier4-haunted-compact-text {
    0%, 16% {
        opacity: 0;
        -webkit-mask-position: -1.48rem 50%;
        mask-position: -1.48rem 50%;
    }
    19% {
        opacity: 1;
    }
    55% {
        opacity: 1;
        -webkit-mask-position: calc(100% + .05rem) 50%;
        mask-position: calc(100% + .05rem) 50%;
    }
    59%, 100% {
        opacity: 0;
        -webkit-mask-position: calc(100% + .05rem) 50%;
        mask-position: calc(100% + .05rem) 50%;
    }
}

/* -------------------------------------------------------------------------
   Tier 4 refinements — Mossy + Electric
   ------------------------------------------------------------------------- */

/* Mossy — one gentle whole-word hop with a long quiet rest.
   Translation only: no scale pulse, so it reads as a soft bounce instead of
   the heartbeat motion we removed from the other title families. */
.milk-title-font-mossy.milk-title-tier-4 > .milk-title-ink {
    transform-origin: center bottom;
    will-change: transform;
    animation: milk-tier4-mossy-gentle-bounce 7.8s cubic-bezier(.28,.72,.35,1) infinite !important;
}

.milk-title-font-mossy.milk-title-tier-4 .milk-title-letter {
    animation: none !important;
}

@keyframes milk-tier4-mossy-gentle-bounce {
    0%, 58%, 100% { transform: translateY(0); }
    65% { transform: translateY(-2px); }
    70% { transform: translateY(0); }
    74% { transform: translateY(-.75px); }
    78% { transform: translateY(0); }
}

/* Electric — compact City Nights-inspired moving light field.
   The living cyan/violet gradient remains on ::before. This duplicate text
   layer contributes only the travelling neon illumination and opposing side
   glows, so the word stays crisp at mini-profile size. */
.milk-title-font-electric.milk-title-tier-4 .milk-title-letter {
    animation: none !important;
    transform: none !important;
}

.milk-title-font-electric.milk-title-tier-4 > .milk-title-ink::after {
    opacity: 1;
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    color: rgba(225, 236, 255, .22) !important;
    -webkit-text-fill-color: currentColor !important;
    mix-blend-mode: screen;
    filter: none !important;
    text-shadow:
        0 0 .8em rgba(180, 76, 255, .16),
        0 0 .12em rgba(197, 92, 255, .28),
        -.85em -.1em .42em rgba(75, 235, 255, 0),
        .85em .1em .42em rgba(219, 76, 255, 0);
    animation: milk-tier4-electric-city-lights 5.4s .45s linear infinite !important;
    will-change: color, text-shadow, opacity;
}

@keyframes milk-tier4-electric-city-lights {
    0%, 100% {
        color: rgba(218, 229, 255, .18);
        opacity: .72;
        text-shadow:
            0 0 .8em rgba(180, 76, 255, .16),
            0 0 .12em rgba(197, 92, 255, .28),
            -.85em -.1em .42em rgba(75, 235, 255, 0),
            .85em .1em .42em rgba(219, 76, 255, 0);
    }
    30% {
        color: rgba(231, 243, 255, .48);
        opacity: .92;
        text-shadow:
            0 0 .85em rgba(183, 75, 255, .48),
            0 0 .13em rgba(225, 161, 255, .56),
            -.48em -.1em .28em rgba(75, 235, 255, .38),
            .48em .1em .28em rgba(222, 74, 255, .48);
    }
    40% {
        color: rgba(245, 250, 255, .72);
        opacity: 1;
        text-shadow:
            0 0 .9em rgba(178, 68, 255, .55),
            0 0 .13em rgba(244, 205, 255, .68),
            -.24em -.1em .14em rgba(85, 242, 255, .52),
            .24em .1em .14em rgba(229, 83, 255, .58);
    }
    70% {
        color: rgba(231, 243, 255, .48);
        opacity: .92;
        text-shadow:
            0 0 .85em rgba(183, 75, 255, .48),
            0 0 .13em rgba(225, 161, 255, .56),
            .48em -.1em .28em rgba(75, 235, 255, .38),
            -.48em .1em .28em rgba(222, 74, 255, .48);
    }
}

/* Personal and OS-level motion preferences still win over the new effects. */
@media (prefers-reduced-motion: reduce) {
    .milk-title-font-mossy.milk-title-tier-4 > .milk-title-ink {
        animation: none !important;
        transform: none !important;
    }
    .milk-title-font-electric.milk-title-tier-4 > .milk-title-ink::after {
        animation: none !important;
        opacity: 0 !important;
    }
}

.site-animations-off .milk-title-font-mossy.milk-title-tier-4 > .milk-title-ink {
    animation: none !important;
    transform: none !important;
}

.site-animations-off .milk-title-font-electric.milk-title-tier-4 > .milk-title-ink::after {
    animation: none !important;
    opacity: 0 !important;
}

/* -------------------------------------------------------------------------
   Predictable title surfaces
   -------------------------------------------------------------------------
   Titles keep their own font, gradient, and animation. Readability comes from
   a predictable badge surface instead of strokes and halos on the lettering.
   ------------------------------------------------------------------------- */
.milk-title > .milk-title-ink,
.milk-title-tier-4 > .milk-title-ink,
.milk-title-tier-4 > .milk-title-ink::before {
    -webkit-text-stroke: 0 transparent !important;
    text-shadow: none !important;
}

/* Full profiles use the same quiet reading-surface idea at a larger scale. */
.profile-display-title {
    width: fit-content !important;
    max-width: 100%;
    margin: 0 0 .18rem !important;
    padding: .28rem .58rem .34rem !important;
    border: 1px solid rgba(55, 39, 52, .2);
    border-radius: .58rem;
    background: rgba(255, 253, 250, .9);
    box-shadow: 0 2px 8px rgba(45, 31, 43, .1);
    -webkit-backdrop-filter: blur(5px) saturate(.9);
    backdrop-filter: blur(5px) saturate(.9);
    isolation: isolate;
}

/* Mini-profile decoration art never becomes the title's background. Every
   title gets a solid white badge, regardless of the equipped profile theme. */
.post-mini-title {
    background: #fff !important;
    background-image: none !important;
    border: 1px solid rgba(55, 39, 52, .22) !important;
    box-shadow: 0 1px 4px rgba(45, 31, 43, .1) !important;
    color: #3d2938 !important;
}

/* Tier 0 has no gradient of its own, so give it a stable ink color too. */
.post-mini-title > .milk-title-tier-0 > .milk-title-ink {
    color: #3d2938 !important;
    -webkit-text-fill-color: #3d2938 !important;
}

/* Decorative faces need a larger optical size than interface text in the
   compact mini-profile badge. */
.post-mini-title > .milk-title.milk-title-font-haunted { font-size: .92rem !important; }
.post-mini-title > .milk-title.milk-title-font-mossy { font-size: .9rem !important; }
.post-mini-title > .milk-title.milk-title-font-electric { font-size: .8rem !important; }
.post-mini-title > .milk-title.milk-title-font-petal { font-size: 1rem !important; }
.post-mini-title > .milk-title.milk-title-font-blushing { font-size: 1.08rem !important; }
/* -------------------------------------------------------------------------
   2026-07 title art direction reset
   -------------------------------------------------------------------------
   Electric keeps its neon gradient. Every other title uses one clear, lively
   signature color rather than the shared muted gradient formula. Motion is
   reserved for Haunted, Mossy, and Electric; the remaining families use their
   typeface and static decorative details as their identity.
   ------------------------------------------------------------------------- */
.milk-title:not(.milk-title-font-electric):is(.milk-title-tier-1, .milk-title-tier-2, .milk-title-tier-3) > .milk-title-ink,
.milk-title:not(.milk-title-font-electric).milk-title-tier-4 > .milk-title-ink::before,
.milk-title:not(.milk-title-font-electric).milk-title-tier-4 .milk-title-letter {
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    color: var(--title-gradient-start, #d05c91) !important;
    -webkit-text-fill-color: currentColor !important;
    filter: none !important;
}

/* The shared Tier 3 gradient conveyor is removed for non-Electric titles. */
.milk-title:not(.milk-title-font-electric).milk-title-tier-3 > .milk-title-ink,
.milk-title:not(.milk-title-font-electric).milk-title-tier-4 > .milk-title-ink::before {
    animation: none !important;
}

/* Only these three families retain motion. Static titles may still keep a
   small non-moving accent supplied by their own family rules. */
.milk-title-tier-4:not(.milk-title-font-haunted):not(.milk-title-font-mossy):not(.milk-title-font-electric) > .milk-title-ink,
.milk-title-tier-4:not(.milk-title-font-haunted):not(.milk-title-font-mossy):not(.milk-title-font-electric) > .milk-title-ink::before,
.milk-title-tier-4:not(.milk-title-font-haunted):not(.milk-title-font-mossy):not(.milk-title-font-electric) > .milk-title-ink::after,
.milk-title-tier-4:not(.milk-title-font-haunted):not(.milk-title-font-mossy):not(.milk-title-font-electric) .milk-title-letter,
.milk-title-tier-4:not(.milk-title-font-haunted):not(.milk-title-font-mossy):not(.milk-title-font-electric) .milk-title-letter::before,
.milk-title-tier-4:not(.milk-title-font-haunted):not(.milk-title-font-mossy):not(.milk-title-font-electric) .milk-title-letter::after {
    animation: none !important;
    will-change: auto !important;
}

/* Bright, Milk-forward identities. These also provide the intended preview
   before the data migration has run in a fresh environment. */
.milk-title-font-dreamer { --title-gradient-start:#6878F0 !important; --title-gradient-end:#6878F0 !important; }
.milk-title-font-fairy { --title-gradient-start:#F052A0 !important; --title-gradient-end:#F052A0 !important; }
.milk-title-font-magical { --title-gradient-start:#F2763D !important; --title-gradient-end:#F2763D !important; }
.milk-title-font-witchy { --title-gradient-start:#A64BC4 !important; --title-gradient-end:#A64BC4 !important; }
.milk-title-font-cozy { --title-gradient-start:#C06C45 !important; --title-gradient-end:#C06C45 !important; }
.milk-title-font-gothic { --title-gradient-start:#59456F !important; --title-gradient-end:#59456F !important; }
.milk-title-font-pixel { --title-gradient-start:#16AFC8 !important; --title-gradient-end:#16AFC8 !important; }
.milk-title-font-moonlit { --title-gradient-start:#596BD6 !important; --title-gradient-end:#596BD6 !important; }
.milk-title-font-whimsical { --title-gradient-start:#E6A411 !important; --title-gradient-end:#E6A411 !important; }
.milk-title-font-enchanted { --title-gradient-start:#21AB8D !important; --title-gradient-end:#21AB8D !important; }
.milk-title-font-haunted { --title-gradient-start:#7D55A5 !important; --title-gradient-end:#7D55A5 !important; }
.milk-title-font-mossy { --title-gradient-start:#51923F !important; --title-gradient-end:#51923F !important; }
.milk-title-font-petal { --title-gradient-start:#ED6292 !important; --title-gradient-end:#ED6292 !important; }
.milk-title-font-blushing { --title-gradient-start:#DD5278 !important; --title-gradient-end:#DD5278 !important; }
/* -------------------------------------------------------------------------
   Tier 4 · individual title personalities
   ------------------------------------------------------------------------- */
.milk-title-tier-4:not(.milk-title-font-haunted) > .milk-title-ink {
    position: relative;
    overflow: visible !important;
    transform-origin: center;
}

/* Dreamer — the whole word drifts as sleepy z's dissolve overhead. */
.milk-title-font-dreamer.milk-title-tier-4 > .milk-title-ink {
    animation: milk-dreamer-drift 7.6s ease-in-out infinite !important;
}
.milk-title-font-dreamer.milk-title-tier-4 > .milk-title-ink::after {
    content: 'z  z' !important; display:block !important; position:absolute; left:62%; top:-.65em;
    width:max-content; color:#6878F0 !important; -webkit-text-fill-color:currentColor !important;
    font:700 .48em/1 sans-serif; letter-spacing:.08em; pointer-events:none;
    animation: milk-dreamer-sleep 7.6s ease-out infinite !important;
}
@keyframes milk-dreamer-drift { 0%,100%{transform:translate(0,0)} 45%{transform:translate(.65px,-2px)} 70%{transform:translate(-.35px,-.6px)} }
@keyframes milk-dreamer-sleep { 0%,34%,100%{opacity:0;transform:translate(0,3px) scale(.78)} 46%{opacity:.9} 72%{opacity:0;transform:translate(8px,-7px) scale(1.08)} }

/* Fairy — one tiny light flutters around the lettering like a firefly. */
.milk-title-font-fairy.milk-title-tier-4 > .milk-title-ink::after {
    content:'✦' !important; display:block !important; position:absolute; left:-.25em; top:10%;
    color:#F052A0 !important; -webkit-text-fill-color:currentColor !important; font:.7em/1 serif; pointer-events:none;
    animation: milk-fairy-flit 5.8s cubic-bezier(.45,.05,.55,.95) infinite !important;
}
@keyframes milk-fairy-flit { 0%,18%,100%{opacity:0;transform:translate(0,5px) rotate(0)} 25%{opacity:1} 42%{transform:translate(45%,-7px) rotate(35deg)} 62%{transform:translate(260%,2px) rotate(120deg)} 78%{opacity:1;transform:translate(470%,-5px) rotate(190deg)} 86%{opacity:0;transform:translate(520%,0) rotate(220deg)} }

/* Magical — a crisp wand-spark casts diagonally across the word. */
.milk-title-font-magical.milk-title-tier-4 > .milk-title-ink::after {
    content:'✧' !important; display:block !important; position:absolute; left:-.15em; top:55%;
    color:#F2763D !important; -webkit-text-fill-color:currentColor !important; font:.88em/1 serif; pointer-events:none;
    animation: milk-magical-cast 6.4s ease-in-out infinite !important;
}
@keyframes milk-magical-cast { 0%,26%,100%{opacity:0;transform:translate(-3px,4px) rotate(0) scale(.55)} 34%{opacity:1} 56%{opacity:1;transform:translate(260%,-12px) rotate(155deg) scale(1.18)} 68%{opacity:0;transform:translate(520%,-3px) rotate(280deg) scale(.7)} }

/* Witchy — irregular candlelight flicker, with no bouncing letters. */
.milk-title-font-witchy.milk-title-tier-4 > .milk-title-ink::before {
    animation: milk-witchy-flicker 6.8s steps(1,end) infinite !important;
}
@keyframes milk-witchy-flicker { 0%,17%,22%,61%,64%,100%{opacity:1;filter:brightness(1)} 19%{opacity:.62;filter:brightness(.8)} 20%{opacity:.9;filter:brightness(1.25)} 62%{opacity:.72;filter:brightness(.86)} 63%{opacity:1;filter:brightness(1.18)} }

/* Cozy — warm steam curls upward, then rests for most of the loop. */
.milk-title-font-cozy.milk-title-tier-4 > .milk-title-ink::after {
    content:'⌁  ⌁' !important; display:block !important; position:absolute; left:28%; top:-.42em;
    color:#C06C45 !important; -webkit-text-fill-color:currentColor !important; font:700 .58em/1 serif; pointer-events:none;
    animation: milk-cozy-steam 7.4s ease-out infinite !important;
}
@keyframes milk-cozy-steam { 0%,30%,100%{opacity:0;transform:translateY(4px) scaleX(.75)} 40%{opacity:.68} 65%{opacity:0;transform:translateY(-7px) scaleX(1.08)} }

/* Gothic — a tall, inky shadow lengthens and recedes like cathedral light. */
.milk-title-font-gothic.milk-title-tier-4 > .milk-title-ink::before {
    animation: milk-gothic-shadow 8s ease-in-out infinite !important;
}
@keyframes milk-gothic-shadow { 0%,28%,100%{text-shadow:0 0 0 rgba(48,30,58,0)} 48%{text-shadow:2px 3px 0 rgba(89,69,111,.22),4px 6px 2px rgba(89,69,111,.08)} 68%{text-shadow:-1px 2px 0 rgba(89,69,111,.15)} }

/* Pixel — a short, deliberate arcade glitch rather than a soft bounce. */
.milk-title-font-pixel.milk-title-tier-4 > .milk-title-ink {
    animation: milk-pixel-glitch 6.2s steps(1,end) infinite !important;
}
.milk-title-font-pixel.milk-title-tier-4 > .milk-title-ink::after {
    content:attr(data-title-text) !important; display:block !important; position:absolute; inset:0;
    color:#F052A0 !important; -webkit-text-fill-color:currentColor !important; opacity:0; pointer-events:none;
    animation: milk-pixel-echo 6.2s steps(1,end) infinite !important;
}
@keyframes milk-pixel-glitch { 0%,42%,46%,49%,100%{transform:translate(0)} 43%{transform:translate(-1px,0)} 45%{transform:translate(1px,-1px)} 48%{transform:translate(0,1px)} }
@keyframes milk-pixel-echo { 0%,42%,49%,100%{opacity:0;transform:translate(0)} 43%{opacity:.6;transform:translate(2px,0)} 45%{opacity:.42;transform:translate(-2px,1px)} 48%{opacity:.3;transform:translate(1px,-1px)} }

/* Moonlit — a crescent makes one slow orbit around the title. */
.milk-title-font-moonlit.milk-title-tier-4 > .milk-title-ink::after {
    content:'☾' !important; display:block !important; position:absolute; left:-.55em; top:0;
    color:#596BD6 !important; -webkit-text-fill-color:currentColor !important; font:.72em/1 serif; pointer-events:none;
    animation: milk-moonlit-orbit 8.8s ease-in-out infinite !important;
}
@keyframes milk-moonlit-orbit { 0%,20%,100%{opacity:0;transform:translate(0,4px) rotate(-20deg)} 28%{opacity:.9} 55%{transform:translate(310%,-9px) rotate(15deg)} 78%{opacity:.9;transform:translate(620%,3px) rotate(42deg)} 86%{opacity:0;transform:translate(680%,5px) rotate(55deg)} }

/* Whimsical — hand-drawn letters take turns making an odd little wobble. */
.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter {
    animation: milk-whimsical-wobble 7s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index,0) * .13s) !important;
}
@keyframes milk-whimsical-wobble { 0%,34%,62%,100%{transform:rotate(0) translateY(0)} 42%{transform:rotate(calc((var(--letter-index,0) % 2 * 2 - 1) * 5deg)) translateY(-1px)} 50%{transform:rotate(calc((var(--letter-index,0) % 2 * -2 + 1) * 3deg)) translateY(.5px)} }

/* Enchanted — a rune-like spark circles once and leaves a brief glow. */
.milk-title-font-enchanted.milk-title-tier-4 > .milk-title-ink::after {
    content:'✦' !important; display:block !important; position:absolute; left:45%; top:40%;
    color:#21AB8D !important; -webkit-text-fill-color:currentColor !important; font:.62em/1 serif; pointer-events:none;
    animation: milk-enchanted-rune 7.2s ease-in-out infinite !important;
}
.milk-title-font-enchanted.milk-title-tier-4 > .milk-title-ink::before { animation:milk-enchanted-glow 7.2s ease-in-out infinite !important; }
@keyframes milk-enchanted-rune { 0%,24%,100%{opacity:0;transform:rotate(0) translateX(0) scale(.55)} 34%{opacity:1} 62%{opacity:1;transform:rotate(220deg) translateX(2.2em) scale(1)} 76%{opacity:0;transform:rotate(360deg) translateX(0) scale(.6)} }
@keyframes milk-enchanted-glow { 0%,28%,78%,100%{filter:brightness(1)} 55%{filter:brightness(1.28)} }

/* Petal — one flower drifts down and turns like a loose blossom. */
.milk-title-font-petal.milk-title-tier-4 > .milk-title-ink::after {
    content:'❀' !important; display:block !important; position:absolute; left:62%; top:-.8em;
    color:#ED6292 !important; -webkit-text-fill-color:currentColor !important; font:.66em/1 serif; pointer-events:none;
    animation: milk-petal-fall 6.9s ease-in infinite !important;
}
@keyframes milk-petal-fall { 0%,24%,100%{opacity:0;transform:translate(-5px,-3px) rotate(0)} 34%{opacity:.9} 72%{opacity:.8;transform:translate(9px,18px) rotate(250deg)} 80%{opacity:0;transform:translate(13px,21px) rotate(320deg)} }

/* Blushing — the word shyly nudges aside as a heart appears. */
.milk-title-font-blushing.milk-title-tier-4 > .milk-title-ink {
    animation: milk-blushing-shy 7.8s ease-in-out infinite !important;
}
.milk-title-font-blushing.milk-title-tier-4 > .milk-title-ink::after {
    content:'♥' !important; display:block !important; position:absolute; right:-.45em; top:-.2em;
    color:#DD5278 !important; -webkit-text-fill-color:currentColor !important; font:.58em/1 serif; pointer-events:none;
    animation: milk-blushing-heart 7.8s ease-in-out infinite !important;
}
@keyframes milk-blushing-shy { 0%,32%,68%,100%{transform:translateX(0)} 44%,56%{transform:translateX(-1.5px)} }
@keyframes milk-blushing-heart { 0%,34%,66%,100%{opacity:0;transform:scale(.45) rotate(-12deg)} 45%{opacity:1;transform:scale(1.12) rotate(5deg)} 55%{opacity:.9;transform:scale(.92) rotate(0)} }
/* Gradient unlock correction: every family keeps a vivid two-color palette.
   Tier 3 animates that palette; Tier 4 layers its word-specific behavior on
   top. Electric retains the neon palette it already had. */
.milk-title:is(.milk-title-tier-1, .milk-title-tier-2, .milk-title-tier-3) > .milk-title-ink,
.milk-title-tier-4 > .milk-title-ink::before,
.milk-title-tier-4 .milk-title-letter {
    background-image: linear-gradient(
        90deg,
        var(--title-gradient-start) 0%,
        var(--title-gradient-end) 50%,
        var(--title-gradient-start) 100%
    ) !important;
    background-size: 200% 100% !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}

.milk-title-tier-1 > .milk-title-ink,
.milk-title-tier-2 > .milk-title-ink {
    background-size: 100% 100% !important;
    background-position: 50% 50% !important;
}

.milk-title-tier-3 > .milk-title-ink {
    animation: milk-title-gradient-flow 7.2s linear infinite !important;
}

/* Lively Milk palettes. */
.milk-title-font-dreamer { --title-gradient-start:#A9B6E8 !important; --title-gradient-end:#F3B7C4 !important; }
.milk-title-font-fairy { --title-gradient-start:#F4AFC3 !important; --title-gradient-end:#BFE7D3 !important; }
.milk-title-font-magical { --title-gradient-start:#FF7A3D !important; --title-gradient-end:#8B5CF6 !important; }
.milk-title-font-witchy { --title-gradient-start:#6E466E !important; --title-gradient-end:#9EAD92 !important; }
.milk-title-font-cozy { --title-gradient-start:#C9B7DB !important; --title-gradient-end:#AFC5A5 !important; }
.milk-title-font-gothic { --title-gradient-start:#4D4653 !important; --title-gradient-end:#8C5266 !important; }
.milk-title-font-pixel { --title-gradient-start:#71DCE0 !important; --title-gradient-end:#A987E8 !important; }
.milk-title-font-moonlit { --title-gradient-start:#596584 !important; --title-gradient-end:#D8D5E6 !important; }
.milk-title-font-whimsical { --title-gradient-start:#F2D675 !important; --title-gradient-end:#F08F8A !important; }
.milk-title-font-enchanted { --title-gradient-start:#B8EAD8 !important; --title-gradient-end:#D7C3F0 !important; }
.milk-title-font-haunted { --title-gradient-start:#70449A !important; --title-gradient-end:#9CCBFF !important; }
.milk-title-font-mossy { --title-gradient-start:#78966C !important; --title-gradient-end:#CDBDA8 !important; }
.milk-title-font-petal { --title-gradient-start:#F3AFC1 !important; --title-gradient-end:#F7C9AE !important; }
.milk-title-font-blushing { --title-gradient-start:#E89BAA !important; --title-gradient-end:#CDB7E8 !important; }
/* Specificity guard over the retired solid-color reset above. */
.milk-title.milk-title:not(.milk-title-font-never):is(.milk-title-tier-1, .milk-title-tier-2, .milk-title-tier-3) > .milk-title-ink,
.milk-title.milk-title-tier-4.milk-title-tier-4 > .milk-title-ink::before,
.milk-title.milk-title-tier-4.milk-title-tier-4 .milk-title-letter {
    background-image: linear-gradient(90deg,var(--title-gradient-start) 0%,var(--title-gradient-end) 50%,var(--title-gradient-start) 100%) !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
}
/* Haunted palette · ink black, spectral purple, and eerie green. */
.milk-title.milk-title-font-haunted { --title-gradient-start:#713F9B !important; --title-gradient-end:#79B94A !important; }
.milk-title.milk-title-font-haunted:is(.milk-title-tier-1, .milk-title-tier-2, .milk-title-tier-3) > .milk-title-ink,
.milk-title.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::before,
.milk-title.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter {
    background-image:linear-gradient(90deg,#19151D 0%,#713F9B 32%,#79B94A 68%,#19151D 100%) !important;
}
/* -------------------------------------------------------------------------
   Tier 4 animation activation + Haunted final treatment
   -------------------------------------------------------------------------
   These selectors intentionally match the specificity of the legacy reset so
   every word-specific animation wins reliably in profile and inventory views.
   ------------------------------------------------------------------------- */
.milk-title.milk-title.milk-title-font-dreamer.milk-title-tier-4 > .milk-title-ink { animation:milk-dreamer-drift 7.6s ease-in-out infinite !important; }
.milk-title.milk-title.milk-title-font-dreamer.milk-title-tier-4 > .milk-title-ink::after { animation:milk-dreamer-sleep 7.6s ease-out infinite !important; }
.milk-title.milk-title.milk-title-font-fairy.milk-title-tier-4 > .milk-title-ink::after { animation:milk-fairy-flit 5.8s cubic-bezier(.45,.05,.55,.95) infinite !important; }
.milk-title.milk-title.milk-title-font-magical.milk-title-tier-4 > .milk-title-ink::after { animation:milk-magical-cast 6.4s ease-in-out infinite !important; }
.milk-title.milk-title.milk-title-font-witchy.milk-title-tier-4 > .milk-title-ink::before { animation:milk-witchy-flicker 6.8s steps(1,end) infinite !important; }
.milk-title.milk-title.milk-title-font-cozy.milk-title-tier-4 > .milk-title-ink::after { animation:milk-cozy-steam 7.4s ease-out infinite !important; }
.milk-title.milk-title.milk-title-font-gothic.milk-title-tier-4 > .milk-title-ink::before { animation:milk-gothic-shadow 8s ease-in-out infinite !important; }
.milk-title.milk-title.milk-title-font-pixel.milk-title-tier-4 > .milk-title-ink { animation:milk-pixel-glitch 6.2s steps(1,end) infinite !important; }
.milk-title.milk-title.milk-title-font-pixel.milk-title-tier-4 > .milk-title-ink::after { animation:milk-pixel-echo 6.2s steps(1,end) infinite !important; }
.milk-title.milk-title.milk-title-font-moonlit.milk-title-tier-4 > .milk-title-ink::after { animation:milk-moonlit-orbit 8.8s ease-in-out infinite !important; }
.milk-title.milk-title.milk-title-font-whimsical.milk-title-tier-4 .milk-title-letter { animation:milk-whimsical-wobble 7s ease-in-out infinite !important; animation-delay:calc(var(--letter-index,0) * .13s) !important; }
.milk-title.milk-title.milk-title-font-enchanted.milk-title-tier-4 > .milk-title-ink::after { animation:milk-enchanted-rune 7.2s ease-in-out infinite !important; }
.milk-title.milk-title.milk-title-font-enchanted.milk-title-tier-4 > .milk-title-ink::before { animation:milk-enchanted-glow 7.2s ease-in-out infinite !important; }
.milk-title.milk-title.milk-title-font-petal.milk-title-tier-4 > .milk-title-ink::after { animation:milk-petal-fall 6.9s ease-in infinite !important; }
.milk-title.milk-title.milk-title-font-blushing.milk-title-tier-4 > .milk-title-ink { animation:milk-blushing-shy 7.8s ease-in-out infinite !important; }
.milk-title.milk-title.milk-title-font-blushing.milk-title-tier-4 > .milk-title-ink::after { animation:milk-blushing-heart 7.8s ease-in-out infinite !important; }

/* Haunted Tier 4 drops the gradient entirely: purple lettering, with the
   spectral neon-green ghost supplying the contrast and motion. */
.milk-title.milk-title.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::before,
.milk-title.milk-title.milk-title-font-haunted.milk-title-tier-4 .milk-title-letter {
    background:none !important;
    background-image:none !important;
    color:#713F9B !important;
    -webkit-text-fill-color:#713F9B !important;
    filter:none !important;
}
.milk-title-font-haunted.milk-title-tier-4 .milk-haunted-ghost {
    --ghost-body:#8DFF4A !important;
    background-color:#8DFF4A !important;
    mix-blend-mode:normal !important;
    filter:drop-shadow(0 0 2px rgba(141,255,74,.95)) drop-shadow(0 0 5px rgba(113,255,68,.58)) !important;
}
.milk-title.milk-title.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after {
    color:#8DFF4A !important;
    -webkit-text-fill-color:#8DFF4A !important;
    mix-blend-mode:screen !important;
}
/* Retire the older forced pastel Enchanted palette. */
.milk-title.milk-title.milk-title-font-enchanted { --title-gradient-start:#B8EAD8 !important; --title-gradient-end:#D7C3F0 !important; }
/* Haunted ghost cleanup: the old masked duplicate word was overlapping the
   new neon silhouette. Keep one compact, readable ghost crossing the title. */
.milk-title.milk-title.milk-title-font-haunted.milk-title-tier-4 > .milk-title-ink::after {
    content:none !important;
    display:none !important;
    animation:none !important;
    opacity:0 !important;
}
.milk-title-font-haunted.milk-title-tier-4 .milk-haunted-ghost {
    z-index:7 !important;
    opacity:0;
}
.milk-title-font-haunted.milk-title-tier-4 .milk-haunted-ghost > span:nth-child(1),
.milk-title-font-haunted.milk-title-tier-4 .milk-haunted-ghost > span:nth-child(3),
.milk-title-font-haunted.milk-title-tier-4 .milk-haunted-ghost > span:nth-child(5) {
    background-color:#8DFF4A !important;
}
.milk-title-font-haunted.milk-title-tier-4 .milk-haunted-ghost > span:nth-child(2),
.milk-title-font-haunted.milk-title-tier-4 .milk-haunted-ghost > span:nth-child(4) {
    background-color:transparent !important;
}

/* Petal should fall through the title, not begin detached above the badge. */
.milk-title.milk-title.milk-title-font-petal.milk-title-tier-4 > .milk-title-ink::after {
    top:.04em !important;
    animation:milk-petal-fall-inline 6.9s ease-in infinite !important;
}
@keyframes milk-petal-fall-inline {
    0%,24%,100% { opacity:0; transform:translate(-4px,-2px) rotate(0); }
    34% { opacity:.92; }
    70% { opacity:.82; transform:translate(8px,11px) rotate(250deg); }
    80% { opacity:0; transform:translate(12px,14px) rotate(320deg); }
}
/* Main-profile titles are compact honorific badges, not hero headings. */
.profile-identity > .profile-display-title {
    margin: 0 0 .12rem !important;
    padding: .14rem .4rem .2rem !important;
    font-size: .78rem !important;
    line-height: 1.08 !important;
    border-radius: .48rem;
}
.profile-identity > .profile-display-title .milk-title,
.profile-identity > .profile-display-title .milk-title > .milk-title-ink {
    line-height: 1.12 !important;
    padding-bottom: .08em !important;
}
.profile-identity > .profile-display-title .milk-title.milk-title-font-magical,
.profile-identity > .profile-display-title .milk-title.milk-title-font-magical > .milk-title-ink {
    line-height: 1.16 !important;
    padding-bottom: .12em !important;
}
/* Limited Y2K title: a fully finished pop-star keepsake rather than an
   upgrade ladder. Its styling is intentionally available at Tier 0. */
.milk-title.milk-title-font-paolo {
    position: relative;
    padding-inline: .34em;
    overflow: visible;
    font-family: 'DynaPuff', 'Baloo 2', sans-serif !important;
    font-size: .92em;
    font-weight: 700 !important;
    letter-spacing: .055em !important;
    line-height: 1.2;
    white-space: nowrap;
    filter:
        drop-shadow(0 1px 0 #55246f)
        drop-shadow(1px 0 0 #55246f)
        drop-shadow(-1px 0 0 #55246f)
        drop-shadow(0 0 2px rgba(255, 255, 255, .7)) !important;
}
.milk-title.milk-title-font-paolo > .milk-title-ink {
    display: inline-block;
    background: linear-gradient(
        90deg,
        #20d6cf 0%,
        #c9ef52 23%,
        #ff4f9b 48%,
        #a968ff 72%,
        #20d6cf 100%
    ) !important;
    background-size: 260% 100% !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background-position: 50% 50% !important;
    animation: none !important;
    transform-origin: 50% 72%;
}
.milk-title.milk-title-tier-1.milk-title-font-paolo > .milk-title-ink {
    animation:
        milk-paolo-color-cycle 4.8s linear infinite,
        milk-paolo-stage-pop 6.8s cubic-bezier(.2, .85, .25, 1) infinite !important;
}
.milk-title.milk-title-font-paolo::before,
.milk-title.milk-title-font-paolo::after {
    position: absolute;
    top: 50%;
    color: #f8ef68;
    -webkit-text-fill-color: #f8ef68;
    font-family: sans-serif;
    font-size: .56em;
    line-height: 1;
    text-shadow: 0 1px 0 #7a367d;
    opacity: .72;
    transform: translateY(-50%) scale(.72) rotate(-12deg);
}
.milk-title.milk-title-font-paolo::before {
    content: "★";
    left: -.38em;
    animation: none;
}
.milk-title.milk-title-font-paolo::after {
    content: "✦";
    right: -.38em;
    animation: none;
}
.milk-title.milk-title-tier-1.milk-title-font-paolo::before {
    animation: milk-paolo-star-left 6.8s ease-in-out infinite;
}
.milk-title.milk-title-tier-1.milk-title-font-paolo::after {
    animation: milk-paolo-star-right 6.8s ease-in-out infinite;
}
@keyframes milk-paolo-color-cycle {
    from { background-position: 0% 50%; }
    to { background-position: 260% 50%; }
}
@keyframes milk-paolo-stage-pop {
    0%, 28%, 72%, 100% {
        transform: translateY(0) scale(1) rotate(0);
        filter: brightness(1);
    }
    34% { transform: translateY(1px) scaleX(1.045) scaleY(.91) rotate(-.5deg); }
    40% {
        transform: translateY(-4px) scaleX(.97) scaleY(1.12) rotate(.7deg);
        filter: brightness(1.24);
    }
    46% {
        transform: translateY(-1px) scale(1.075) rotate(-.35deg);
        filter: brightness(1.1);
    }
    52% {
        transform: translateY(-3px) scale(1.035) rotate(.25deg);
        filter: brightness(1.34);
    }
    59% { transform: translateY(0) scaleX(1.04) scaleY(.97); }
    65% { transform: translateY(-1px) scale(1.015); }
}
@keyframes milk-paolo-star-left {
    0%, 31%, 70%, 100% {
        opacity: .65;
        transform: translateY(-50%) scale(.72) rotate(-12deg);
    }
    40% {
        opacity: 1;
        transform: translate(-.1em, -75%) scale(1.45) rotate(34deg);
        text-shadow: 0 0 4px #fff, 0 0 8px #f8ef68;
    }
    52% {
        opacity: 1;
        transform: translate(.04em, -60%) scale(1.08) rotate(86deg);
    }
}
@keyframes milk-paolo-star-right {
    0%, 36%, 72%, 100% {
        opacity: .65;
        transform: translateY(-50%) scale(.72) rotate(10deg);
    }
    46% {
        opacity: 1;
        transform: translate(.1em, -80%) scale(1.5) rotate(-42deg);
        text-shadow: 0 0 4px #fff, 0 0 8px #f8ef68;
    }
    58% {
        opacity: 1;
        transform: translate(-.04em, -58%) scale(1.12) rotate(-92deg);
    }
}
.post-mini-title > .milk-title.milk-title-font-paolo {
    min-width: max-content;
    font-size: .68rem !important;
    letter-spacing: .035em !important;
}
.profile-display-title .milk-title.milk-title-font-paolo {
    font-size: 1em !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-font-paolo > .milk-title-ink {
        animation: none !important;
        background-position: 50% 50% !important;
        transform: none !important;
    }
    .milk-title.milk-title-font-paolo::before,
    .milk-title.milk-title-font-paolo::after {
        animation: none !important;
    }
}
.site-animations-off .milk-title.milk-title-font-paolo > .milk-title-ink {
    animation: none !important;
    background-position: 50% 50% !important;
    transform: none !important;
}
.site-animations-off .milk-title.milk-title-font-paolo::before,
.site-animations-off .milk-title.milk-title-font-paolo::after {
    animation: none !important;
}
/* Limited Y2K title: Elle Woods courtroom confidence in full pink gloss. */
.milk-title.milk-title-font-elle{position:relative;padding-inline:.42em;overflow:visible;font-family:'DynaPuff','Baloo 2',sans-serif!important;font-size:.88em;font-weight:700!important;letter-spacing:.035em!important;line-height:1.2;white-space:nowrap;filter:drop-shadow(0 1px 0 #762050) drop-shadow(1px 0 0 #762050) drop-shadow(-1px 0 0 #762050) drop-shadow(0 0 2px rgba(255,255,255,.85))!important}
.milk-title.milk-title-font-elle>.milk-title-ink{display:inline-block;background:linear-gradient(105deg,#ff3e9e 0%,#ff8bc4 22%,#fff4fb 38%,#ffe46b 49%,#fff4fb 58%,#ff72b5 76%,#ff3e9e 100%)!important;background-size:290% 100%!important;background-position:50% 50%!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;animation:none!important;transform-origin:54% 72%}
.milk-title.milk-title-font-elle::before,.milk-title.milk-title-font-elle::after{position:absolute;top:50%;z-index:1;font-family:sans-serif;line-height:1;animation:none;pointer-events:none}
.milk-title.milk-title-font-elle::before{content:"♥";left:-.3em;color:#ff4fa4;-webkit-text-fill-color:#ff4fa4;font-size:.52em;text-shadow:0 1px 0 #7a2454;transform:translateY(-52%) rotate(-13deg)}
.milk-title.milk-title-font-elle::after{content:"✦";right:-.3em;color:#ffe46b;-webkit-text-fill-color:#ffe46b;font-size:.58em;text-shadow:0 1px 0 #8f5a22;transform:translateY(-52%) rotate(10deg)}
.milk-title.milk-title-tier-1.milk-title-font-elle>.milk-title-ink{animation:milk-elle-gloss-sweep 4.2s linear infinite,milk-elle-case-closed 6.4s cubic-bezier(.2,.82,.24,1) infinite!important}
.milk-title.milk-title-tier-1.milk-title-font-elle::before{animation:milk-elle-heart-pop 6.4s ease-in-out infinite}
.milk-title.milk-title-tier-1.milk-title-font-elle::after{animation:milk-elle-spark-pop 6.4s ease-in-out infinite}
@keyframes milk-elle-gloss-sweep{from{background-position:0% 50%}to{background-position:290% 50%}}
@keyframes milk-elle-case-closed{0%,28%,78%,100%{transform:translateY(0) scale(1) rotate(0);filter:brightness(1)}35%{transform:translateY(1px) scaleX(1.04) scaleY(.94) rotate(-.7deg)}42%{transform:translateY(-4px) scale(1.075) rotate(1.8deg);filter:brightness(1.22)}49%{transform:translateY(-1px) scale(1.035) rotate(-1deg)}56%{transform:translateY(-3px) scale(1.09) rotate(.45deg);filter:brightness(1.35)}64%{transform:translateY(0) scaleX(1.045) scaleY(.97)}71%{transform:translateY(-1px) scale(1.015)}}
@keyframes milk-elle-heart-pop{0%,31%,76%,100%{opacity:.72;transform:translateY(-52%) scale(.82) rotate(-13deg)}42%{opacity:1;transform:translate(-.08em,-82%) scale(1.55) rotate(18deg);text-shadow:0 0 4px #fff,0 0 8px #ff69b4}57%{opacity:1;transform:translate(.04em,-60%) scale(1.08) rotate(-5deg)}}
@keyframes milk-elle-spark-pop{0%,37%,78%,100%{opacity:.7;transform:translateY(-52%) scale(.78) rotate(10deg)}49%{opacity:1;transform:translate(.1em,-85%) scale(1.65) rotate(82deg);text-shadow:0 0 4px #fff,0 0 9px #ffe46b}62%{opacity:1;transform:translate(-.03em,-60%) scale(1.1) rotate(138deg)}}
.post-mini-title>.milk-title.milk-title-font-elle{min-width:max-content;font-size:.64rem!important;letter-spacing:.022em!important}
.profile-display-title .milk-title.milk-title-font-elle{font-size:.94em!important}
@media(prefers-reduced-motion:reduce){.milk-title.milk-title-font-elle>.milk-title-ink,.milk-title.milk-title-font-elle::before,.milk-title.milk-title-font-elle::after{animation:none!important}}
.site-animations-off .milk-title.milk-title-font-elle>.milk-title-ink,.site-animations-off .milk-title.milk-title-font-elle::before,.site-animations-off .milk-title.milk-title-font-elle::after{animation:none!important}
/* Limited Y2K title: Clueless plaid with a dismissive little snap. */
.milk-title.milk-title-font-cher{position:relative;padding-inline:.42em;overflow:visible;font-family:'DynaPuff','Baloo 2',sans-serif!important;font-size:.95em;font-weight:700!important;font-style:italic;letter-spacing:.055em!important;line-height:1.2;white-space:nowrap;filter:drop-shadow(0 1px 0 #21182c) drop-shadow(1px 0 0 #21182c) drop-shadow(-1px 0 0 #21182c) drop-shadow(0 0 2px rgba(255,255,255,.92))!important}
.milk-title.milk-title-font-cher>.milk-title-ink{display:inline-block;background:linear-gradient(95deg,#ffd92f 0 22%,#fff7ca 22% 28%,#1f1928 28% 34%,#ffd92f 34% 60%,#ff62a8 60% 69%,#fff 69% 75%,#ffd92f 75% 100%)!important;background-size:235% 100%!important;background-position:50% 50%!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;animation:none!important;transform-origin:48% 70%}
.milk-title.milk-title-font-cher::before,.milk-title.milk-title-font-cher::after{position:absolute;top:50%;z-index:1;font-family:sans-serif;font-style:normal;line-height:1;animation:none;pointer-events:none}
.milk-title.milk-title-font-cher::before{content:"◆";left:-.28em;color:#1f1928;-webkit-text-fill-color:#1f1928;font-size:.5em;text-shadow:0 0 2px #fff;transform:translateY(-52%) rotate(-12deg)}
.milk-title.milk-title-font-cher::after{content:"✦";right:-.3em;color:#ff62a8;-webkit-text-fill-color:#ff62a8;font-size:.58em;text-shadow:0 1px 0 #72204b;transform:translateY(-52%) rotate(9deg)}
.milk-title.milk-title-tier-1.milk-title-font-cher>.milk-title-ink{animation:milk-cher-plaid-slide 4.5s linear infinite,milk-cher-as-if 5.8s cubic-bezier(.18,.82,.22,1) infinite!important}
.milk-title.milk-title-tier-1.milk-title-font-cher::before{animation:milk-cher-diamond-flick 5.8s ease-in-out infinite}
.milk-title.milk-title-tier-1.milk-title-font-cher::after{animation:milk-cher-spark-flick 5.8s ease-in-out infinite}
@keyframes milk-cher-plaid-slide{from{background-position:0% 50%}to{background-position:235% 50%}}
@keyframes milk-cher-as-if{0%,30%,76%,100%{transform:translateX(0) translateY(0) scale(1) rotate(0);filter:brightness(1)}38%{transform:translateX(-2px) translateY(1px) scaleX(1.04) scaleY(.94) rotate(-1.5deg)}46%{transform:translateX(5px) translateY(-3px) scale(1.12) rotate(3.5deg);filter:brightness(1.28)}53%{transform:translateX(-2px) translateY(-1px) scale(1.04) rotate(-2deg)}60%{transform:translateX(2px) translateY(-2px) scale(1.08) rotate(1deg);filter:brightness(1.38)}68%{transform:translateX(0) translateY(0) scaleX(1.05) scaleY(.97)}}
@keyframes milk-cher-diamond-flick{0%,32%,76%,100%{opacity:.74;transform:translateY(-52%) scale(.8) rotate(-12deg)}46%{opacity:1;transform:translate(-.12em,-82%) scale(1.5) rotate(-58deg);text-shadow:0 0 4px #fff,0 0 8px #ffd92f}60%{opacity:1;transform:translate(.03em,-60%) scale(1.05) rotate(-96deg)}}
@keyframes milk-cher-spark-flick{0%,38%,78%,100%{opacity:.72;transform:translateY(-52%) scale(.78) rotate(9deg)}51%{opacity:1;transform:translate(.18em,-78%) scale(1.65) rotate(105deg);text-shadow:0 0 4px #fff,0 0 9px #ff62a8}65%{opacity:1;transform:translate(-.03em,-58%) scale(1.08) rotate(160deg)}}
.post-mini-title>.milk-title.milk-title-font-cher{min-width:max-content;font-size:.7rem!important;letter-spacing:.04em!important}
.profile-display-title .milk-title.milk-title-font-cher{font-size:1em!important}
@media(prefers-reduced-motion:reduce){.milk-title.milk-title-font-cher>.milk-title-ink,.milk-title.milk-title-font-cher::before,.milk-title.milk-title-font-cher::after{animation:none!important}}
.site-animations-off .milk-title.milk-title-font-cher>.milk-title-ink,.site-animations-off .milk-title.milk-title-font-cher::before,.site-animations-off .milk-title.milk-title-font-cher::after{animation:none!important}
/* Exclusive Y2K identity reset: three quotes, three distinct title systems. */
.milk-title.milk-title-font-paolo{padding-inline:1.15em;font-family:'Audiowide',sans-serif!important;font-size:.72em;font-style:normal;letter-spacing:.04em!important;filter:drop-shadow(0 1px 0 #32116c) drop-shadow(1px 0 0 rgba(50,17,108,.72)) drop-shadow(-1px 0 0 rgba(50,17,108,.72)) drop-shadow(0 0 4px rgba(42,224,220,.8))!important}
.milk-title.milk-title-font-paolo>.milk-title-ink{background:linear-gradient(90deg,#fff 0%,#43ece5 25%,#ff58ae 52%,#ffe467 76%,#fff 100%)!important;background-size:240% 100%!important;background-position:0 50%!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;transform:none;transform-origin:center}
.milk-title.milk-title-font-paolo::before,.milk-title.milk-title-font-paolo::after{top:50%;text-shadow:0 1px 0 #32116c,1px 0 0 #32116c,-1px 0 0 #32116c,0 -1px 0 #32116c,0 0 5px currentColor}
.milk-title.milk-title-font-paolo::before{content:'♪';left:.05em;color:#2edfd8!important;-webkit-text-fill-color:#2edfd8!important;transform:translateY(-55%) rotate(-12deg)}
.milk-title.milk-title-font-paolo::after{content:'♫';right:.02em;color:#ff55aa!important;-webkit-text-fill-color:#ff55aa!important;transform:translateY(-55%) rotate(10deg)}
.milk-title.milk-title-tier-1.milk-title-font-paolo>.milk-title-ink{animation:milk-paolo-spotlight 3.6s linear infinite,milk-paolo-marquee 7s ease-in-out infinite!important}
.milk-title.milk-title-tier-1.milk-title-font-paolo::before{animation:milk-paolo-note-left 7s ease-in-out infinite!important}
.milk-title.milk-title-tier-1.milk-title-font-paolo::after{animation:milk-paolo-note-right 7s ease-in-out infinite!important}
@keyframes milk-paolo-spotlight{to{background-position:240% 50%}}
@keyframes milk-paolo-marquee{0%,38%,72%,100%{transform:translateY(0) scale(1);filter:brightness(1)}48%{transform:translateY(-1px) scale(1.035);filter:brightness(1.65) drop-shadow(0 0 5px #fff)}60%{transform:translateY(0) scale(1.012);filter:brightness(1.15)}}
@keyframes milk-paolo-note-left{0%,36%,70%,100%{opacity:.7;transform:translateY(-55%) rotate(-12deg)}48%{opacity:1;transform:translate(-.14em,-115%) rotate(-24deg)}60%{opacity:.85;transform:translate(.03em,-70%) rotate(-8deg)}}
@keyframes milk-paolo-note-right{0%,40%,74%,100%{opacity:.7;transform:translateY(-55%) rotate(10deg)}52%{opacity:1;transform:translate(.16em,-120%) rotate(24deg)}64%{opacity:.85;transform:translate(-.02em,-68%) rotate(7deg)}}

.milk-title.milk-title-font-elle{padding:0 .72em .16em;font-family:'Leckerli One',cursive!important;font-size:.83em;font-style:normal;font-weight:400!important;letter-spacing:.015em!important;filter:drop-shadow(0 1px 0 #831e55)!important}
.milk-title.milk-title-font-elle>.milk-title-ink{background:linear-gradient(180deg,#fff5fb 0%,#ff79bb 34%,#f52d8b 72%,#ae145d 100%)!important;background-size:100% 100%!important;background-position:50% 50%!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;transform:none}
.milk-title.milk-title-font-elle::before{content:'§';left:.05em;top:50%;color:#ff4f9f!important;-webkit-text-fill-color:#ff4f9f!important;font-family:Georgia,serif;font-size:.58em;text-shadow:none;transform:translateY(-55%) rotate(-8deg)}
.milk-title.milk-title-font-elle::after{content:'';top:auto;right:.5em;bottom:-.02em;left:.5em;width:auto;height:2px;border-radius:999px;background:linear-gradient(90deg,#ff3e9e,#ffacd4 72%,transparent);box-shadow:0 1px 0 rgba(126,26,76,.45);transform:scaleX(1);transform-origin:left center}
.milk-title.milk-title-tier-1.milk-title-font-elle>.milk-title-ink{animation:milk-elle-signature 7.2s ease-in-out infinite!important}
.milk-title.milk-title-tier-1.milk-title-font-elle::before{animation:milk-elle-seal 7.2s cubic-bezier(.2,.75,.25,1) infinite!important}
.milk-title.milk-title-tier-1.milk-title-font-elle::after{animation:milk-elle-underline 7.2s ease-in-out infinite!important}
@keyframes milk-elle-signature{0%,42%,74%,100%{transform:rotate(0);filter:brightness(1)}52%{transform:rotate(-1.2deg);filter:brightness(1.16)}59%{transform:rotate(.35deg);filter:brightness(1.08)}66%{transform:rotate(0)}}
@keyframes milk-elle-seal{0%,46%,75%,100%{opacity:.72;transform:translateY(-55%) rotate(-8deg) scale(.92)}55%{opacity:1;transform:translateY(-55%) rotate(7deg) scale(1.28)}64%{transform:translateY(-55%) rotate(-3deg) scale(1)}}
@keyframes milk-elle-underline{0%,40%{opacity:0;transform:scaleX(0)}58%,78%{opacity:1;transform:scaleX(1)}90%,100%{opacity:0;transform:scaleX(1)}}

.milk-title.milk-title-font-cher{display:inline-flex;align-items:center;padding:.24em .72em .2em;border:2px solid #17131c;border-radius:.14em;background:linear-gradient(90deg,transparent 0 26%,rgba(23,19,28,.92) 26% 31%,transparent 31% 68%,rgba(23,19,28,.58) 68% 73%,transparent 73%),linear-gradient(0deg,transparent 0 29%,rgba(23,19,28,.9) 29% 36%,transparent 36% 70%,rgba(23,19,28,.55) 70% 76%,transparent 76%),linear-gradient(135deg,#ffeb69,#f1cb1d)!important;box-shadow:3px 3px 0 #ff62a8;font-family:'Henny Penny',cursive!important;font-size:.88em;font-style:normal;font-weight:700!important;letter-spacing:.055em!important;filter:none!important;transform:skew(-3deg)}
.milk-title.milk-title-font-cher>.milk-title-ink{position:relative;z-index:1;background:linear-gradient(180deg,#4d4852 0%,#111218 48%,#362719 100%)!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important;text-shadow:none;transform:none}
.milk-title.milk-title-font-cher::before{content:'';position:absolute;inset:1px;z-index:0;border-radius:.08em;background:rgba(255,235,105,.14);-webkit-backdrop-filter:blur(1.25px);backdrop-filter:blur(1.25px);pointer-events:none}
.milk-title.milk-title-font-cher::after{content:'◆';top:50%;right:-.48em;color:#1f1928!important;-webkit-text-fill-color:#1f1928!important;font-size:.38em;text-shadow:none;transform:translateY(-50%) rotate(45deg)}
.milk-title.milk-title-tier-1.milk-title-font-cher>.milk-title-ink{animation:milk-cher-dismissive-swipe 6.2s cubic-bezier(.2,.75,.25,1) infinite!important}
.milk-title.milk-title-tier-1.milk-title-font-cher::after{animation:milk-cher-diamond-snap 6.2s steps(2,end) infinite!important}
@keyframes milk-cher-dismissive-swipe{0%,42%,72%,100%{transform:translateX(0)}49%{transform:translateX(-4px)}54%{transform:translateX(7px)}59%{transform:translateX(-2px)}64%{transform:translateX(0)}}
@keyframes milk-cher-diamond-snap{0%,45%,68%,100%{transform:translateY(-50%) rotate(45deg)}53%{transform:translate(.2em,-50%) rotate(135deg)}60%{transform:translateY(-50%) rotate(225deg)}}
/* AS IF! carries its own Clueless plaid tag, so post themes must not wrap it in a second badge. */
.forum-post-card .post-mini-title:has(> .milk-title-font-cher){width:max-content!important;max-width:100%!important;min-width:0!important;min-height:0!important;margin-left:auto!important;margin-right:auto!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;text-shadow:none!important;overflow:visible!important}


.event-title-preview-paolo,.inventory-title-preview-paolo{background:radial-gradient(ellipse at 18% 0%,rgba(41,235,226,.48),transparent 42%),radial-gradient(ellipse at 82% 0%,rgba(255,69,161,.5),transparent 42%),linear-gradient(145deg,#160b3e,#4c176f 58%,#10194f)!important}
.event-title-preview-elle,.inventory-title-preview-elle{background:repeating-linear-gradient(0deg,transparent 0 17px,rgba(237,84,149,.16) 17px 18px),linear-gradient(135deg,#fff8fc,#ffd7e9)!important}
.event-title-preview-cher,.inventory-title-preview-cher{background:linear-gradient(90deg,transparent 0 28%,rgba(31,25,40,.14) 28% 31%,transparent 31% 67%,rgba(255,98,168,.25) 67% 71%,transparent 71%),linear-gradient(0deg,transparent 0 31%,rgba(31,25,40,.14) 31% 34%,transparent 34% 72%,rgba(255,98,168,.25) 72% 76%,transparent 76%),#fff1a2!important}
.event-title-preview-cher::after{display:none!important}
.post-mini-title>.milk-title.milk-title-font-paolo{font-size:.58rem!important}.post-mini-title>.milk-title.milk-title-font-elle{font-size:.61rem!important}.post-mini-title>.milk-title.milk-title-font-cher{font-size:.62rem!important}
.profile-display-title .milk-title.milk-title-font-paolo{font-size:.88em!important}.profile-display-title .milk-title.milk-title-font-elle{font-size:.9em!important}.profile-display-title .milk-title.milk-title-font-cher{font-size:.92em!important}
@media(prefers-reduced-motion:reduce){.milk-title.milk-title-font-paolo>.milk-title-ink,.milk-title.milk-title-font-paolo::before,.milk-title.milk-title-font-paolo::after,.milk-title.milk-title-font-elle>.milk-title-ink,.milk-title.milk-title-font-elle::before,.milk-title.milk-title-font-elle::after,.milk-title.milk-title-font-cher>.milk-title-ink,.milk-title.milk-title-font-cher::after{animation:none!important}}

.milk-title.milk-title-font-paolo>.milk-title-ink{font-family:'Audiowide',sans-serif!important}
.milk-title.milk-title-font-elle>.milk-title-ink{font-family:'Leckerli One',cursive!important}
.milk-title.milk-title-font-cher>.milk-title-ink{font-family:'Henny Penny',cursive!important}





/* Limited Y2K title: a tiny Kim Possible-style incoming message popup. */
.milk-title.milk-title-font-kim {
    position: relative;
    display: inline-flex;
    align-items: center;
    padding: .3em .82em .27em .7em;
    border: 2px solid #171c18;
    border-radius: .42em;
    background: linear-gradient(180deg, #dfff68 0%, #a8db31 100%) !important;
    box-shadow: inset 0 0 0 2px rgba(255,255,255,.48), 3px 3px 0 #f14b91;
    color: #182017 !important;
    -webkit-text-fill-color: #182017 !important;
    font-family: 'Pixelify Sans', ui-monospace, monospace !important;
    font-size: .82em;
    font-style: normal;
    font-weight: 700 !important;
    letter-spacing: .035em !important;
    line-height: 1.05 !important;
    white-space: nowrap;
    transform-origin: 50% 100%;
    isolation: isolate;
}
.milk-title.milk-title-font-kim > .milk-title-ink {
    position: relative;
    z-index: 2;
    display: inline-block;
    padding-left: .72em;
    background: none !important;
    color: #182017 !important;
    -webkit-text-fill-color: #182017 !important;
    font-family: 'Pixelify Sans', ui-monospace, monospace !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.65);
    transform: none;
}
.milk-title.milk-title-font-kim::before {
    content: '1';
    position: absolute;
    z-index: 4;
    top: -.46em;
    right: -.5em;
    display: grid;
    place-items: center;
    width: 1.22em;
    height: 1.22em;
    border: 1px solid #171c18;
    border-radius: 50%;
    background: #f14b91;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-family: 'Pixelify Sans', ui-monospace, monospace;
    font-size: .64em;
    line-height: 1;
    text-shadow: 0 1px 0 #7a1648;
    box-shadow: 1px 1px 0 #171c18;
}
.milk-title.milk-title-font-kim::after {
    content: '✉';
    position: absolute;
    z-index: 3;
    left: .48em;
    top: 50%;
    color: #182017 !important;
    -webkit-text-fill-color: #182017 !important;
    font-family: sans-serif;
    font-size: .62em;
    line-height: 1;
    text-shadow: none;
    transform: translateY(-52%);
}
.milk-title.milk-title-tier-1.milk-title-font-kim {
    animation: milk-kim-message-pop 6.2s cubic-bezier(.2,.78,.2,1) infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-kim::before {
    animation: milk-kim-unread-ping 6.2s ease-out infinite !important;
}
@keyframes milk-kim-message-pop {
    0%, 7% { opacity: 0; transform: translateY(7px) scale(.76); }
    13% { opacity: 1; transform: translateY(-2px) scale(1.055); }
    18%, 67% { opacity: 1; transform: translateY(0) scale(1); }
    72% { transform: translateX(-1px) rotate(-.4deg); }
    74% { transform: translateX(2px) rotate(.55deg); }
    76% { transform: translateX(-1px) rotate(-.25deg); }
    80% { opacity: 1; transform: translateX(0) scale(1); }
    88%, 100% { opacity: 0; transform: translateY(-3px) scale(.96); }
}
@keyframes milk-kim-unread-ping {
    0%, 11% { opacity: 0; transform: scale(.45); }
    17% { opacity: 1; transform: scale(1.28); }
    22%, 66% { opacity: 1; transform: scale(1); }
    71% { transform: scale(1.3); box-shadow: 0 0 0 3px rgba(241,75,145,.28), 1px 1px 0 #171c18; }
    78% { transform: scale(1); box-shadow: 1px 1px 0 #171c18; }
    88%, 100% { opacity: 0; transform: scale(.8); }
}
/* Exclusive title previews use white so members see their true contrast. */
.event-title-preview,
.event-title-preview-paolo,
.event-title-preview-elle,
.event-title-preview-cher,
.event-title-preview-kim {
    background: #fff !important;
}
.event-title-preview-cher::after { display: none !important; }
.post-mini-title > .milk-title.milk-title-font-kim { font-size: .57rem !important; }
.profile-display-title .milk-title.milk-title-font-kim { font-size: .84em !important; }
.forum-post-card .post-mini-title:has(> .milk-title-font-kim) {
    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: .18rem .25rem .28rem !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-font-kim,
    .milk-title.milk-title-font-kim::before { animation: none !important; opacity: 1 !important; transform: none !important; }
}
.site-animations-off .milk-title.milk-title-font-kim,
.site-animations-off .milk-title.milk-title-font-kim::before { animation: none !important; opacity: 1 !important; transform: none !important; }

/* AS IF! cleanup: lighten the plaid itself; no animated blur sheet. */
.milk-title.milk-title-font-cher {
    background:
        linear-gradient(90deg,transparent 0 26%,rgba(48,43,53,.66) 26% 31%,transparent 31% 68%,rgba(48,43,53,.34) 68% 73%,transparent 73%),
        linear-gradient(0deg,transparent 0 29%,rgba(48,43,53,.66) 29% 36%,transparent 36% 70%,rgba(48,43,53,.32) 70% 76%,transparent 76%),
        linear-gradient(135deg,#fffbd7,#ffe98e) !important;
}
.milk-title.milk-title-font-cher::before {
    content: none !important;
    display: none !important;
    animation: none !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

.milk-title.milk-title-font-cher > .milk-title-ink {
    -webkit-text-stroke: .45px rgba(255,255,255,.98);
    filter: drop-shadow(0 1px 0 #17131c) drop-shadow(0 0 1px rgba(255,255,255,.9));
}

/* CALL ME, BEEP ME reads like an actual messenger screen: solid black type. */
.milk-title.milk-title-font-kim,
.milk-title.milk-title-font-kim > .milk-title-ink,
.milk-title.milk-title-font-kim::after {
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
}
.milk-title.milk-title-font-kim > .milk-title-ink { text-shadow: none !important; }

.milk-title.milk-title.milk-title-font-kim.milk-title-font-kim > .milk-title-ink {
    background: none !important;
    background-image: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
    text-shadow: none !important;
}

.milk-title.milk-title.milk-title-font-cher.milk-title-font-cher > .milk-title-ink {
    background: linear-gradient(180deg,#ff69ad 0%,#ed2d82 48%,#bd155f 100%) !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-stroke: 0 transparent !important;
    paint-order: normal;
    text-shadow: 1px 1px 0 #fff, 2px 2px 0 rgba(255,255,255,.82), 3px 3px 1px rgba(23,19,28,.48) !important;
    filter: none !important;
}

/* Limited Y2K title: THAT'S SO stays put while FETCH stamps into the phrase. */
.milk-title.milk-title-font-fetch {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .3em .7em .34em;
    border: 2px solid #111;
    border-radius: .12em;
    background: #fff !important;
    box-shadow: 3px 3px 0 #f23887;
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
    font-family: 'DynaPuff', 'Baloo 2', sans-serif !important;
    font-size: .72em;
    font-style: normal;
    font-weight: 700 !important;
    line-height: 1.08 !important;
    white-space: nowrap;
    transform: rotate(-1deg);
    transform-origin: center;
    isolation: isolate;
}
.milk-title.milk-title.milk-title-font-fetch.milk-title-font-fetch > .milk-title-ink {
    position: relative;
    z-index: 2;
    display: inline-flex;
    align-items: baseline;
    gap: .24em;
    overflow: visible;
    background: none !important;
    background-image: none !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'DynaPuff', 'Baloo 2', sans-serif !important;
    font-size: 0 !important;
    text-shadow: none !important;
    transform: none;
}
.milk-title.milk-title-font-fetch > .milk-title-ink::before,
.milk-title.milk-title-font-fetch > .milk-title-ink::after {
    display: inline-block;
    font-family: 'DynaPuff', 'Baloo 2', sans-serif !important;
    font-size: .72rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .015em;
    white-space: nowrap;
}
.milk-title.milk-title-font-fetch > .milk-title-ink::before {
    content: 'THAT’S SO';
    color: #111 !important;
    -webkit-text-fill-color: #111 !important;
    text-shadow: 1px 1px 0 rgba(242,56,135,.28);
}
.milk-title.milk-title-font-fetch > .milk-title-ink::after {
    content: 'FETCH';
    color: #f23887 !important;
    -webkit-text-fill-color: #f23887 !important;
    -webkit-text-stroke: .45px #fff;
    paint-order: stroke fill;
    text-shadow: 1px 1px 0 #111;
    transform-origin: 50% 100%;
}
.milk-title.milk-title-font-fetch::before,
.milk-title.milk-title-font-fetch::after {
    content: none !important;
}
.milk-title.milk-title-tier-1.milk-title-font-fetch > .milk-title-ink::after {
    animation: milk-fetch-word-stamp 4.8s cubic-bezier(.18,.82,.24,1) infinite !important;
}
@keyframes milk-fetch-word-stamp {
    0%,16% { opacity:0; transform:translateY(-.85em) rotate(-7deg) scale(1.42); }
    24% { opacity:1; transform:translateY(.09em) rotate(1deg) scale(.9); }
    29% { transform:translateY(-.03em) rotate(-.5deg) scale(1.04); }
    34%,100% { opacity:1; transform:translateY(0) rotate(0) scale(1); }
}
.post-mini-title > .milk-title.milk-title-font-fetch { font-size: .56rem !important; }
.profile-display-title .milk-title.milk-title-font-fetch { font-size: .82em !important; }
.inventory-title-display.inventory-title-display .milk-title.milk-title-font-fetch { font-size: .58rem !important; }
.forum-post-card .post-mini-title:has(> .milk-title-font-fetch) {
    width:max-content !important;
    max-width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:.18rem .28rem .25rem !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-font-fetch > .milk-title-ink::after { animation:none !important; opacity:1 !important; transform:none !important; }
}
.site-animations-off .milk-title.milk-title-font-fetch > .milk-title-ink::after { animation:none !important; opacity:1 !important; transform:none !important; }
/* WHAT, LIKE IT'S HARD? cleanup: lowercase pink signature, no leading seal. */
.milk-title.milk-title-font-elle {
    padding: 0 .38em .16em !important;
}
.milk-title.milk-title.milk-title-font-elle.milk-title-font-elle > .milk-title-ink {
    background: linear-gradient(90deg,#ff168d 0%,#ff78b8 28%,#ffd0e5 50%,#ff8fc6 72%,#ff168d 100%) !important;
    background-image: linear-gradient(90deg,#ff168d 0%,#ff78b8 28%,#ffd0e5 50%,#ff8fc6 72%,#ff168d 100%) !important;
    background-size: 220% 100% !important;
    background-position: 50% 50% !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}
.milk-title.milk-title-font-elle::before {
    content: none !important;
    display: none !important;
    animation: none !important;
}

/* Inventory previews mirror the compact equipped mini-profile scale. */
.inventory-title-display.inventory-title-display .milk-title.milk-title-font-paolo {
    font-size: .58rem !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title-font-elle {
    font-size: .61rem !important;
}

/* Limited Y2K title: a compact Lizzie-style scrolling marquee. */
.milk-title.milk-title-font-hey_now {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 10.8em;
    max-width: 100%;
    padding: .22em 1.05em .25em;
    border-top: 2px solid #ff4d9e;
    border-bottom: 2px solid #8a62e8;
    border-radius: .5em;
    background: linear-gradient(90deg,#fff8fc 0%,#fff 48%,#f7f1ff 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(255,77,158,.18), 0 2px 0 rgba(66,28,91,.3);
    color: #ff4d9e !important;
    -webkit-text-fill-color: #ff4d9e !important;
    font-family: 'Cherry Bomb One', 'DynaPuff', sans-serif !important;
    font-size: .72em;
    font-style: normal;
    font-weight: 400 !important;
    letter-spacing: .025em !important;
    line-height: 1.05 !important;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    isolation: isolate;
}
.milk-title.milk-title.milk-title-font-hey_now.milk-title-font-hey_now > .milk-title-ink {
    position: relative;
    z-index: 2;
    display: inline-block;
    flex: 0 0 auto;
    background: linear-gradient(90deg,#ff3291 0%,#ff8cc5 32%,#8a62e8 65%,#ff3291 100%) !important;
    background-image: linear-gradient(90deg,#ff3291 0%,#ff8cc5 32%,#8a62e8 65%,#ff3291 100%) !important;
    background-size: 180% 100% !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'Cherry Bomb One', 'DynaPuff', sans-serif !important;
    text-shadow: none !important;
    transform: none;
    will-change: transform;
}
.milk-title.milk-title-font-hey_now::before,
.milk-title.milk-title-font-hey_now::after {
    position: absolute;
    z-index: 4;
    top: 50%;
    width: 1.05em;
    color: #ff4d9e !important;
    -webkit-text-fill-color: #ff4d9e !important;
    font-family: sans-serif;
    font-size: .48em;
    line-height: 1;
    text-align: center;
    text-shadow: 0 1px 0 #51245f;
    transform: translateY(-52%);
    pointer-events: none;
}
.milk-title.milk-title-font-hey_now::before {
    content: '✦';
    left: .2em;
    background: linear-gradient(90deg,#fff8fc 55%,transparent);
}
.milk-title.milk-title-font-hey_now::after {
    content: '✦';
    right: .2em;
    background: linear-gradient(270deg,#f7f1ff 55%,transparent);
}
.milk-title.milk-title-tier-1.milk-title-font-hey_now > .milk-title-ink {
    animation: milk-hey-now-marquee 5.8s linear infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-hey_now::before,
.milk-title.milk-title-tier-1.milk-title-font-hey_now::after {
    animation: milk-hey-now-twinkle 2.9s ease-in-out infinite alternate !important;
}
.milk-title.milk-title-tier-1.milk-title-font-hey_now::after {
    animation-delay: -1.45s !important;
}
@keyframes milk-hey-now-marquee {
    from { transform: translateX(10.8em); }
    to { transform: translateX(-10.8em); }
}
@keyframes milk-hey-now-twinkle {
    0%,35% { opacity:.55; filter:brightness(1); }
    70%,100% { opacity:1; filter:brightness(1.35) drop-shadow(0 0 2px #ff8cc5); }
}
.post-mini-title > .milk-title.milk-title-font-hey_now {
    width: 10.8em;
    font-size: .56rem !important;
}
.profile-display-title .milk-title.milk-title-font-hey_now {
    font-size: .82em !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title-font-hey_now {
    font-size: .56rem !important;
}
.forum-post-card .post-mini-title:has(> .milk-title-font-hey_now) {
    width:max-content !important;
    max-width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:.15rem .2rem .22rem !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-font-hey_now > .milk-title-ink,
    .milk-title.milk-title-font-hey_now::before,
    .milk-title.milk-title-font-hey_now::after { animation:none !important; transform:none !important; opacity:1 !important; }
}
.site-animations-off .milk-title.milk-title-font-hey_now > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-hey_now::before,
.site-animations-off .milk-title.milk-title-font-hey_now::after { animation:none !important; transform:none !important; opacity:1 !important; }
/* Final AS IF color lock: black lettering over its offset white backing. */
html body .milk-title.milk-title.milk-title-font-cher.milk-title-font-cher > .milk-title-ink {
    background: none !important;
    background-image: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    color: #111217 !important;
    -webkit-text-fill-color: #111217 !important;
    -webkit-text-stroke: 0 transparent !important;
    text-shadow: 1px 1px 0 #fff, 2px 2px 0 rgba(255,255,255,.9), 3px 3px 1px rgba(23,19,28,.52) !important;
}

/* Limited Y2K title: a tiny blue fairy calls for attention, then takes flight. */
.milk-title.milk-title-font-navi {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 9.4em;
    max-width: 100%;
    min-height: 2.15em;
    padding: .28em 1.05em .3em;
    border: 1px solid rgba(93,190,255,.68);
    border-radius: 1.2em;
    background: linear-gradient(180deg,#ffffff 0%,#edfaff 58%,#dcecff 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.9), 0 2px 0 rgba(54,103,180,.28), 0 0 .55em rgba(77,209,255,.2);
    color: #183864 !important;
    -webkit-text-fill-color: #183864 !important;
    font-family: 'Cinzel Decorative', 'Eagle Lake', Georgia, serif !important;
    font-size: .75em;
    font-style: normal;
    font-weight: 700 !important;
    letter-spacing: .045em !important;
    line-height: 1 !important;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    isolation: isolate;
}
.milk-title.milk-title.milk-title-font-navi > .milk-title-ink {
    position: relative;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 1.35em;
    background: linear-gradient(180deg,#142b53 0%,#315d9d 55%,#132745 100%) !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'Cinzel Decorative', 'Eagle Lake', Georgia, serif !important;
    font-size: .82em !important;
    font-weight: 700 !important;
    letter-spacing: .045em !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.8) !important;
}
.milk-title.milk-title-font-navi::before,
.milk-title.milk-title-font-navi::after {
    content: '';
    position: absolute;
    z-index: 5;
    left: 50%;
    top: 50%;
    opacity: 1;
    pointer-events: none;
}
/* translucent paired wings */
.milk-title.milk-title-font-navi::before {
    width: 1.35em;
    height: .82em;
    margin: -.41em 0 0 -.675em;
    background:
        radial-gradient(ellipse at 20% 50%,rgba(237,251,255,.96) 0 34%,rgba(135,207,255,.72) 36% 52%,transparent 55%),
        radial-gradient(ellipse at 80% 50%,rgba(237,251,255,.96) 0 34%,rgba(135,207,255,.72) 36% 52%,transparent 55%);
    filter: drop-shadow(0 0 2px rgba(102,209,255,.9));
    transform: translate(3.35em,0) rotate(-8deg);
}
/* glowing fairy core */
.milk-title.milk-title-font-navi::after {
    width: .58em;
    height: .58em;
    margin: -.29em 0 0 -.29em;
    border-radius: 50%;
    background: radial-gradient(circle at 42% 35%,#fff 0 15%,#c9fbff 22%,#55dcff 48%,#128fe6 68%,rgba(18,143,230,0) 74%) !important;
    box-shadow: 0 0 .18em #fff,0 0 .5em #53dcff,0 0 .82em rgba(33,142,255,.72);
    transform: translate(3.35em,0);
}
.milk-title.milk-title-tier-1.milk-title-font-navi > .milk-title-ink {
    font-size: 0 !important;
    background: none !important;
    text-shadow: none !important;
}
.milk-title.milk-title-tier-1.milk-title-font-navi > .milk-title-ink::before,
.milk-title.milk-title-tier-1.milk-title-font-navi > .milk-title-ink::after {
    position: absolute;
    left: 50%;
    top: 50%;
    display: block;
    overflow: hidden;
    color: #183864 !important;
    -webkit-text-fill-color: #183864 !important;
    font-family: 'Cinzel Decorative', 'Eagle Lake', Georgia, serif !important;
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .055em;
    line-height: 1;
    white-space: nowrap;
    text-shadow: 0 1px 0 #fff,0 0 4px rgba(82,211,255,.38) !important;
    transform: translate(-50%,-50%);
    pointer-events: none;
}
.milk-title.milk-title-tier-1.milk-title-font-navi > .milk-title-ink::before {
    content: 'HEY!';
    animation: milk-navi-type-hey 8.4s linear infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-navi > .milk-title-ink::after {
    content: 'LISTEN!';
    animation: milk-navi-type-listen 8.4s linear infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-navi::before {
    animation: milk-navi-wings-flight 8.4s ease-in-out infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-navi::after {
    animation: milk-navi-orb-flight 8.4s ease-in-out infinite !important;
}
@keyframes milk-navi-type-hey {
    0%,3% { opacity:0; clip-path:inset(0 100% 0 0); }
    4% { opacity:1; clip-path:inset(0 100% 0 0); }
    8% { clip-path:inset(0 75% 0 0); }
    12% { clip-path:inset(0 50% 0 0); }
    16% { clip-path:inset(0 25% 0 0); }
    20%,27% { opacity:1; clip-path:inset(0 0 0 0); }
    33%,100% { opacity:0; clip-path:inset(0 0 0 0); }
}
@keyframes milk-navi-type-listen {
    0%,34% { opacity:0; clip-path:inset(0 100% 0 0); }
    35% { opacity:1; clip-path:inset(0 100% 0 0); }
    39% { clip-path:inset(0 84% 0 0); }
    43% { clip-path:inset(0 68% 0 0); }
    47% { clip-path:inset(0 52% 0 0); }
    51% { clip-path:inset(0 36% 0 0); }
    55% { clip-path:inset(0 20% 0 0); }
    59%,63% { opacity:1; clip-path:inset(0 0 0 0); }
    69%,100% { opacity:0; clip-path:inset(0 0 0 0); }
}
@keyframes milk-navi-orb-flight {
    0%,68% { opacity:0; transform:translate(-3.8em,.1em) scale(.72); }
    72% { opacity:1; transform:translate(-3.25em,-.3em) scale(1); }
    77% { transform:translate(-1.7em,-.67em) scale(.94); }
    82% { transform:translate(.05em,.45em) scale(1.06); }
    87% { transform:translate(1.75em,-.55em) scale(.96); }
    92% { opacity:1; transform:translate(3.15em,.22em) scale(1.08); }
    97%,100% { opacity:0; transform:translate(3.7em,-.38em) scale(.74); }
}
@keyframes milk-navi-wings-flight {
    0%,68% { opacity:0; transform:translate(-3.8em,.1em) rotate(-20deg) scale(.72,.45); }
    72% { opacity:.95; transform:translate(-3.25em,-.3em) rotate(12deg) scale(1,.62); }
    77% { transform:translate(-1.7em,-.67em) rotate(-15deg) scale(.94,1); }
    82% { transform:translate(.05em,.45em) rotate(18deg) scale(1.06,.5); }
    87% { transform:translate(1.75em,-.55em) rotate(-12deg) scale(.96,1); }
    92% { opacity:.95; transform:translate(3.15em,.22em) rotate(15deg) scale(1.08,.55); }
    97%,100% { opacity:0; transform:translate(3.7em,-.38em) rotate(-18deg) scale(.74,.42); }
}
.post-mini-title > .milk-title.milk-title-font-navi {
    width: 9.4em;
    font-size: .59rem !important;
}
.profile-display-title .milk-title.milk-title-font-navi { font-size: .84em !important; }
.inventory-title-display.inventory-title-display .milk-title.milk-title-font-navi { font-size: .59rem !important; }
.forum-post-card .post-mini-title:has(> .milk-title-font-navi) {
    width:max-content !important;
    max-width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding:.15rem .2rem .22rem !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-tier-1.milk-title-font-navi > .milk-title-ink {
        font-size:.82em !important;
        background:linear-gradient(180deg,#142b53 0%,#315d9d 55%,#132745 100%) !important;
        background-clip:text !important;
        -webkit-background-clip:text !important;
        color:transparent !important;
        -webkit-text-fill-color:transparent !important;
    }
    .milk-title.milk-title-font-navi > .milk-title-ink::before,
    .milk-title.milk-title-font-navi > .milk-title-ink::after { display:none !important; animation:none !important; }
    .milk-title.milk-title-font-navi::before { animation:none !important; opacity:1 !important; transform:translate(3.35em,0) rotate(-8deg) !important; }
    .milk-title.milk-title-font-navi::after { animation:none !important; opacity:1 !important; transform:translate(3.35em,0) !important; }
}
.site-animations-off .milk-title.milk-title-tier-1.milk-title-font-navi > .milk-title-ink {
    font-size:.82em !important;
    background:linear-gradient(180deg,#142b53 0%,#315d9d 55%,#132745 100%) !important;
    background-clip:text !important;
    -webkit-background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
}
.site-animations-off .milk-title.milk-title-font-navi > .milk-title-ink::before,
.site-animations-off .milk-title.milk-title-font-navi > .milk-title-ink::after { display:none !important; animation:none !important; }
.site-animations-off .milk-title.milk-title-font-navi::before { animation:none !important; opacity:1 !important; transform:translate(3.35em,0) rotate(-8deg) !important; }
.site-animations-off .milk-title.milk-title-font-navi::after { animation:none !important; opacity:1 !important; transform:translate(3.35em,0) !important; }
/* Limited Y2K title: a life-sim greeting with its own plumbob-inspired hello. */
.milk-title.milk-title-font-sul_sul {
    position: relative;
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    width: 7.6em;
    max-width: 100%;
    min-height: 2.45em;
    padding: .86em .82em .28em;
    border: 1px solid rgba(44,177,118,.62);
    border-radius: .72em 1.1em .72em 1.1em;
    background: linear-gradient(145deg,#f7fff8 0%,#ddf8df 52%,#d5f7fa 100%) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.92),0 2px 0 rgba(23,112,84,.3),0 0 .5em rgba(53,212,138,.16);
    color: #16764d !important;
    -webkit-text-fill-color: #16764d !important;
    font-family: 'Fredoka','DynaPuff',sans-serif !important;
    font-size: .78em;
    font-style: normal;
    font-weight: 700 !important;
    letter-spacing: .055em !important;
    line-height: 1 !important;
    white-space: nowrap;
    overflow: hidden;
    box-sizing: border-box;
    isolation: isolate;
}
.milk-title.milk-title.milk-title-font-sul_sul > .milk-title-ink {
    position: relative;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 1em;
    background: linear-gradient(90deg,#168746 0%,#38c75f 42%,#12aabd 100%) !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'Fredoka','DynaPuff',sans-serif !important;
    font-size: .86em !important;
    font-weight: 700 !important;
    letter-spacing: .055em !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.95) !important;
}
/* The bright green diamond stays recognizable without copying an external sprite. */
.milk-title.milk-title-font-sul_sul::before {
    content:'';
    position:absolute;
    z-index:5;
    left:50%;
    top:.14em;
    width:.64em;
    height:1.02em;
    background:conic-gradient(from 45deg at 50% 44%,#30b94f 0 25%,#30b94f 0 50%,#159a4b 0 75%,#43d75d 0) !important;
    clip-path:polygon(50% 0,100% 43%,50% 100%,0 43%);
    box-shadow:none;
    filter:drop-shadow(0 1px 0 #0a6a48) drop-shadow(0 0 3px rgba(83,237,105,.68));
    transform:translateX(-50%);
    transform-origin:50% 55%;
    pointer-events:none;
}
.milk-title.milk-title-font-sul_sul::after {
    content:'✦';
    position:absolute;
    z-index:6;
    left:calc(50% + .55em);
    top:.05em;
    color:#eaffb7 !important;
    -webkit-text-fill-color:#eaffb7 !important;
    font:.46em/1 sans-serif;
    text-shadow:0 0 3px #4ade80,0 0 5px rgba(32,191,209,.7);
    opacity:.82;
    pointer-events:none;
}
.milk-title.milk-title-tier-1.milk-title-font-sul_sul > .milk-title-ink {
    font-size:0 !important;
    background:none !important;
    text-shadow:none !important;
}
.milk-title.milk-title-tier-1.milk-title-font-sul_sul > .milk-title-ink::before,
.milk-title.milk-title-tier-1.milk-title-font-sul_sul > .milk-title-ink::after {
    content:'SUL';
    position:absolute;
    bottom:0;
    display:block;
    color:#16764d !important;
    -webkit-text-fill-color:#16764d !important;
    font-family:'Fredoka','DynaPuff',sans-serif !important;
    font-size:.82rem;
    font-weight:700;
    letter-spacing:.055em;
    line-height:1;
    text-shadow:0 1px 0 #fff,0 0 3px rgba(69,215,132,.28) !important;
    transform-origin:50% 100%;
    pointer-events:none;
}
.milk-title.milk-title-tier-1.milk-title-font-sul_sul > .milk-title-ink::before {
    left:13%;
    animation:milk-sul-left-hello 5.6s cubic-bezier(.22,.72,.22,1) infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-sul_sul > .milk-title-ink::after {
    right:13%;
    animation:milk-sul-right-hello 5.6s cubic-bezier(.22,.72,.22,1) infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-sul_sul::before {
    animation:milk-sul-diamond 5.6s ease-in-out infinite !important;
}
.milk-title.milk-title-tier-1.milk-title-font-sul_sul::after {
    animation:milk-sul-spark 5.6s ease-in-out infinite !important;
}
@keyframes milk-sul-left-hello {
    0%,18%,70%,100%{transform:translateY(0) rotate(0);color:#16764d;-webkit-text-fill-color:#16764d}
    27%{transform:translateY(-.26em) rotate(-8deg) scale(1.08);color:#23a955;-webkit-text-fill-color:#23a955}
    35%{transform:translateY(.03em) rotate(3deg) scale(1.02)}
    43%{transform:translateY(-.09em) rotate(-2deg)}
}
@keyframes milk-sul-right-hello {
    0%,35%,87%,100%{transform:translateY(0) rotate(0);color:#16825b;-webkit-text-fill-color:#16825b}
    48%{transform:translateY(-.26em) rotate(8deg) scale(1.08);color:#0ea9b4;-webkit-text-fill-color:#0ea9b4}
    56%{transform:translateY(.03em) rotate(-3deg) scale(1.02)}
    64%{transform:translateY(-.09em) rotate(2deg)}
}
@keyframes milk-sul-diamond {
    0%,15%,75%,100%{transform:translateX(-50%) translateY(0) rotate(0) scale(1);filter:drop-shadow(0 1px 0 #0a6a48) drop-shadow(0 0 3px rgba(83,237,105,.58))}
    29%{transform:translateX(-50%) translateY(-.1em) rotate(-8deg) scale(1.09)}
    51%{transform:translateX(-50%) translateY(-.16em) rotate(8deg) scale(1.13);filter:drop-shadow(0 1px 0 #0a6a48) drop-shadow(0 0 6px rgba(83,237,105,.95))}
    64%{transform:translateX(-50%) translateY(-.05em) rotate(-3deg) scale(1.04)}
}
@keyframes milk-sul-spark {
    0%,18%,72%,100%{opacity:.35;transform:scale(.65) rotate(0)}
    31%,54%{opacity:1;transform:scale(1.45) rotate(95deg)}
    64%{opacity:.72;transform:scale(.9) rotate(160deg)}
}
.post-mini-title > .milk-title.milk-title-font-sul_sul {width:7.6em;font-size:.61rem !important;}
.profile-display-title .milk-title.milk-title-font-sul_sul {font-size:.86em !important;}
.inventory-title-display.inventory-title-display .milk-title.milk-title-font-sul_sul {font-size:.61rem !important;}
.forum-post-card .post-mini-title:has(> .milk-title-font-sul_sul){width:max-content!important;max-width:100%!important;min-width:0!important;min-height:0!important;margin-left:auto!important;margin-right:auto!important;padding:.12rem .18rem .2rem!important;border:0!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
@media(prefers-reduced-motion:reduce){
    .milk-title.milk-title-tier-1.milk-title-font-sul_sul > .milk-title-ink{font-size:.86em!important;background:linear-gradient(90deg,#168746,#38c75f 42%,#12aabd)!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important}
    .milk-title.milk-title-font-sul_sul > .milk-title-ink::before,.milk-title.milk-title-font-sul_sul > .milk-title-ink::after{display:none!important;animation:none!important}
    .milk-title.milk-title-font-sul_sul::before,.milk-title.milk-title-font-sul_sul::after{animation:none!important}
}
.site-animations-off .milk-title.milk-title-tier-1.milk-title-font-sul_sul > .milk-title-ink{font-size:.86em!important;background:linear-gradient(90deg,#168746,#38c75f 42%,#12aabd)!important;background-clip:text!important;-webkit-background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important}
.site-animations-off .milk-title.milk-title-font-sul_sul > .milk-title-ink::before,.site-animations-off .milk-title.milk-title-font-sul_sul > .milk-title-ink::after{display:none!important;animation:none!important}
.site-animations-off .milk-title.milk-title-font-sul_sul::before,.site-animations-off .milk-title.milk-title-font-sul_sul::after{animation:none!important}
/* Store and inventory previews deliberately reuse the mini-profile title frame. */
.commerce-title-display{
    --mini-profile-accent:var(--accent-primary);
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:max-content;
    max-width:100%;
    margin-inline:auto;
    padding:.16rem .5rem!important;
    border:1px solid color-mix(in srgb,var(--mini-profile-accent) 24%,var(--border-color));
    border-radius:.4rem;
    background:color-mix(in srgb,var(--bg-card-inner) 88%,transparent);
    box-shadow:0 1px 0 color-mix(in srgb,#fff 65%,transparent);
}
.commerce-title-display:has(> .milk-title-font-cher){min-width:0!important;min-height:0!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;text-shadow:none!important}
.commerce-title-display:has(> .milk-title-font-kim){min-width:0!important;min-height:0!important;padding:.18rem .25rem .28rem!important;border:0!important;background:transparent!important;box-shadow:none!important}
.commerce-title-display:has(> .milk-title-font-fetch){min-width:0!important;min-height:0!important;padding:.18rem .28rem .25rem!important;border:0!important;background:transparent!important;box-shadow:none!important}
.commerce-title-display:has(> .milk-title-font-hey_now),.commerce-title-display:has(> .milk-title-font-navi){min-width:0!important;min-height:0!important;padding:.15rem .2rem .22rem!important;border:0!important;background:transparent!important;box-shadow:none!important}
.commerce-title-display:has(> .milk-title-font-sul_sul){min-width:0!important;min-height:0!important;padding:.12rem .18rem .2rem!important;border:0!important;background:transparent!important;box-shadow:none!important}
/* Exclusive inventory tier 0 means animation off. Preserve each title's
   designed readable ink instead of inheriting a surrounding card color. */
.milk-title.milk-title.milk-title-tier-0.milk-title-font-navi > .milk-title-ink {
    background: none !important;
    background-image: none !important;
    color: #183864 !important;
    -webkit-text-fill-color: #183864 !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.88), 0 0 3px rgba(82,211,255,.24) !important;
}
.milk-title.milk-title.milk-title-tier-0.milk-title-font-sul_sul > .milk-title-ink {
    background: none !important;
    background-image: none !important;
    color: #16764d !important;
    -webkit-text-fill-color: #16764d !important;
    text-shadow: 0 1px 0 rgba(255,255,255,.95), 0 0 3px rgba(69,215,132,.2) !important;
}
/* Paolo owns a compact stage backdrop everywhere it appears. This keeps the
   pale spotlight ink and music notes readable without depending on the site,
   profile, post, shop, or inventory background beneath it. */
.milk-title.milk-title-font-paolo {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: .42em 1.35em .46em !important;
    border: 1px solid rgba(80, 235, 225, .62);
    border-radius: .62em;
    background:
        radial-gradient(ellipse at 18% 0%, rgba(41, 235, 226, .42), transparent 43%),
        radial-gradient(ellipse at 82% 0%, rgba(255, 69, 161, .46), transparent 43%),
        linear-gradient(145deg, #160b3e, #4c176f 58%, #10194f) !important;
    box-shadow:
        inset 0 0 0 1px rgba(255, 255, 255, .18),
        0 2px 0 rgba(16, 9, 57, .38),
        0 0 .45em rgba(42, 224, 220, .22);
}
.post-mini-title:has(> .milk-title-font-paolo),
.commerce-title-display:has(> .milk-title-font-paolo) {
    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}
/* The public profile uses the same title presentation as forum mini profiles. */
.profile-identity > .profile-page-title {
    margin: 0 0 .12rem !important;
}

/* Just a Baby: full Tier 0–4 progression, ending in a tiny toddling bounce. */
.milk-title.milk-title-tier-4.milk-title-font-just_a_baby {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: .28em .62em .25em !important;
    border: 1px solid rgba(244, 169, 194, .34);
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,250,229,.88)) !important;
    box-shadow: none;
    isolation: isolate;
    overflow: visible;
}
.milk-title.milk-title-tier-4.milk-title-font-just_a_baby::before {
    content: '';
    position: absolute;
    z-index: 0;
    top: -.09em;
    left: 20%;
    width: 60%;
    height: .15em;
    border-radius: 999px;
    background: linear-gradient(90deg,
        #f4a9c2 0 17%,
        #ffc9a7 17% 34%,
        #f4d978 34% 51%,
        #b9ddb5 51% 68%,
        #a9d8eb 68% 84%,
        #c7b7e7 84% 100%);
    box-shadow: 0 1px 0 rgba(255,255,255,.9);
    opacity: .9;
    pointer-events: none;
}
.milk-title.milk-title-tier-4.milk-title-font-just_a_baby::after {
    content: none;
    display: none;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-just_a_baby > .milk-title-ink {
    position: relative;
    z-index: 1;
    display: inline-block;
    background-image: linear-gradient(100deg,#e978a2 0%,#ee91ae 35%,#efa96f 68%,#d7b641 100%) !important;
    background-color: transparent !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'Cherry Bomb One', 'DynaPuff', 'Fredoka', sans-serif !important;
    font-size: 1.08em;
    font-style: normal !important;
    font-weight: 400 !important;
    letter-spacing: .025em !important;
    line-height: 1 !important;
    text-shadow: 0 1px 0 rgba(151,88,112,.22), 0 2px 2px rgba(206,136,162,.12) !important;
    transform-origin: 50% 100%;
    will-change: transform;
}
.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-just_a_baby > .milk-title-ink {
    background-image: linear-gradient(90deg,#e978a2,#efa96f,#d7b641,#77ad78,#5b9fbd,#9178bd,#e978a2) !important;
    background-size: 300% 100% !important;
    animation: milk-just-a-baby-rainbow-flow 3.2s ease-in-out infinite alternate !important;
}
@keyframes milk-just-a-baby-rainbow-flow {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-just_a_baby .milk-title-letter {
    background-image: linear-gradient(100deg,#d95f8d 0%,#e6789d 35%,#e69a55 68%,#c39e2f 100%) !important;
    background-size: 180% 100% !important;
    animation: none !important;
    transform: none !important;
    filter: none !important;
    -webkit-text-stroke: 0 transparent !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-just_a_baby > .milk-title-ink {
    animation: milk-just-a-baby-toddle 2.6s ease-in-out infinite !important;
    transform-origin: 50% 100%;
    text-shadow: none !important;
    filter: none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-just_a_baby .milk-title-letter {
    text-shadow: none !important;
}
@keyframes milk-just-a-baby-toddle {
    0%,100% { transform: translate(0,0) rotate(-.15deg) scaleX(1.006) scaleY(.994); }
    22% { transform: translate(-.035em,-.028em) rotate(-.48deg) scaleX(.984) scaleY(1.024); }
    44% { transform: translate(-.01em,.012em) rotate(.08deg) scaleX(1.026) scaleY(.978); }
    66% { transform: translate(.035em,-.026em) rotate(.46deg) scaleX(.985) scaleY(1.022); }
    84% { transform: translate(.01em,.01em) rotate(-.06deg) scaleX(1.022) scaleY(.982); }
}
.post-mini-title > .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-just_a_baby {
    font-size: .8rem !important;
}
.profile-display-title .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-just_a_baby {
    font-size: 1.04em !important;
}
.inventory-title-display.inventory-title-display .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-just_a_baby {
    font-size: .8rem !important;
}
.forum-post-card .post-mini-title:has(> .milk-title-tier-4.milk-title-font-just_a_baby),
.commerce-title-display:has(> .milk-title-tier-4.milk-title-font-just_a_baby) {
    width: max-content !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
    padding: .14rem .2rem .18rem !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-tier-3.milk-title-font-just_a_baby > .milk-title-ink,
    .milk-title.milk-title-tier-4.milk-title-font-just_a_baby > .milk-title-ink {
        animation: none !important;
        transform: none !important;
        background-position: 50% 50% !important;
    }
}
.site-animations-off .milk-title.milk-title-tier-3.milk-title-font-just_a_baby > .milk-title-ink,
.site-animations-off .milk-title.milk-title-tier-4.milk-title-font-just_a_baby > .milk-title-ink {
    animation: none !important;
    transform: none !important;
    background-position: 50% 50% !important;
}

/* Glitter.gif: hot-pink/aqua pixel type with a browser-era rainbow shimmer. */
@property --glitter-letter-color {
    syntax: '<color>';
    inherits: false;
    initial-value: #f02d9d;
}
.milk-title.milk-title.milk-title.milk-title-tier-1.milk-title-font-glitter_gif > .milk-title-ink {
    background-image: linear-gradient(90deg,#f02d9d 0%,#ff69c5 30%,#9b6de3 62%,#24d8d2 100%) !important;
    background-size: 100% 100% !important;
    background-position: 50% 50% !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-glitter_gif > .milk-title-ink {
    position: relative;
    display: inline-block;
    background-image: linear-gradient(90deg,#f02d9d 0%,#ff69c5 30%,#9b6de3 62%,#24d8d2 100%) !important;
    background-color: transparent !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'Audiowide', 'Pixelify Sans', ui-sans-serif, sans-serif !important;
    font-size: 1em;
    font-style: normal !important;
    font-weight: 400 !important;
    letter-spacing: .012em !important;
    line-height: 1.08 !important;
    text-shadow: none !important;
    -webkit-text-stroke: .28px rgba(79,31,92,.42) !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-glitter_gif > .milk-title-ink {
    background-image: linear-gradient(90deg,#f02d9d 0%,#ff69c5 18%,#9b6de3 38%,#4e8ff2 57%,#24d8d2 76%,#9b6de3 90%,#f02d9d 100%) !important;
    background-size: 300% 100% !important;
    animation: milk-glitter-web-flow 2.8s ease-in-out infinite alternate !important;
}
@keyframes milk-glitter-web-flow {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-glitter_gif > .milk-title-ink {
    position: relative !important;
    display: inline-flex !important;
    align-items: baseline;
    overflow: visible !important;
    background: none !important;
    color: inherit !important;
    -webkit-text-fill-color: initial !important;
    filter: none !important;
    text-shadow: none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-glitter_gif .milk-title-letter {
    position: relative;
    display: inline-block;
    overflow: visible;
    background: none !important;
    background-image: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    color: var(--glitter-letter-color, #f02d9d) !important;
    -webkit-text-fill-color: currentColor !important;
    -webkit-text-stroke: .24px rgba(79,31,92,.38) !important;
    filter: none !important;
    text-shadow: none !important;
    animation: milk-glitter-color-wave 4.8s ease-in-out infinite !important;
    animation-delay: calc(var(--letter-index, 0) * -.17s) !important;
    transform: none !important;
}
@keyframes milk-glitter-color-wave {
    0%,100% { --glitter-letter-color:#f02d9d; }
    24% { --glitter-letter-color:#ff69c5; }
    48% { --glitter-letter-color:#9b6de3; }
    72% { --glitter-letter-color:#24d8d2; }
    88% { --glitter-letter-color:#4e8ff2; }
}
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(1) { --glitter-spark-delay:0s; --glitter-star-top:-.58em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(2) { --glitter-spark-delay:.88s; --glitter-star-top:.66em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(3) { --glitter-spark-delay:1.76s; --glitter-star-top:-.72em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(4) { --glitter-spark-delay:.22s; --glitter-star-top:.62em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(5) { --glitter-spark-delay:1.1s; --glitter-star-top:-.66em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(6) { --glitter-spark-delay:1.98s; --glitter-star-top:.7em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(7) { --glitter-spark-delay:.44s; --glitter-star-top:-.76em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(8) { --glitter-spark-delay:1.32s; --glitter-star-top:.64em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(9) { --glitter-spark-delay:2.2s; --glitter-star-top:-.62em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(10) { --glitter-spark-delay:.66s; --glitter-star-top:.7em; }
.milk-title-font-glitter_gif.milk-title-tier-4 .milk-title-letter:nth-child(11) { --glitter-spark-delay:1.54s; --glitter-star-top:-.72em; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-glitter_gif .milk-title-letter::after {
    content: '✦' !important;
    position: absolute;
    z-index: 3;
    display: block !important;
    top: var(--glitter-star-top, -.58em);
    left: 50%;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    font-family: Arial, sans-serif;
    font-size: .48em;
    line-height: 1;
    text-shadow: none !important;
    -webkit-text-stroke: .4px #c83b9a !important;
    opacity: 0;
    pointer-events: none;
    animation: milk-glitter-sparkle-hop 5.2s ease-out infinite !important;
    animation-delay: var(--glitter-spark-delay, 0s) !important;
}
@keyframes milk-glitter-letter-rainbow {
    from { background-position: 0% 50%; }
    to { background-position: 220% 50%; }
}
@keyframes milk-glitter-sparkle-hop {
    0%,5%,11%,100% { opacity:0; transform:translateX(-50%) scale(.35) rotate(-35deg); }
    6% { opacity:1; transform:translateX(-50%) scale(1.12) rotate(0deg); }
    8% { opacity:1; transform:translateX(-50%) scale(.9) rotate(38deg); }
    10% { opacity:.55; transform:translateX(-50%) scale(.62) rotate(85deg); }
}
.post-mini-title > .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-glitter_gif {
    font-size: .9rem !important;
}
.profile-display-title .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-glitter_gif {
    font-size: 1.08em !important;
}
.inventory-title-display.inventory-title-display .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-glitter_gif {
    font-size: .9rem !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-font-glitter_gif > .milk-title-ink,
    .milk-title.milk-title-font-glitter_gif .milk-title-letter,
    .milk-title.milk-title-font-glitter_gif .milk-title-letter::after {
        animation: none !important;
        transform: none !important;
        background-position: 50% 50% !important;
    }
    .milk-title.milk-title-font-glitter_gif .milk-title-letter::after { display:none !important; }
}
.site-animations-off .milk-title.milk-title-font-glitter_gif > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-glitter_gif .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-glitter_gif .milk-title-letter::after {
    animation: none !important;
    transform: none !important;
    background-position: 50% 50% !important;
}
.site-animations-off .milk-title.milk-title-font-glitter_gif .milk-title-letter::after { display:none !important; }

/* Rainy Day: handwritten storm colors with tiny falling droplets. */
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-rainy_day > .milk-title-ink {
    position: relative;
    display: inline-block;
    background-image: linear-gradient(100deg,#526f91 0%,#6688ad 34%,#8588bf 67%,#a5a5df 100%) !important;
    background-color: transparent !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'Satisfy', 'Leckerli One', cursive !important;
    font-size: 1.24em;
    font-style: normal !important;
    font-weight: 400 !important;
    letter-spacing: .012em !important;
    line-height: 1.08 !important;
    text-shadow: none !important;
    -webkit-text-stroke: .18px rgba(52,66,96,.32) !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-rainy_day > .milk-title-ink {
    background-image: linear-gradient(90deg,#526f91 0%,#6f91b8 22%,#8989c2 45%,#b09fd8 68%,#7887b7 84%,#526f91 100%) !important;
    background-size: 300% 100% !important;
    animation: milk-rainy-day-storm-flow 3.8s ease-in-out infinite alternate !important;
}
@keyframes milk-rainy-day-storm-flow {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-rainy_day > .milk-title-ink {
    position: relative !important;
    display: inline-flex !important;
    align-items: baseline;
    overflow: visible !important;
    background: none !important;
    color: inherit !important;
    -webkit-text-fill-color: initial !important;
    filter: none !important;
    text-shadow: none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-rainy_day .milk-title-letter {
    position: relative;
    display: inline-block;
    overflow: visible;
    background: none !important;
    background-image: none !important;
    background-clip: border-box !important;
    -webkit-background-clip: border-box !important;
    color: var(--rainy-letter-color) !important;
    -webkit-text-fill-color: currentColor !important;
    -webkit-text-stroke: .18px rgba(52,66,96,.3) !important;
    filter: none !important;
    text-shadow: none !important;
    animation: none !important;
    transform: none !important;
}
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(1) { --rainy-letter-color:#526f91; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(2) { --rainy-letter-color:#5d7ba0; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(3) { --rainy-letter-color:#6987ae; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(4) { --rainy-letter-color:#7790b7; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(5) { --rainy-letter-color:#858fbe; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(6) { --rainy-letter-color:#908fc8; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(7) { --rainy-letter-color:#9997d1; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(8) { --rainy-letter-color:#a09ed8; }
.milk-title-font-rainy_day.milk-title-tier-4 .milk-title-letter:nth-child(9) { --rainy-letter-color:#a5a5df; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-rainy_day .milk-title-letter::after {
    content: '' !important;
    position: absolute;
    z-index: 3;
    display: block !important;
    top: -.32em;
    left: 50%;
    width: .12em;
    height: .18em;
    border-radius: 70% 45% 68% 45%;
    background: #79a9d0;
    box-shadow: none;
    opacity: 0;
    pointer-events: none;
    transform: translateX(-50%) rotate(45deg);
    animation: milk-rainy-day-drop 2.55s ease-in infinite !important;
    animation-delay: calc(var(--letter-index, 0) * -.23s) !important;
}
@keyframes milk-rainy-day-drop {
    0%,16% { opacity:0; transform:translate(-50%,-.2em) rotate(45deg) scale(.65); }
    22% { opacity:.9; }
    68% { opacity:.72; }
    82%,100% { opacity:0; transform:translate(-50%,1.38em) rotate(45deg) scale(.9); }
}
.post-mini-title > .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-rainy_day {
    font-size: .92rem !important;
}
.profile-display-title .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-rainy_day {
    font-size: 1.12em !important;
}
.inventory-title-display.inventory-title-display .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-rainy_day {
    font-size: .92rem !important;
}
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-font-rainy_day > .milk-title-ink,
    .milk-title.milk-title-font-rainy_day .milk-title-letter::after {
        animation: none !important;
        transform: none !important;
        background-position: 50% 50% !important;
    }
    .milk-title.milk-title-font-rainy_day .milk-title-letter::after { display:none !important; }
}
.site-animations-off .milk-title.milk-title-font-rainy_day > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-rainy_day .milk-title-letter::after {
    animation: none !important;
    transform: none !important;
    background-position: 50% 50% !important;
}
.site-animations-off .milk-title.milk-title-font-rainy_day .milk-title-letter::after { display:none !important; }

/* loading...: blueberry interface type with a tiny pastel progress bar. */
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-loading > .milk-title-ink {
    position: relative;
    display: inline-block;
    background-image: linear-gradient(100deg,#44558f 0%,#6171b5 48%,#9297dd 100%) !important;
    background-color: transparent !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    font-family: 'Fredoka','Baloo 2',ui-rounded,sans-serif !important;
    font-size: 1.05em;
    font-style: normal !important;
    font-weight: 700 !important;
    letter-spacing: .035em !important;
    line-height: 1.05 !important;
    text-shadow: none !important;
    -webkit-text-stroke: .12px rgba(42,52,97,.24) !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-loading > .milk-title-ink {
    background-image: linear-gradient(90deg,#44558f 0%,#7487c8 22%,#7bd8c6 43%,#72cfe0 58%,#a79de0 76%,#44558f 100%) !important;
    background-size: 300% 100% !important;
    animation: milk-loading-gradient-flow 3.6s ease-in-out infinite alternate !important;
}
@keyframes milk-loading-gradient-flow {
    from { background-position: 0% 50%; }
    to { background-position: 100% 50%; }
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading {
    padding-block: .06em .56em;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading > .milk-title-ink {
    position: relative !important;
    display: inline-flex !important;
    align-items: baseline;
    overflow: visible !important;
    padding-bottom: .02em;
    background: none !important;
    color: inherit !important;
    -webkit-text-fill-color: initial !important;
    filter: none !important;
    text-shadow: none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading .milk-title-letter {
    position: relative;
    z-index: 2;
    display: inline-block;
    background: none !important;
    color: #5365a5 !important;
    -webkit-text-fill-color: currentColor !important;
    -webkit-text-stroke: .12px rgba(42,52,97,.22) !important;
    filter: none !important;
    text-shadow: none !important;
    transform: none;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading .milk-title-letter:nth-child(n+4):nth-child(-n+7) { color:#6879bd !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading .milk-title-letter:nth-child(8) { color:#70cdbb !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading .milk-title-letter:nth-child(9) { color:#69c5dc !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading .milk-title-letter:nth-child(10) { color:#a093dc !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading .milk-title-letter:nth-child(n+8) {
    animation: milk-loading-dot-bounce 1.35s ease-in-out infinite !important;
    animation-delay: calc((var(--letter-index, 7) - 7) * .16s) !important;
}
@keyframes milk-loading-dot-bounce {
    0%,24%,78%,100% { transform:translateY(0) scale(1); }
    43% { transform:translateY(-.27em) scale(1.12); }
    58% { transform:translateY(0) scale(.94); }
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading > .milk-title-ink::before,
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading > .milk-title-ink::after {
    content:'' !important;
    position:absolute !important;
    inset:auto !important;
    left:.06em !important;
    bottom:-.42em !important;
    display:block !important;
    height:.22em !important;
    min-height:3px !important;
    border:0 !important;
    border-radius:999px !important;
    pointer-events:none;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading > .milk-title-ink::before {
    right:.06em !important;
    width:auto !important;
    background:#dddafa !important;
    box-shadow:inset 0 0 0 1px rgba(67,80,139,.22) !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-loading > .milk-title-ink::after {
    width:calc(100% - .12em) !important;
    background:linear-gradient(90deg,#7bd8c6 0%,#72cfe0 52%,#a79de0 100%) !important;
    box-shadow:0 0 4px rgba(114,207,224,.52) !important;
    transform:scaleX(.04);
    transform-origin:left center;
    animation:milk-loading-bar-fill 3.2s cubic-bezier(.35,.05,.2,1) infinite !important;
}
@keyframes milk-loading-bar-fill {
    0%,8% { transform:scaleX(.04); opacity:.78; }
    76% { transform:scaleX(1); opacity:1; }
    84% { transform:scaleX(1); opacity:1; filter:brightness(1.13); }
    100% { transform:scaleX(1); opacity:0; filter:brightness(1.13); }
}
.post-mini-title > .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-loading { font-size:.88rem !important; }
.profile-display-title .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-loading { font-size:1.02em !important; }
.inventory-title-display.inventory-title-display .milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-loading { font-size:.9rem !important; }
@media (prefers-reduced-motion: reduce) {
    .milk-title.milk-title-font-loading > .milk-title-ink,
    .milk-title.milk-title-font-loading .milk-title-letter,
    .milk-title.milk-title-font-loading > .milk-title-ink::after {
        animation:none !important;
        transform:none !important;
        background-position:50% 50% !important;
    }
    .milk-title.milk-title-font-loading > .milk-title-ink::after { transform:scaleX(.72) !important; opacity:1 !important; }
}
.site-animations-off .milk-title.milk-title-font-loading > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-loading .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-loading > .milk-title-ink::after {
    animation:none !important;
    transform:none !important;
    background-position:50% 50% !important;
}
.site-animations-off .milk-title.milk-title-font-loading > .milk-title-ink::after { transform:scaleX(.72) !important; opacity:1 !important; }

/* Toasty: a warm, freshly-baked title progression.
   T0 plain; T1 baked gradient; T2 puffy signature font; T3 living heat glow;
   T4 browned dimension, slow steam wisps, and one occasional golden gleam. */
.milk-title.milk-title:is(.milk-title-tier-1,.milk-title-tier-2,.milk-title-tier-3).milk-title-font-toasty > .milk-title-ink {
    background-image:linear-gradient(180deg,#fff2cf 0%,#e7a858 52%,#d76424 100%) !important;
    background-size:100% 100% !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.28px #6f351f !important;
    filter:drop-shadow(0 .7px 0 rgba(90,43,25,.28)) !important;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-toasty {
    font-family:'DynaPuff','Fredoka','Baloo 2',ui-rounded,sans-serif !important;
    font-size:1.02em;
    font-style:normal !important;
    font-weight:650 !important;
    letter-spacing:.005em !important;
    line-height:1.08 !important;
}
.post-mini-title > .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-toasty {
    font-size:.82rem !important;
}
.profile-display-title .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-toasty {
    font-size:1.28em !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-toasty {
    font-size:.94rem !important;
}

.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-toasty > .milk-title-ink {
    background-image:linear-gradient(100deg,#8f401f 0%,#d76424 13%,#efb75f 29%,#fff2cf 47%,#e79b43 65%,#b94c22 82%,#8f401f 100%) !important;
    background-size:240% 100% !important;
    transform-origin:50% 78%;
    animation:milk-toasty-heat-glow 4.6s ease-in-out infinite !important;
    will-change:background-position,filter,transform;
}
@keyframes milk-toasty-heat-glow {
    0%,13%,88%,100% { background-position:0% 50%; filter:brightness(.96) saturate(1.02) drop-shadow(0 .8px 0 rgba(90,43,25,.34)); transform:scale(1); }
    36% { background-position:58% 50%; filter:brightness(1.13) saturate(1.18) drop-shadow(0 0 3px rgba(235,157,57,.38)) drop-shadow(0 1px 0 rgba(90,43,25,.38)); transform:scale(1.012,.994); }
    58% { background-position:100% 50%; filter:brightness(1.04) saturate(1.1) drop-shadow(0 0 1.5px rgba(235,157,57,.24)) drop-shadow(0 1px 0 rgba(90,43,25,.36)); transform:scale(1); }
}

.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty {
    position:relative;
    z-index:0;
    padding:.48em .26em .08em !important;
    overflow:visible !important;
}
.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty > .milk-title-ink {
    position:relative;
    z-index:2;
    display:inline-flex !important;
    align-items:baseline;
    overflow:visible !important;
    transform-origin:50% 78%;
    animation:milk-toasty-tier-four-settle 4.6s ease-in-out infinite !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty > .milk-title-ink::before,
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty > .milk-title-ink::after {
    content:none !important;
    display:none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter {
    position:relative;
    z-index:2;
    display:inline-block;
    background-image:linear-gradient(180deg,#fff4d4 0%,#e7aa56 55%,#cf5b25 100%) !important;
    background-size:100% 100% !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.34px #6b321e !important;
    filter:drop-shadow(0 -1px 0 rgba(255,247,216,.66)) drop-shadow(0 1.4px 0 #79371f) drop-shadow(0 2.5px 1px rgba(91,39,20,.28)) !important;
    animation:none !important;
    transform:none;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter:first-child {
    background-image:linear-gradient(180deg,#fff1c9 0%,#dfa04b 47%,#a84421 83%,#6f2f1c 100%) !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter:nth-child(2) { background-image:linear-gradient(180deg,#fff2cf 0%,#e8af5a 58%,#d76b29 100%) !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter:nth-child(3) { background-image:linear-gradient(180deg,#fde9b8 0%,#e39a43 56%,#c85022 100%) !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter:nth-child(4) { background-image:linear-gradient(180deg,#f8d99b 0%,#dc8434 54%,#ad3f20 100%) !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter:nth-child(5) { background-image:linear-gradient(180deg,#ffecc2 0%,#e7a650 56%,#c04b22 100%) !important; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter:nth-child(6) { background-image:linear-gradient(180deg,#fff3d1 0%,#e9af58 58%,#d46226 100%) !important; }
@keyframes milk-toasty-tier-four-settle {
    0%,14%,78%,100% { transform:scale(1); filter:brightness(.97) saturate(1.04); }
    34% { transform:scale(1.015,.988); filter:brightness(1.12) saturate(1.15) drop-shadow(0 0 3px rgba(240,173,72,.34)); }
    49% { transform:scale(.996,1.008); filter:brightness(1.05) saturate(1.1); }
    61% { transform:scale(1); filter:brightness(1.01) saturate(1.06); }
}

/* Two hand-drawn heat curls rise from behind the word during the warmest beat. */
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty::before,
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty::after {
    content:'' !important;
    position:absolute !important;
    z-index:1;
    top:.38em !important;
    width:.18em !important;
    height:.42em !important;
    border:0 !important;
    border-left:1.5px solid #e9a52e !important;
    border-radius:58% 42% 55% 45% !important;
    background:none !important;
    box-shadow:none !important;
    opacity:0;
    pointer-events:none;
    animation:milk-toasty-wisp 4.6s ease-out infinite !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty::before { left:24% !important; transform:rotate(13deg); }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty::after { left:68% !important; transform:rotate(-11deg); animation-delay:.24s !important; }
@keyframes milk-toasty-wisp {
    0%,25%,76%,100% { opacity:0; translate:0 .14em; scale:.82; }
    35% { opacity:.78; }
    57% { opacity:.36; translate:.04em -.34em; scale:1.08; }
    67% { opacity:0; translate:-.03em -.48em; scale:1.14; }
}

/* A tiny four-point gleam: CSS-drawn rather than an emoji glyph. */
.milk-title.milk-title.milk-title-tier-4.milk-title-font-toasty .milk-title-letter:nth-child(5)::after {
    content:'' !important;
    position:absolute !important;
    z-index:4;
    top:-.15em !important;
    right:-.18em !important;
    width:.22em !important;
    height:.22em !important;
    border:0 !important;
    background:#ffd979 !important;
    clip-path:polygon(50% 0,61% 38%,100% 50%,61% 62%,50% 100%,39% 62%,0 50%,39% 38%);
    box-shadow:0 0 4px rgba(255,207,86,.78) !important;
    opacity:0;
    transform:scale(.18) rotate(0deg);
    pointer-events:none;
    animation:milk-toasty-gleam 4.6s ease-in-out infinite !important;
}
@keyframes milk-toasty-gleam {
    0%,51%,62%,100% { opacity:0; transform:scale(.18) rotate(0deg); }
    55% { opacity:1; transform:scale(1) rotate(18deg); }
    59% { opacity:.25; transform:scale(.55) rotate(34deg); }
}

@media (prefers-reduced-motion:reduce) {
    .milk-title.milk-title-font-toasty > .milk-title-ink,
    .milk-title.milk-title-font-toasty::before,
    .milk-title.milk-title-font-toasty::after,
    .milk-title.milk-title-font-toasty .milk-title-letter,
    .milk-title.milk-title-font-toasty .milk-title-letter::after {
        animation:none !important;
        transform:none !important;
        translate:none !important;
    }
    .milk-title.milk-title-font-toasty::before,
    .milk-title.milk-title-font-toasty::after,
    .milk-title.milk-title-font-toasty .milk-title-letter::after { opacity:0 !important; }
}
.site-animations-off .milk-title.milk-title-font-toasty > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-toasty::before,
.site-animations-off .milk-title.milk-title-font-toasty::after,
.site-animations-off .milk-title.milk-title-font-toasty .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-toasty .milk-title-letter::after {
    animation:none !important;
    transform:none !important;
    translate:none !important;
}
.site-animations-off .milk-title.milk-title-font-toasty::before,
.site-animations-off .milk-title.milk-title-font-toasty::after,
.site-animations-off .milk-title.milk-title-font-toasty .milk-title-letter::after { opacity:0 !important; }

/* Snug Bug: a sleepy woodland progression built entirely with CSS shapes.
   T0 plain; T1 olive/caramel/rust; T2 soft signature font; T3 living warmth;
   T4 adds the blanket-settle squish, tiny bug, antennae, glow, and drifting z's. */
.milk-title.milk-title-font-snug_bug {
    position:relative;
    overflow:visible !important;
}
.milk-title.milk-title-font-snug_bug .snug-bug-pal,
.milk-title.milk-title-font-snug_bug .snug-bug-z {
    display:none;
}
.milk-title.milk-title:is(.milk-title-tier-1,.milk-title-tier-2,.milk-title-tier-3).milk-title-font-snug_bug > .milk-title-ink {
    background-image:linear-gradient(105deg,#69743a 0%,#7d8244 38%,#b08a5e 67%,#873e38 100%) !important;
    background-size:100% 100% !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.26px #52351f !important;
    filter:drop-shadow(0 .7px 0 rgba(73,45,26,.28)) !important;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-snug_bug {
    font-family:'DynaPuff','Fredoka','Baloo 2',ui-rounded,sans-serif !important;
    font-size:1.06em;
    font-style:normal !important;
    font-weight:620 !important;
    letter-spacing:.004em !important;
    line-height:1.1 !important;
}
.post-mini-title > .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-snug_bug {
    font-size:.8rem !important;
}
.profile-display-title .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-snug_bug {
    font-size:1.27em !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-snug_bug {
    font-size:.93rem !important;
}

.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-snug_bug > .milk-title-ink {
    background-image:linear-gradient(100deg,#46552d 0%,#69743a 17%,#929354 34%,#b08a5e 49%,#873e38 63%,#69743a 79%,#46552d 100%) !important;
    background-size:235% 100% !important;
    transform-origin:50% 82%;
    animation:milk-snug-bug-living-gradient 5.2s ease-in-out infinite !important;
    will-change:background-position,filter,transform;
}
@keyframes milk-snug-bug-living-gradient {
    0%,15%,88%,100% { background-position:0% 50%; filter:brightness(.98) saturate(1.02) drop-shadow(0 .7px 0 rgba(73,45,26,.3)); transform:scale(1); }
    37% { background-position:58% 50%; filter:brightness(1.08) saturate(1.12) drop-shadow(0 0 2.5px rgba(190,133,70,.25)) drop-shadow(0 1px 0 rgba(73,45,26,.34)); transform:scale(1.006,.996); }
    62% { background-position:100% 50%; filter:brightness(1.02) saturate(1.06) drop-shadow(0 0 1px rgba(190,133,70,.18)) drop-shadow(0 1px 0 rgba(73,45,26,.32)); transform:scale(1); }
}

.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug {
    padding:.3em 1.14em .22em .22em !important;
    filter:drop-shadow(0 0 .38em rgba(112,126,61,.14));
}
.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug > .milk-title-ink {
    position:relative;
    z-index:2;
    display:inline-flex !important;
    align-items:baseline;
    overflow:visible !important;
    transform-origin:50% 86%;
    animation:milk-snug-bug-settle 5.2s ease-in-out infinite !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug > .milk-title-ink::before,
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug > .milk-title-ink::after {
    content:none !important;
    display:none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .milk-title-letter {
    position:relative;
    z-index:2;
    display:inline-block;
    background-image:linear-gradient(105deg,#a8aa62 0%,#6f783b 24%,#a77d55 43%,#873e38 57%,#9a6848 68%,#69743a 82%,#a8aa62 100%) !important;
    background-size:280% 100% !important;
    background-position:0% 50%;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.32px #4d311f !important;
    filter:drop-shadow(0 -1px 0 rgba(239,218,170,.45)) drop-shadow(0 1.25px 0 #5c3821) drop-shadow(0 2px 1px rgba(61,35,20,.2)) !important;
    animation:milk-snug-bug-rust-sweep 5.2s ease-in-out infinite !important;
    animation-delay:calc(var(--letter-index, 0) * .035s) !important;
    transform:none;
}
@keyframes milk-snug-bug-rust-sweep {
    0%,25%,76%,100% { background-position:0% 50%; }
    38% { background-position:48% 50%; }
    52% { background-position:100% 50%; }
    65% { background-position:38% 50%; }
}
@keyframes milk-snug-bug-settle {
    0%,16%,73%,100% { transform:translateY(0) scale(1); }
    30% { transform:translateY(.02em) scale(1.018,.978); }
    39% { transform:translateY(-.025em) scale(.994,1.014); }
    49% { transform:translateY(0) scale(1); }
}

/* The pal is made from nested CSS ovals; pseudo-elements provide its head,
   sleepy face, and two curved antennae without any image dependency. */
.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .snug-bug-pal {
    position:absolute;
    z-index:3;
    right:.05em;
    bottom:.15em;
    display:block;
    width:.72em;
    height:.48em;
    border:1px solid #4d311f;
    border-radius:58% 44% 48% 56%;
    background:linear-gradient(145deg,#8f9951 0 48%,#aa8359 49% 72%,#783934 73% 100%);
    box-shadow:inset 0 .08em 0 rgba(255,236,187,.28),0 .09em .08em rgba(61,35,20,.2);
    transform-origin:50% 100%;
    animation:milk-snug-bug-bob 5.2s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .snug-bug-pal::before {
    content:'';
    position:absolute;
    z-index:2;
    right:-.2em;
    top:.08em;
    width:.34em;
    height:.32em;
    border:1px solid #4d311f;
    border-radius:50%;
    background:#87904c;
    box-shadow:inset .05em .06em 0 rgba(255,230,175,.3);
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .snug-bug-pal::after {
    content:'·  ·';
    position:absolute;
    z-index:3;
    right:-.17em;
    top:.025em;
    width:.27em;
    color:#3f2a1e;
    font-family:Arial,sans-serif;
    font-size:.28em;
    font-weight:900;
    letter-spacing:.06em;
    line-height:1;
    white-space:nowrap;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .snug-bug-antennae {
    position:absolute;
    z-index:1;
    right:-.16em;
    top:-.2em;
    width:.3em;
    height:.28em;
    border-top:1px solid #4d311f;
    border-left:1px solid #4d311f;
    border-radius:70% 0 0;
    transform-origin:70% 100%;
    animation:milk-snug-bug-antenna-wiggle 5.2s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .snug-bug-antennae::after {
    content:'';
    position:absolute;
    left:.18em;
    top:-.02em;
    width:.26em;
    height:.25em;
    border-top:1px solid #4d311f;
    border-right:1px solid #4d311f;
    border-radius:0 70% 0 0;
}
@keyframes milk-snug-bug-bob {
    0%,28%,70%,100% { transform:translateY(0) rotate(0deg); }
    38% { transform:translateY(-.07em) rotate(-2deg); }
    47% { transform:translateY(-.02em) rotate(1deg); }
    55% { transform:translateY(0) rotate(0deg); }
}
@keyframes milk-snug-bug-antenna-wiggle {
    0%,31%,55%,100% { transform:rotate(0deg); }
    37% { transform:rotate(-7deg); }
    42% { transform:rotate(6deg); }
    47% { transform:rotate(-3deg); }
}

.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .snug-bug-z {
    position:absolute;
    z-index:4;
    right:-.02em;
    bottom:.57em;
    display:block;
    color:#606a36;
    -webkit-text-fill-color:#606a36;
    font-family:'DynaPuff','Fredoka',sans-serif;
    font-size:.34em;
    font-weight:650;
    line-height:1;
    opacity:0;
    pointer-events:none;
    animation:milk-snug-bug-dream-z 5.2s ease-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-snug_bug .snug-bug-z-two {
    right:-.32em;
    bottom:.77em;
    font-size:.27em;
    animation-delay:.48s;
}
@keyframes milk-snug-bug-dream-z {
    0%,42%,78%,100% { opacity:0; transform:translate(0,.12em) scale(.82); }
    50% { opacity:.72; }
    67% { opacity:.3; transform:translate(.12em,-.55em) scale(1.04); }
    75% { opacity:0; transform:translate(.18em,-.72em) scale(1.08); }
}

@media (prefers-reduced-motion:reduce) {
    .milk-title.milk-title-font-snug_bug > .milk-title-ink,
    .milk-title.milk-title-font-snug_bug .milk-title-letter,
    .milk-title.milk-title-font-snug_bug .snug-bug-pal,
    .milk-title.milk-title-font-snug_bug .snug-bug-antennae,
    .milk-title.milk-title-font-snug_bug .snug-bug-z {
        animation:none !important;
        transform:none !important;
    }
    .milk-title.milk-title-font-snug_bug .snug-bug-z { opacity:0 !important; }
}
.site-animations-off .milk-title.milk-title-font-snug_bug > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-snug_bug .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-snug_bug .snug-bug-pal,
.site-animations-off .milk-title.milk-title-font-snug_bug .snug-bug-antennae,
.site-animations-off .milk-title.milk-title-font-snug_bug .snug-bug-z {
    animation:none !important;
    transform:none !important;
}
.site-animations-off .milk-title.milk-title-font-snug_bug .snug-bug-z { opacity:0 !important; }

/* Brown Sugar: glossy caramel warmth without bakery props.
   T0 plain; T1 cream/caramel/espresso; T2 retro rounded signature font;
   T3 glossy living shimmer; T4 dimensional chocolate and sugar crystals. */
.milk-title.milk-title-font-brown_sugar {
    position:relative;
    overflow:visible !important;
}
.milk-title.milk-title-font-brown_sugar .brown-sugar-crystals {
    display:none;
}
.milk-title.milk-title:is(.milk-title-tier-1,.milk-title-tier-2,.milk-title-tier-3).milk-title-font-brown_sugar > .milk-title-ink {
    background-image:linear-gradient(105deg,#f3dfc0 0%,#d2a16c 46%,#9a603d 70%,#5a3025 100%) !important;
    background-size:100% 100% !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.3px #42231c !important;
    filter:drop-shadow(0 .8px 0 rgba(66,35,28,.32)) !important;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-brown_sugar {
    font-family:'Cherry Bomb One','Fredoka','Baloo 2',ui-rounded,sans-serif !important;
    font-size:1.05em;
    font-style:normal !important;
    font-weight:400 !important;
    letter-spacing:.012em !important;
    line-height:1.08 !important;
}
.post-mini-title > .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-brown_sugar {
    font-size:.91rem !important;
    letter-spacing:.022em !important;
}
.profile-display-title .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-brown_sugar {
    font-size:1.3em !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-brown_sugar {
    font-size:.96rem !important;
}

.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-brown_sugar > .milk-title-ink {
    background-image:linear-gradient(100deg,#5a3025 0%,#8a5338 17%,#c99159 34%,#f7e9cf 45%,#fff7e7 49%,#d8aa75 55%,#8d5638 72%,#5a3025 100%) !important;
    background-size:310% 100% !important;
    animation:milk-brown-sugar-gloss 4.8s ease-in-out infinite !important;
    filter:drop-shadow(0 1px 0 rgba(63,31,24,.38)) drop-shadow(0 0 2.5px rgba(205,139,67,.24)) !important;
    will-change:background-position,filter;
}
@keyframes milk-brown-sugar-gloss {
    0%,13% { background-position:0% 50%; filter:brightness(.98) saturate(1.02) drop-shadow(0 1px 0 rgba(63,31,24,.38)); }
    46% { background-position:100% 50%; filter:brightness(1.1) saturate(1.08) drop-shadow(0 0 3px rgba(210,148,76,.34)) drop-shadow(0 1px 0 rgba(63,31,24,.4)); }
    62%,100% { background-position:100% 50%; filter:brightness(1) saturate(1.04) drop-shadow(0 1px 0 rgba(63,31,24,.38)); }
}

.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar {
    padding:.34em .45em .28em !important;
    filter:drop-shadow(0 0 .4em rgba(207,143,67,.16));
}
.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar > .milk-title-ink {
    position:relative;
    z-index:2;
    display:inline-flex !important;
    align-items:baseline;
    overflow:visible !important;
    animation:none !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar > .milk-title-ink::before,
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar > .milk-title-ink::after {
    content:none !important;
    display:none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .milk-title-letter {
    position:relative;
    z-index:2;
    display:inline-block;
    background-image:linear-gradient(105deg,#5a3025 0%,#8d5739 20%,#c58b53 38%,#f1d7b1 47%,#fff5df 50%,#d4a06b 56%,#8a5236 73%,#4b281f 100%) !important;
    background-size:340% 100% !important;
    background-position:0% 50%;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.36px #3f211b !important;
    filter:drop-shadow(0 -1px 0 rgba(255,239,208,.48)) drop-shadow(0 1.3px 0 #4a281f) drop-shadow(0 2.1px 1px rgba(55,26,20,.25)) !important;
    transform:none !important;
    animation:milk-brown-sugar-tier-four-gloss 4.8s ease-in-out infinite !important;
    animation-delay:calc(var(--letter-index, 0) * .035s) !important;
}
@keyframes milk-brown-sugar-tier-four-gloss {
    0%,12% { background-position:0% 50%; filter:brightness(.98) drop-shadow(0 -1px 0 rgba(255,239,208,.42)) drop-shadow(0 1.3px 0 #4a281f) drop-shadow(0 2.1px 1px rgba(55,26,20,.25)); }
    43% { background-position:100% 50%; filter:brightness(1.12) drop-shadow(0 -1px 0 rgba(255,244,221,.62)) drop-shadow(0 1.3px 0 #4a281f) drop-shadow(0 0 3px rgba(215,153,78,.28)); }
    59%,100% { background-position:100% 50%; filter:brightness(1) drop-shadow(0 -1px 0 rgba(255,239,208,.42)) drop-shadow(0 1.3px 0 #4a281f) drop-shadow(0 2.1px 1px rgba(55,26,20,.25)); }
}

.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .brown-sugar-crystals {
    position:absolute;
    z-index:4;
    inset:0;
    display:block;
    pointer-events:none;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .brown-sugar-crystal {
    position:absolute;
    display:block;
    width:.14em;
    height:.14em;
    border:1px solid rgba(103,57,31,.5);
    background:linear-gradient(135deg,#fff2c7 0 42%,#d79a49 43% 70%,#9b5f36 71% 100%);
    box-shadow:0 0 .18em rgba(224,166,80,.55);
    opacity:0;
    transform:rotate(45deg) scale(.25);
    animation:milk-brown-sugar-crystal-twinkle 4.8s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .brown-sugar-crystal.c1 { left:4%; top:.08em; animation-delay:.04s; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .brown-sugar-crystal.c2 { left:35%; bottom:.02em; width:.11em; height:.11em; animation-delay:.2s; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .brown-sugar-crystal.c3 { right:24%; top:.03em; width:.1em; height:.1em; animation-delay:.38s; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .brown-sugar-crystal.c4 { right:3%; bottom:.08em; width:.13em; height:.13em; animation-delay:.55s; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-brown_sugar .brown-sugar-crystal.c5 { right:8%; top:-.08em; width:.08em; height:.08em; animation-delay:.72s; }
@keyframes milk-brown-sugar-crystal-twinkle {
    0%,25%,82%,100% { opacity:0; transform:translateY(-.02em) rotate(45deg) scale(.25); }
    36% { opacity:.95; transform:translateY(0) rotate(45deg) scale(1); }
    58% { opacity:.7; transform:translateY(.12em) rotate(70deg) scale(.86); }
    76% { opacity:0; transform:translateY(.3em) rotate(92deg) scale(.55); }
}

@media (prefers-reduced-motion:reduce) {
    .milk-title.milk-title-font-brown_sugar > .milk-title-ink,
    .milk-title.milk-title-font-brown_sugar .milk-title-letter,
    .milk-title.milk-title-font-brown_sugar .brown-sugar-crystal {
        animation:none !important;
        transform:none !important;
    }
    .milk-title.milk-title-font-brown_sugar .brown-sugar-crystal { opacity:0 !important; }
}
.site-animations-off .milk-title.milk-title-font-brown_sugar > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-brown_sugar .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-brown_sugar .brown-sugar-crystal {
    animation:none !important;
    transform:none !important;
}
.site-animations-off .milk-title.milk-title-font-brown_sugar .brown-sugar-crystal { opacity:0 !important; }

/* Autumn Baby: a breezy, hand-lettered storybook progression.
   T0 plain; T1 muted pumpkin/ochre/brown; T2 Berkshire Swash; T3 living wind;
   T4 gives individual letters a soft breeze and sends two inline-SVG leaves by. */
.milk-title.milk-title-font-autumn_baby {
    position:relative;
    overflow:visible !important;
}
.milk-title.milk-title-font-autumn_baby .autumn-baby-leaf {
    display:none;
}
.milk-title.milk-title:is(.milk-title-tier-1,.milk-title-tier-2,.milk-title-tier-3).milk-title-font-autumn_baby > .milk-title-ink {
    background-image:linear-gradient(108deg,#c66a37 0%,#c99a42 49%,#73503a 100%) !important;
    background-size:100% 100% !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:0 transparent !important;
    filter:drop-shadow(0 1px .65px rgba(77,48,34,.34)) !important;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-autumn_baby {
    font-family:'Berkshire Swash','Croissant One',Georgia,serif !important;
    font-size:1.12em;
    font-style:normal !important;
    font-weight:400 !important;
    letter-spacing:.006em !important;
    line-height:1.08 !important;
}
.post-mini-title > .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-autumn_baby {
    font-size:.95rem !important;
    letter-spacing:.01em !important;
}
.profile-display-title .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-autumn_baby {
    font-size:1.4em !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-autumn_baby {
    font-size:1.03rem !important;
}

.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-autumn_baby > .milk-title-ink {
    background-image:linear-gradient(105deg,#8a5436 0%,#c66a37 18%,#d5a846 36%,#f0cc72 48%,#bf8738 62%,#73503a 81%,#a85c35 100%) !important;
    background-size:245% 100% !important;
    transform-origin:50% 85%;
    animation:milk-autumn-baby-living-breeze 5.4s ease-in-out infinite !important;
    filter:drop-shadow(0 1px .7px rgba(77,48,34,.36)) !important;
    will-change:background-position,transform,filter;
}
@keyframes milk-autumn-baby-living-breeze {
    0%,14%,83%,100% { background-position:0% 50%; transform:skewX(0deg) rotate(0deg); filter:brightness(.98) drop-shadow(0 1px .7px rgba(77,48,34,.36)); }
    30% { background-position:42% 50%; transform:skewX(-1.25deg) rotate(-.35deg); filter:brightness(1.05) drop-shadow(0 1px .7px rgba(77,48,34,.34)); }
    48% { background-position:76% 50%; transform:skewX(1deg) rotate(.28deg); filter:brightness(1.1) drop-shadow(0 0 2px rgba(221,170,72,.25)) drop-shadow(0 1px .7px rgba(77,48,34,.34)); }
    65% { background-position:100% 50%; transform:skewX(-.35deg) rotate(-.1deg); filter:brightness(1.02) drop-shadow(0 1px .7px rgba(77,48,34,.36)); }
}

.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby {
    padding:.42em .58em .35em !important;
}
.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby > .milk-title-ink {
    position:relative;
    z-index:3;
    display:inline-flex !important;
    align-items:baseline;
    overflow:visible !important;
    animation:none !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby > .milk-title-ink::before,
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby > .milk-title-ink::after {
    content:none !important;
    display:none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .milk-title-letter {
    position:relative;
    z-index:3;
    display:inline-block;
    background-image:linear-gradient(112deg,#a65634 0%,#c66a37 25%,#d3a145 48%,#edc66b 55%,#a96f37 73%,#6f4b38 100%) !important;
    background-size:260% 100% !important;
    background-position:0% 50%;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:0 transparent !important;
    text-shadow:none !important;
    filter:drop-shadow(0 1px .65px rgba(68,42,30,.4)) !important;
    transform-origin:50% 92%;
    animation:milk-autumn-baby-letter-wind 5.4s ease-in-out infinite !important;
    animation-delay:calc(var(--letter-index, 0) * .045s) !important;
}
@keyframes milk-autumn-baby-letter-wind {
    0%,15%,78%,100% { transform:translateY(0) skewX(0deg) rotate(0deg); background-position:0% 50%; }
    29% { transform:translateY(-.015em) skewX(-2deg) rotate(-.5deg); background-position:42% 50%; }
    43% { transform:translateY(.006em) skewX(1.4deg) rotate(.38deg); background-position:72% 50%; }
    58% { transform:translateY(-.008em) skewX(-.6deg) rotate(-.15deg); background-position:100% 50%; }
}

.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .autumn-baby-leaf {
    position:absolute;
    z-index:4;
    display:block;
    width:.5em;
    height:.35em;
    overflow:visible;
    pointer-events:none;
    opacity:0;
    filter:drop-shadow(0 .06em .04em rgba(78,47,29,.25));
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .autumn-baby-leaf .leaf-shape {
    fill:#bd6b34;
    stroke:#70442e;
    stroke-width:.8;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .autumn-baby-leaf .leaf-vein {
    fill:none;
    stroke:#e0a04b;
    stroke-width:.75;
    stroke-linecap:round;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .leaf-one {
    left:-.35em;
    top:-.05em;
    offset-path:path('M 0 0 C 22 -14, 58 16, 104 4 C 126 -2, 146 9, 166 17');
    offset-rotate:auto 18deg;
    animation:milk-autumn-baby-leaf-drift 5.4s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .leaf-two {
    right:.18em;
    top:-.18em;
    width:.42em;
    height:.3em;
    transform-origin:45% 75%;
    animation:milk-autumn-baby-leaf-catch 5.4s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .leaf-two .leaf-shape { fill:#c59a3e; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-autumn_baby .leaf-two .leaf-vein { stroke:#81552e; }
@keyframes milk-autumn-baby-leaf-drift {
    0%,19% { opacity:0; offset-distance:0%; transform:rotate(-12deg) scale(.82); }
    27% { opacity:.92; }
    54% { opacity:.82; offset-distance:62%; transform:rotate(25deg) scale(1); }
    71% { opacity:.35; offset-distance:88%; transform:rotate(58deg) scale(.9); }
    78%,100% { opacity:0; offset-distance:100%; transform:rotate(86deg) scale(.78); }
}
@keyframes milk-autumn-baby-leaf-catch {
    0%,35% { opacity:0; transform:translate(-.7em,-.45em) rotate(-38deg) scale(.82); }
    46% { opacity:.9; transform:translate(-.18em,.2em) rotate(18deg) scale(1); }
    53%,62% { opacity:.95; transform:translate(-.02em,.31em) rotate(28deg) scale(1); }
    72% { opacity:.5; transform:translate(.34em,.02em) rotate(72deg) scale(.9); }
    81%,100% { opacity:0; transform:translate(.78em,-.36em) rotate(112deg) scale(.76); }
}

@supports not (offset-path:path('M 0 0 L 1 1')) {
    @keyframes milk-autumn-baby-leaf-drift {
        0%,19% { opacity:0; transform:translate(0,0) rotate(-12deg) scale(.82); }
        28% { opacity:.92; }
        54% { opacity:.82; transform:translate(4.2em,.38em) rotate(25deg) scale(1); }
        72% { opacity:.35; transform:translate(7.1em,.1em) rotate(58deg) scale(.9); }
        79%,100% { opacity:0; transform:translate(8.6em,.5em) rotate(86deg) scale(.78); }
    }
}

@media (prefers-reduced-motion:reduce) {
    .milk-title.milk-title-font-autumn_baby > .milk-title-ink,
    .milk-title.milk-title-font-autumn_baby .milk-title-letter,
    .milk-title.milk-title-font-autumn_baby .autumn-baby-leaf {
        animation:none !important;
        transform:none !important;
    }
    .milk-title.milk-title-font-autumn_baby .autumn-baby-leaf { display:none !important; }
}
.site-animations-off .milk-title.milk-title-font-autumn_baby > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-autumn_baby .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-autumn_baby .autumn-baby-leaf {
    animation:none !important;
    transform:none !important;
}
.site-animations-off .milk-title.milk-title-font-autumn_baby .autumn-baby-leaf { display:none !important; }

/* Golden Child: polished vintage type in warm afternoon light.
   T0 plain; T1 pale-gold/honey/amber; T2 Cinzel Decorative; T3 light sweep;
   T4 adds restrained depth and three brief CSS-drawn sunburst sparkles. */
.milk-title.milk-title-font-golden_child {
    position:relative;
    overflow:visible !important;
}
.milk-title.milk-title-font-golden_child .golden-child-sparkles {
    display:none;
}
.milk-title.milk-title:is(.milk-title-tier-1,.milk-title-tier-2,.milk-title-tier-3).milk-title-font-golden_child > .milk-title-ink {
    background-image:linear-gradient(105deg,#f4d98a 0%,#d7a542 50%,#b86f24 100%) !important;
    background-size:100% 100% !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.28px #6b451f !important;
    filter:drop-shadow(0 .7px .45px rgba(91,57,24,.28)) !important;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-golden_child {
    font-family:'Cinzel Decorative','Berkshire Swash',Georgia,serif !important;
    font-size:.98em;
    font-style:normal !important;
    font-weight:700 !important;
    letter-spacing:.012em !important;
    line-height:1.12 !important;
}
.post-mini-title > .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-golden_child {
    font-size:.83rem !important;
    letter-spacing:.014em !important;
}
.profile-display-title .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-golden_child {
    font-size:1.24em !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-golden_child {
    font-size:.93rem !important;
}

.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-golden_child > .milk-title-ink {
    background-image:linear-gradient(100deg,#8f5b22 0%,#bf7828 19%,#dfa943 35%,#f8e3a2 45%,#fff5cf 50%,#e8bc5a 56%,#bd7628 75%,#8f5b22 100%) !important;
    background-size:325% 100% !important;
    animation:milk-golden-child-light-sweep 4.9s ease-in-out infinite !important;
    filter:drop-shadow(0 1px .5px rgba(84,50,19,.34)) !important;
    will-change:background-position,filter;
}
@keyframes milk-golden-child-light-sweep {
    0%,13% { background-position:0% 50%; filter:brightness(.98) drop-shadow(0 1px .5px rgba(84,50,19,.34)); }
    28% { filter:brightness(1.05) drop-shadow(0 0 2px rgba(230,176,66,.24)) drop-shadow(0 1px .5px rgba(84,50,19,.34)); }
    48% { background-position:100% 50%; filter:brightness(1.13) drop-shadow(0 0 3.5px rgba(239,189,77,.36)) drop-shadow(0 1px .5px rgba(84,50,19,.34)); }
    64%,100% { background-position:100% 50%; filter:brightness(1) drop-shadow(0 1px .5px rgba(84,50,19,.34)); }
}

.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child {
    padding:.42em .56em .36em !important;
}
.milk-title.milk-title.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child > .milk-title-ink {
    position:relative;
    z-index:3;
    display:inline-flex !important;
    align-items:baseline;
    overflow:visible !important;
    animation:milk-golden-child-ambient-glow 4.9s ease-in-out infinite !important;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child > .milk-title-ink::before,
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child > .milk-title-ink::after {
    content:none !important;
    display:none !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .milk-title-letter {
    position:relative;
    z-index:3;
    display:inline-block;
    background-image:linear-gradient(105deg,#8b571f 0%,#bd7929 18%,#dda642 34%,#f4d98a 45%,#fff4c1 50%,#e2af48 58%,#b76f24 76%,#81501f 100%) !important;
    background-size:335% 100% !important;
    background-position:0% 50%;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:.33px #66401b !important;
    text-shadow:none !important;
    filter:drop-shadow(0 -1px 0 rgba(255,242,181,.48)) drop-shadow(0 1.15px 0 #79501f) drop-shadow(0 2px 1px rgba(78,46,17,.2)) !important;
    transform:none !important;
    animation:milk-golden-child-tier-four-sweep 4.9s ease-in-out infinite !important;
    animation-delay:calc(var(--letter-index, 0) * .025s) !important;
}
@keyframes milk-golden-child-tier-four-sweep {
    0%,13% { background-position:0% 50%; }
    48% { background-position:100% 50%; }
    65%,100% { background-position:100% 50%; }
}
@keyframes milk-golden-child-ambient-glow {
    0%,17%,76%,100% { filter:drop-shadow(0 0 0 rgba(228,169,58,0)); }
    40% { filter:drop-shadow(0 0 .2em rgba(228,169,58,.24)); }
    55% { filter:drop-shadow(0 0 .28em rgba(239,190,82,.32)); }
}

.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-sparkles {
    position:absolute;
    z-index:5;
    inset:0;
    display:block;
    pointer-events:none;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-spark {
    position:absolute;
    display:block;
    width:.42em;
    height:.42em;
    opacity:0;
    background:radial-gradient(circle,#fff7c9 0 16%,#e9b949 18% 24%,transparent 27%);
    filter:drop-shadow(0 0 .13em rgba(255,224,127,.72));
    transform:scale(.18) rotate(0deg);
    animation:milk-golden-child-sunburst 4.9s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-spark::before,
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-spark::after {
    content:'';
    position:absolute;
    inset:0;
    margin:auto;
    width:100%;
    height:2px;
    border-radius:999px;
    background:linear-gradient(90deg,transparent 0%,#f7d66e 24%,#fff3b9 50%,#f7d66e 76%,transparent 100%);
    box-shadow:0 0 .16em rgba(245,198,75,.58);
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-spark::after {
    transform:rotate(90deg);
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-spark.s1 { left:13%; top:.36em; animation-delay:.05s; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-spark.s2 { left:55%; top:.25em; width:.5em; height:.5em; animation-delay:.28s; }
.milk-title.milk-title.milk-title-tier-4.milk-title-font-golden_child .golden-child-spark.s3 { right:9%; bottom:.27em; width:.34em; height:.34em; animation-delay:.52s; }
@keyframes milk-golden-child-sunburst {
    0%,45%,76%,100% { opacity:0; transform:scale(.18) rotate(0deg); }
    53% { opacity:.95; transform:scale(1) rotate(12deg); }
    61% { opacity:.58; transform:scale(.72) rotate(27deg); }
    70% { opacity:0; transform:scale(.34) rotate(40deg); }
}

@media (prefers-reduced-motion:reduce) {
    .milk-title.milk-title-font-golden_child > .milk-title-ink,
    .milk-title.milk-title-font-golden_child .milk-title-letter,
    .milk-title.milk-title-font-golden_child .golden-child-spark {
        animation:none !important;
        transform:none !important;
    }
    .milk-title.milk-title-font-golden_child .golden-child-spark { opacity:0 !important; }
}
.site-animations-off .milk-title.milk-title-font-golden_child > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-golden_child .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-golden_child .golden-child-spark {
    animation:none !important;
    transform:none !important;
}
.site-animations-off .milk-title.milk-title-font-golden_child .golden-child-spark { opacity:0 !important; }

/* Sweater Weather: bold cozy lettering joined to two animated yarn curls.
   T0 remains untouched; T1 is gradient-only; T2 adds its signature face;
   T3 travels through yarn colors; T4 becomes a connected knitted lockup. */
.milk-title.milk-title-font-sweater_weather {
    position:relative;
    overflow:visible !important;
}
.milk-title.milk-title-font-sweater_weather .sweater-weather-yarn {
    display:none;
}
.milk-title.milk-title:is(.milk-title-tier-1,.milk-title-tier-2,.milk-title-tier-3).milk-title-font-sweater_weather > .milk-title-ink {
    background-image:linear-gradient(105deg,#7e4937 0%,#b96743 43%,#9f744f 72%,#754435 100%) !important;
    background-size:100% 100% !important;
    -webkit-background-clip:text !important;
    background-clip:text !important;
    color:transparent !important;
    -webkit-text-fill-color:transparent !important;
    -webkit-text-stroke:0 transparent !important;
    filter:drop-shadow(0 .45px .25px rgba(73,40,30,.22)) !important;
}
.milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-sweater_weather {
    font-family:'Fredoka','Arial Rounded MT Bold','Trebuchet MS',sans-serif !important;
    font-size:1.08em;
    font-style:normal !important;
    font-weight:700 !important;
    letter-spacing:.012em !important;
    line-height:1.04 !important;
}
.milk-title.milk-title.milk-title-tier-2.milk-title-font-sweater_weather > .milk-title-ink {
    filter:drop-shadow(0 .45px .25px rgba(73,40,30,.22)) !important;
}
.post-mini-title > .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-sweater_weather {
    font-size:1.08rem !important;
    letter-spacing:.014em !important;
}
.profile-display-title .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-sweater_weather {
    font-size:1.28em !important;
}
.inventory-title-display.inventory-title-display .milk-title.milk-title:is(.milk-title-tier-2,.milk-title-tier-3,.milk-title-tier-4).milk-title-font-sweater_weather {
    font-size:1rem !important;
}

.milk-title.milk-title.milk-title.milk-title.milk-title-tier-3.milk-title-font-sweater_weather > .milk-title-ink {
    background-image:linear-gradient(100deg,#7c4131 0%,#bd633b 15%,#e1aa72 31%,#d9bb8e 43%,#a75a38 57%,#d98a50 72%,#9b5336 85%,#7c4131 100%) !important;
    background-size:200% 100% !important;
    animation:milk-sweater-weather-yarn-flow 8.4s linear infinite !important;
    -webkit-text-stroke:0 transparent !important;
    filter:drop-shadow(0 .5px .3px rgba(67,35,27,.25)) !important;
    will-change:background-position;
}
@keyframes milk-sweater-weather-yarn-flow {
    0% { background-position:0% 50%; filter:brightness(.94) drop-shadow(0 .5px .3px rgba(67,35,27,.25)); }
    50% { background-position:100% 50%; filter:brightness(1.08) drop-shadow(0 .5px .3px rgba(67,35,27,.25)); }
    100% { background-position:200% 50%; filter:brightness(.94) drop-shadow(0 .5px .3px rgba(67,35,27,.25)); }
}

.milk-title.milk-title.milk-title-tier-4.milk-title-font-sweater_weather {
    display:inline-flex !important;
    align-items:center;
    gap:0;
    padding:.22em .12em .18em !important;
    vertical-align:middle;
}
.milk-title.milk-title.milk-title.milk-title-tier-4.milk-title-font-sweater_weather > .milk-title-ink {
    position:relative;
    z-index:2;
    display:inline-flex !important;
    align-items:baseline;
    flex:none;
    overflow:visible !important;
    padding:0 .015em;
    transform-origin:50% 70%;
    animation:milk-sweater-weather-soft-relax 4.8s ease-in-out infinite !important;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-sweater_weather .milk-title-letter {
    position:relative;
    z-index:2;
    display:inline-block;
    background:none !important;
    color:#633126 !important;
    -webkit-text-fill-color:currentColor !important;
    -webkit-text-stroke:0 transparent !important;
    filter:drop-shadow(0 .65px .25px rgba(47,24,18,.38)) !important;
    animation:
        milk-sweater-weather-letter-flow 3.6s linear infinite,
        milk-sweater-weather-stitch-bob 4.8s ease-in-out infinite !important;
    animation-delay:
        calc(var(--letter-index, 0) * -.11s),
        calc(var(--letter-index, 0) * -.085s) !important;
    transform:translateY(0);
}
@keyframes milk-sweater-weather-soft-relax {
    0%,18%,82%,100% { transform:translateY(0) scale(1); }
    48% { transform:translateY(-.35px) scale(1.012,.985); }
}
@keyframes milk-sweater-weather-letter-flow {
    0%,30%,100% { color:#633126; filter:brightness(.96) drop-shadow(0 .65px .25px rgba(47,24,18,.38)); }
    48% { color:#A75133; filter:brightness(1.04) drop-shadow(0 .65px .25px rgba(47,24,18,.38)); }
    62% { color:#C97949; filter:brightness(1.08) drop-shadow(0 .65px .25px rgba(47,24,18,.38)); }
    78% { color:#7B3B29; filter:brightness(1) drop-shadow(0 .65px .25px rgba(47,24,18,.38)); }
}
@keyframes milk-sweater-weather-stitch-bob {
    0%,22%,78%,100% { transform:translateY(0) rotate(0deg); }
    42% { transform:translateY(-1.15px) rotate(-.35deg); }
    58% { transform:translateY(.35px) rotate(.25deg); }
}

.milk-title.milk-title.milk-title-tier-4.milk-title-font-sweater_weather .sweater-weather-yarn {
    z-index:1;
    display:block;
    flex:0 0 1.68em;
    width:1.68em;
    height:.84em;
    margin:0;
    overflow:visible;
    pointer-events:none;
    transform-origin:center;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-sweater_weather .sweater-weather-yarn path {
    fill:none;
    stroke:#713624;
    stroke-width:2.1;
    stroke-linecap:round;
    stroke-linejoin:round;
    vector-effect:non-scaling-stroke;
    filter:drop-shadow(0 .5px .25px rgba(47,24,18,.32));
    animation:milk-sweater-weather-yarn-pulse 2.4s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-sweater_weather .yarn-start {
    margin-right:-.16em;
    transform-origin:100% 50%;
    animation:milk-sweater-weather-thread-start 4.8s ease-in-out infinite;
}
.milk-title.milk-title.milk-title-tier-4.milk-title-font-sweater_weather .yarn-end {
    margin-left:-.16em;
    transform-origin:0 50%;
    animation:milk-sweater-weather-thread-end 4.8s ease-in-out infinite;
}
@keyframes milk-sweater-weather-yarn-pulse {
    0%,100% { stroke:#713624; filter:brightness(.95) drop-shadow(0 .5px .25px rgba(47,24,18,.32)); }
    50% { stroke:#C97982; filter:brightness(1.12) drop-shadow(0 .5px .25px rgba(47,24,18,.32)); }
}
@keyframes milk-sweater-weather-thread-start {
    0%,20%,80%,100% { transform:rotate(0deg) translateY(0); }
    45% { transform:rotate(-7deg) translateY(-.8px); }
    58% { transform:rotate(3deg) translateY(.25px); }
}
@keyframes milk-sweater-weather-thread-end {
    0%,20%,80%,100% { transform:rotate(0deg) translateY(0); }
    45% { transform:rotate(7deg) translateY(-.8px); }
    58% { transform:rotate(-3deg) translateY(.25px); }
}

@media (prefers-reduced-motion:reduce) {
    .milk-title.milk-title-font-sweater_weather > .milk-title-ink,
    .milk-title.milk-title-font-sweater_weather .milk-title-letter,
    .milk-title.milk-title-font-sweater_weather .sweater-weather-yarn,
    .milk-title.milk-title-font-sweater_weather .sweater-weather-yarn path {
        animation:none !important;
        transform:none !important;
        background-position:50% 50% !important;
    }
}
.site-animations-off .milk-title.milk-title-font-sweater_weather > .milk-title-ink,
.site-animations-off .milk-title.milk-title-font-sweater_weather .milk-title-letter,
.site-animations-off .milk-title.milk-title-font-sweater_weather .sweater-weather-yarn,
.site-animations-off .milk-title.milk-title-font-sweater_weather .sweater-weather-yarn path {
    animation:none !important;
    transform:none !important;
    background-position:50% 50% !important;
}
