:root {
    --forest-950: #0E1E12;
    --forest-900: #193D20;
    --forest-700: #315D35;
    --forest-600: #487641;
    --forest-400: #74C56E;
    --forest-200: #A2D277;
    --cream: #F0F7EC;
    --cream-soft: rgba(240, 247, 236, .76);
    --cream-dim: rgba(240, 247, 236, .52);
    --gold: #E7C878;
    --gold-bright: #FFF0B9;
    --line: rgba(162, 210, 119, .18);
    --glass: rgba(14, 30, 18, .74);
    --glass-strong: rgba(14, 30, 18, .90);
    --shadow: 0 24px 78px rgba(0, 0, 0, .40);
    --radius-xl: 34px;
    --radius-lg: 27px;
    --radius-md: 19px;
    --radius-sm: 14px;
    --content-width: 1440px;
}

* {
    box-sizing: border-box;
}

html {
    overflow-x: hidden;
    background: var(--forest-950);
}

body {
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: hidden;
    color: var(--cream);
    background:
        radial-gradient(circle at 50% 18%, rgba(116, 197, 110, .16), transparent 38%),
        linear-gradient(145deg, var(--forest-900), var(--forest-950));
    font-family: Georgia, "Times New Roman", serif;
    line-height: 1.65;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

a {
    color: inherit;
}

img {
    max-width: 100%;
    height: auto;
}

button,
input {
    font: inherit;
}

button {
    color: inherit;
}

:focus-visible {
    outline: 2px solid var(--gold-bright);
    outline-offset: 4px;
}

.screen-reader-text {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.screen-reader-text:focus {
    position: fixed !important;
    top: 12px;
    left: 12px;
    z-index: 100000;
    width: auto;
    height: auto;
    clip: auto;
    padding: 12px 16px;
    border-radius: 10px;
    color: #111;
    background: #fff;
}

/* Background video and Oregon veil */
.site-background {
    position: fixed;
    inset: 0;
    z-index: 0;
    overflow: hidden;
    background: linear-gradient(145deg, var(--forest-900), var(--forest-950));
}

.site-background__video {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transform: scale(1.018);
    filter: saturate(.93) contrast(1.06) brightness(.74);
}

.site-background__veil {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 50% 28%, rgba(116, 197, 110, .13), transparent 54%),
        linear-gradient(160deg, rgba(14, 30, 18, .68), rgba(25, 61, 32, .43) 43%, rgba(8, 19, 11, .80));
    background-size: 220% 220%;
    animation: veilDrift 26s ease-in-out infinite alternate;
}

.site-background__halo {
    position: absolute;
    border: 1px solid rgba(162, 210, 119, .10);
    border-radius: 50%;
    pointer-events: none;
}

.site-background__halo::before,
.site-background__halo::after {
    content: "";
    position: absolute;
    inset: 8%;
    border: 1px solid rgba(162, 210, 119, .08);
    border-radius: inherit;
}

.site-background__halo::after {
    inset: 23%;
}

.site-background__halo--one {
    width: 54vmax;
    height: 54vmax;
    left: -17vmax;
    top: -18vmax;
    animation: haloBreathe 10s ease-in-out infinite alternate;
}

.site-background__halo--two {
    width: 38vmax;
    height: 38vmax;
    right: -12vmax;
    bottom: -12vmax;
    animation: haloBreathe 12s ease-in-out -4s infinite alternate;
}

.site-background__grain {
    position: absolute;
    inset: 0;
    opacity: .09;
    background-image:
        linear-gradient(rgba(255,255,255,.027) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.021) 1px, transparent 1px);
    background-size: 35px 35px;
}

/* Fixed bilingual and music controls */
.corner-controls {
    position: fixed;
    inset: 0 0 auto;
    z-index: 100;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    padding:
        max(17px, env(safe-area-inset-top))
        max(18px, env(safe-area-inset-right))
        0
        max(18px, env(safe-area-inset-left));
    pointer-events: none;
}

.admin-bar .corner-controls {
    top: 32px;
}

.corner-controls > * {
    pointer-events: auto;
}

.glass-control {
    border: 1px solid rgba(162, 210, 119, .23);
    background: rgba(9, 27, 15, .69);
    box-shadow:
        0 15px 38px rgba(0, 0, 0, .42),
        inset 0 1px 0 rgba(255, 255, 255, .06);
    backdrop-filter: blur(17px) saturate(1.16);
    -webkit-backdrop-filter: blur(17px) saturate(1.16);
}

.language-switch {
    position: relative;
    width: 106px;
    height: 44px;
    overflow: hidden;
    padding: 0;
    border-radius: 999px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
}

.language-switch__knob {
    position: absolute;
    top: 4px;
    left: 4px;
    width: calc(50% - 4px);
    height: calc(100% - 8px);
    border-radius: 999px;
    background: linear-gradient(180deg, var(--gold-bright), #B88D36);
    box-shadow:
        0 7px 17px rgba(0, 0, 0, .48),
        inset 0 1px 0 rgba(255, 255, 255, .55);
    transition: transform .36s cubic-bezier(.2, .78, .2, 1);
}

.language-switch[data-language="en"] .language-switch__knob {
    transform: translateX(100%);
}

.language-switch__labels {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
}

.language-switch__labels span {
    flex: 1;
    display: grid;
    place-items: center;
    font-family: Arial, sans-serif;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 1.8px;
    color: var(--cream-soft);
    transition: color .25s ease;
}

.language-switch[data-language="ru"] .language-switch__ru,
.language-switch[data-language="en"] .language-switch__en {
    color: #07150D;
}

.music-control {
    position: relative;
    width: 66px;
    height: 66px;
    padding: 0;
    overflow: visible;
    border-radius: 50%;
    cursor: pointer;
    color: var(--gold-bright);
    animation: musicIdle 4.6s ease-in-out infinite;
    transition:
        transform .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
    -webkit-tap-highlight-color: transparent;
}

.music-control:hover {
    transform: scale(1.07);
    border-color: rgba(255, 240, 185, .60);
    box-shadow:
        0 0 34px rgba(231, 200, 120, .22),
        0 16px 42px rgba(0, 0, 0, .46);
}

.music-control__disc {
    position: absolute;
    inset: 8px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background:
        radial-gradient(circle at 34% 27%, rgba(255,255,255,.24), transparent 22%),
        linear-gradient(145deg, rgba(72,118,65,.90), rgba(14,30,18,.98));
    box-shadow:
        inset 0 0 0 1px rgba(162, 210, 119, .22),
        inset 0 -8px 18px rgba(0, 0, 0, .26);
}

.music-control__disc svg {
    width: 30px;
    height: 30px;
    filter: drop-shadow(0 3px 8px rgba(0, 0, 0, .44));
}

.music-control__halo,
.music-control__pulse {
    position: absolute;
    inset: -7px;
    border: 1px solid rgba(231, 200, 120, .60);
    border-radius: 50%;
    opacity: 0;
    pointer-events: none;
}

.music-control.is-playing {
    animation: musicPlaying .66s ease-in-out infinite;
}

.music-control.is-playing .music-control__disc {
    background:
        radial-gradient(circle at 34% 27%, rgba(255,255,255,.30), transparent 22%),
        linear-gradient(145deg, #6E934D, #163E22);
}

.music-control.is-playing .music-control__halo {
    opacity: 1;
    animation: musicRing 1.65s ease-out infinite;
}

.music-control.is-playing .music-control__pulse {
    opacity: 1;
    animation: musicRing 1.65s ease-out .75s infinite;
}

.flying-note {
    position: fixed;
    z-index: 99;
    pointer-events: none;
    color: var(--gold-bright);
    font-size: 21px;
    line-height: 1;
    text-shadow: 0 3px 12px rgba(0, 0, 0, .70);
    animation: noteFlight 2.1s ease-out forwards;
}

/* Main entrance */
.site-reveal {
    position: relative;
    z-index: 10;
    width: min(calc(100% - 30px), var(--content-width));
    margin: 0 auto;
    padding: 98px 0 34px;
    opacity: 0;
    transform: scale(.80) translateY(28px);
    filter: blur(18px);
    clip-path: circle(10% at 50% 34%);
    transition:
        opacity 1.18s ease,
        transform 1.18s cubic-bezier(.17, .86, .22, 1),
        filter 1.18s ease,
        clip-path 1.28s cubic-bezier(.17, .86, .22, 1);
    transform-origin: center 34%;
}

.site-reveal.is-visible {
    opacity: 1;
    transform: scale(1) translateY(0);
    filter: blur(0);
    clip-path: circle(155% at 50% 34%);
}

.glass-panel {
    border: 1px solid var(--line);
    background:
        linear-gradient(160deg, rgba(25, 61, 32, .80), rgba(14, 30, 18, .78));
    box-shadow:
        var(--shadow),
        inset 0 1px 0 rgba(255, 255, 255, .045);
    backdrop-filter: blur(18px) saturate(1.08);
    -webkit-backdrop-filter: blur(18px) saturate(1.08);
}

/* Hero */
.site-main {
    display: grid;
    gap: 22px;
}

.hero-panel {
    position: relative;
    min-height: min(74vh, 730px);
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    border-radius: var(--radius-xl);
    padding: clamp(30px, 6.5vw, 92px);
    isolation: isolate;
}

.hero-panel::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        linear-gradient(180deg, rgba(14,30,18,.10), rgba(14,30,18,.48) 48%, rgba(8,21,12,.92)),
        radial-gradient(circle at 68% 24%, rgba(162,210,119,.12), transparent 32%);
}

.hero-panel::after {
    content: "";
    position: absolute;
    inset: 12px;
    z-index: -1;
    border: 1px solid rgba(162, 210, 119, .10);
    border-radius: calc(var(--radius-xl) - 9px);
    pointer-events: none;
}

.hero-panel__content {
    position: relative;
    z-index: 2;
    width: min(930px, 100%);
}

.hero-brand-logo {
    display: inline-block;
    width: clamp(108px, 11vw, 168px);
    margin: 0 0 18px;
    text-decoration: none;
    filter: drop-shadow(0 13px 28px rgba(0, 0, 0, .36));
    transition: transform .28s ease, filter .28s ease;
}

.hero-brand-logo:hover {
    transform: translateY(-3px) scale(1.025);
    filter: drop-shadow(0 16px 34px rgba(0, 0, 0, .42));
}

.hero-brand-logo img {
    display: block;
    width: 100%;
    height: auto;
}

.hero-panel__quote,
.section-kicker {
    margin: 0 0 10px;
    color: var(--gold-bright);
    font-family: Arial, sans-serif;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .23em;
    text-transform: uppercase;
}

.hero-panel__title {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    margin: 0;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(3.2rem, 8.3vw, 8.5rem);
    line-height: .88;
    letter-spacing: -.064em;
    text-shadow:
        0 9px 38px rgba(0, 0, 0, .64),
        0 0 55px rgba(116, 197, 110, .10);
    text-wrap: balance;
}

.hero-panel__dot,
.hero-panel__zone {
    color: var(--gold-bright);
}

.hero-panel__line {
    margin: 21px 0 0;
    color: var(--forest-200);
    font-family: Arial, sans-serif;
    font-size: clamp(.94rem, 1.5vw, 1.26rem);
    font-weight: 850;
    letter-spacing: .12em;
}

.hero-panel__intro {
    max-width: 760px;
    margin: 20px 0 0;
    color: var(--cream-soft);
    font-size: clamp(1rem, 1.3vw, 1.16rem);
    line-height: 1.78;
}

.hero-panel__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 28px;
}

.living-button,
.search-submit {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    position: relative;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 13px;
    min-height: 52px;
    padding: 13px 22px;
    border: 1px solid rgba(231, 200, 120, .58);
    border-radius: 999px;
    color: #08140B;
    background: linear-gradient(145deg, var(--gold-bright), var(--gold) 52%, #AA7C29);
    box-shadow:
        0 15px 34px rgba(0, 0, 0, .36),
        inset 0 1px 0 rgba(255, 255, 255, .55);
    font-family: Arial, sans-serif;
    font-size: .83rem;
    font-weight: 900;
    letter-spacing: .08em;
    text-decoration: none;
    cursor: pointer;
    transform:
        perspective(600px)
        rotateX(var(--tilt-x))
        rotateY(var(--tilt-y));
    transition:
        transform .2s ease,
        box-shadow .2s ease,
        border-color .2s ease;
    animation: buttonBreathe 5.2s ease-in-out infinite;
}

.living-button::before,
.search-submit::before,
.site-tile::before {
    content: "";
    position: absolute;
    top: -130%;
    bottom: -130%;
    left: -45%;
    width: 28%;
    transform: rotate(18deg);
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.52), transparent);
    animation: buttonSheen 6.4s ease-in-out infinite;
}

.living-button:hover,
.search-submit:hover {
    transform:
        perspective(600px)
        translateY(-2px)
        rotateX(var(--tilt-x))
        rotateY(var(--tilt-y));
    box-shadow:
        0 18px 42px rgba(0, 0, 0, .44),
        0 0 25px rgba(231, 200, 120, .16);
}

.living-button:active,
.search-submit:active {
    transform: translateY(4px) scale(.98);
}

.living-button--quiet {
    color: var(--cream);
    border-color: rgba(162, 210, 119, .25);
    background: linear-gradient(145deg, rgba(72,118,65,.32), rgba(14,30,18,.78));
    box-shadow:
        0 15px 34px rgba(0, 0, 0, .28),
        inset 0 1px 0 rgba(255,255,255,.04);
}

.hero-search {
    margin-top: 18px;
    max-width: 660px;
}

.hero-panel__coordinates {
    position: absolute;
    right: clamp(22px, 4vw, 56px);
    top: clamp(28px, 5vw, 66px);
    display: grid;
    gap: 4px;
    justify-items: end;
    color: rgba(240,247,236,.38);
    font-family: Arial, sans-serif;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .22em;
}

.hero-panel__dream-mark {
    position: absolute;
    top: clamp(88px, 14%, 124px);
    right: clamp(28px, 7vw, 96px);
    z-index: 1;
    width: clamp(220px, 27vw, 390px);
    aspect-ratio: 1;
    display: grid;
    place-items: center;
    opacity: .78;
    pointer-events: none;
    filter: drop-shadow(0 20px 48px rgba(0, 0, 0, .34));
    animation: dreamMarkBreathe 8s ease-in-out infinite alternate;
}

.hero-panel__dream-mark::before {
    content: "";
    position: absolute;
    inset: 4%;
    border: 1px solid rgba(162, 210, 119, .10);
    border-radius: 50%;
    box-shadow: 0 0 54px rgba(116, 197, 110, .08);
}

.hero-panel__dream-mark img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.home-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(340px, 405px);
    gap: 22px;
    align-items: start;
}

.journal-panel,
.archive-panel,
.article-panel,
.not-found {
    border-radius: var(--radius-xl);
    padding: clamp(24px, 3.4vw, 44px);
}

.section-heading {
    display: flex;
    align-items: end;
    gap: 20px;
    margin-bottom: 25px;
}

.section-heading > div {
    min-width: 0;
}

.section-heading h1,
.section-heading h2,
.sidebar-panel h2 {
    margin: 0;
    font-size: clamp(1.8rem, 2.4vw, 2.65rem);
    line-height: 1.08;
    letter-spacing: -.025em;
}

.section-heading__line {
    flex: 1;
    height: 1px;
    margin-bottom: 8px;
    background: linear-gradient(90deg, var(--line), transparent);
}

.section-heading--compact {
    margin-bottom: 17px;
}

.section-heading--compact h2,
.sidebar-panel h2 {
    font-size: 1.42rem;
}

.post-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.post-card {
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: var(--radius-md);
    background: rgba(9, 27, 15, .53);
    box-shadow: 0 15px 38px rgba(0, 0, 0, .18);
    transition:
        transform .26s ease,
        border-color .26s ease,
        box-shadow .26s ease;
}

.post-card:hover {
    transform: translateY(-5px);
    border-color: rgba(162, 210, 119, .36);
    box-shadow: 0 22px 48px rgba(0, 0, 0, .27);
}

.post-card__media {
    display: block;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    text-decoration: none;
}

.post-card__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .48s ease;
}

.post-card:hover .post-card__media img {
    transform: scale(1.04);
}

.post-card__media--empty {
    position: relative;
    display: grid;
    place-items: center;
    color: rgba(240,247,236,.42);
    background:
        radial-gradient(circle at 50% 40%, rgba(116,197,110,.18), transparent 37%),
        linear-gradient(145deg, rgba(72,118,65,.29), rgba(14,30,18,.91));
    font-family: Arial, sans-serif;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .18em;
}

.post-card__media--empty::before,
.post-card__media--empty::after {
    content: "";
    position: absolute;
    width: 43%;
    aspect-ratio: 1;
    border: 1px solid rgba(162,210,119,.10);
    border-radius: 50%;
}

.post-card__media--empty::after {
    width: 28%;
}

.post-card__body {
    padding: 20px;
}

.post-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 8px;
    color: var(--forest-200);
    font-family: Arial, sans-serif;
    font-size: .70rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.post-card__title {
    margin: 0 0 10px;
    font-size: 1.42rem;
    line-height: 1.15;
}

.post-card__title a {
    text-decoration: none;
}

.post-card__excerpt {
    color: var(--cream-soft);
}

.post-card__excerpt p {
    margin-bottom: 0;
}

.post-card__read {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 14px;
    color: var(--gold-bright);
    font-family: Arial, sans-serif;
    font-size: .78rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-decoration: none;
}

.empty-journal {
    grid-column: 1 / -1;
    min-height: 310px;
    display: grid;
    place-items: center;
    align-content: center;
    text-align: center;
    padding: 32px;
    border: 1px dashed rgba(162, 210, 119, .25);
    border-radius: var(--radius-md);
    color: var(--cream-soft);
    background:
        radial-gradient(circle at 50% 35%, rgba(116,197,110,.12), transparent 38%),
        rgba(14,30,18,.30);
}

.empty-journal h2,
.empty-journal h3 {
    margin: 7px 0;
    color: var(--cream);
}

.empty-journal p {
    max-width: 540px;
    margin: 5px auto 0;
}

.empty-journal__mark {
    color: var(--gold-bright);
    font-size: 2rem;
    animation: emptyGlow 2.8s ease-in-out infinite;
}

.journal-panel__all {
    margin-top: 24px;
}

.living-sidebar {
    position: sticky;
    top: 96px;
    display: grid;
    gap: 22px;
}

.admin-bar .living-sidebar {
    top: 128px;
}

.sidebar-panel {
    border-radius: var(--radius-lg);
    padding: 23px;
}

.site-tiles {
    display: grid;
    gap: 11px;
}

.site-tile {
    --tilt-x: 0deg;
    --tilt-y: 0deg;
    position: relative;
    min-height: 69px;
    overflow: hidden;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 15px;
    padding: 14px 15px;
    border: 1px solid rgba(162, 210, 119, .17);
    border-radius: var(--radius-sm);
    color: var(--cream);
    background:
        linear-gradient(145deg, rgba(72,118,65,.20), rgba(14,30,18,.58));
    text-decoration: none;
    isolation: isolate;
    transform:
        perspective(650px)
        rotateX(var(--tilt-x))
        rotateY(var(--tilt-y));
    transition:
        transform .22s ease,
        border-color .22s ease,
        box-shadow .22s ease;
    animation: tileBreathe 5.2s ease-in-out infinite;
}

.site-tile:nth-child(2n) {
    animation-delay: -1.7s;
}

.site-tile:nth-child(3n) {
    animation-delay: -3.2s;
}

.site-tile:hover {
    border-color: rgba(162, 210, 119, .48);
    box-shadow:
        0 13px 33px rgba(0,0,0,.28),
        0 0 26px rgba(116,197,110,.08);
}

.site-tile__ambient {
    position: absolute;
    inset: 0;
    z-index: -2;
    background:
        radial-gradient(circle at 18% 50%, rgba(116,197,110,.15), transparent 37%);
    transition: transform .38s ease, opacity .38s ease;
}

.site-tile:hover .site-tile__ambient {
    transform: scale(1.12);
}

.site-tile__copy {
    position: relative;
    z-index: 3;
    min-width: 0;
    display: grid;
    gap: 3px;
}

.site-tile__copy strong {
    overflow: visible;
    font-family: Arial, sans-serif;
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .075em;
    line-height: 1.25;
    text-overflow: clip;
}

.site-tile__copy small {
    overflow: visible;
    color: var(--cream-dim);
    font-size: .78rem;
    line-height: 1.3;
    text-overflow: clip;
    white-space: normal;
}

.site-tile__arrow {
    position: relative;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border: 1px solid rgba(162,210,119,.15);
    border-radius: 50%;
    color: var(--gold-bright);
    background: rgba(14,30,18,.44);
    transition: transform .22s ease, background .22s ease;
}

.site-tile:hover .site-tile__arrow {
    transform: translate(2px, -2px) rotate(7deg);
    background: rgba(116,197,110,.20);
}

/* Special website buttons */
/* Doroginka: tiny daisies appear and fade inside the icon */
.site-tile--road,
.site-tile--classic,
.site-tile--eesah {
    min-height: 82px;
    padding-left: 74px;
}

.doroginka-symbol,
.lifeclassic-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 1px solid rgba(162, 210, 119, .25);
    border-radius: 15px;
    background: rgba(10, 33, 22, .70);
    box-shadow: 0 0 18px rgba(116, 197, 110, .10);
}

.doroginka-symbol i {
    position: absolute;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #E7BA42;
    box-shadow:
        0 -4px 0 0 #FFF9E7,
        0 4px 0 0 #FFF9E7,
        4px 0 0 0 #FFF9E7,
        -4px 0 0 0 #FFF9E7,
        3px 3px 0 -1px #FFF9E7,
        -3px 3px 0 -1px #FFF9E7,
        3px -3px 0 -1px #FFF9E7,
        -3px -3px 0 -1px #FFF9E7;
    opacity: 0;
    animation: daisyBloom 4.8s ease-in-out infinite;
}

.doroginka-symbol i:nth-child(1) { left: 10px; top: 11px; }
.doroginka-symbol i:nth-child(2) { left: 29px; top: 9px; animation-delay: -.9s; transform: scale(.78); }
.doroginka-symbol i:nth-child(3) { left: 21px; top: 27px; animation-delay: -1.8s; transform: scale(.92); }
.doroginka-symbol i:nth-child(4) { left: 8px; top: 33px; animation-delay: -2.7s; transform: scale(.68); }
.doroginka-symbol i:nth-child(5) { left: 34px; top: 30px; animation-delay: -3.6s; transform: scale(.72); }

/* Lifeclassic: a restrained voice/equalizer animation */
.lifeclassic-symbol {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3px;
    border-color: rgba(231, 200, 120, .22);
    background: linear-gradient(180deg, rgba(55,55,50,.78), rgba(13,28,17,.82));
}

.lifeclassic-symbol i {
    width: 3px;
    height: 10px;
    border-radius: 3px;
    background: linear-gradient(180deg, var(--gold-bright), var(--forest-400));
    box-shadow: 0 0 8px rgba(231, 200, 120, .24);
    transform-origin: center;
    animation: voiceBars .92s ease-in-out infinite alternate;
}

.lifeclassic-symbol i:nth-child(2) { animation-delay: -.18s; }
.lifeclassic-symbol i:nth-child(3) { animation-delay: -.42s; }
.lifeclassic-symbol i:nth-child(4) { animation-delay: -.66s; }
.lifeclassic-symbol i:nth-child(5) { animation-delay: -.30s; }
.lifeclassic-symbol i:nth-child(6) { animation-delay: -.54s; }

/* Eesah: music notes rise out of a small circular reggae pulse */
.site-tile--eesah {
    background:
        radial-gradient(circle at 12% 50%, rgba(231, 200, 120, .12), transparent 25%),
        linear-gradient(135deg, rgba(38, 64, 36, .82), rgba(13, 27, 18, .92));
    border-color: rgba(231, 200, 120, .24);
}

.eesah-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 3;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: visible;
    border: 1px solid rgba(231, 200, 120, .30);
    border-radius: 50%;
    background:
        radial-gradient(circle at 38% 32%, rgba(255,255,255,.12), transparent 18%),
        radial-gradient(circle at center, rgba(64, 103, 54, .92) 0 48%, rgba(13, 31, 20, .96) 72% 100%);
    box-shadow:
        0 0 0 5px rgba(116, 197, 110, .035),
        0 0 20px rgba(231, 200, 120, .11);
    animation: eesahPulse 2.8s ease-in-out infinite;
}

.eesah-symbol::before,
.eesah-symbol::after {
    content: "";
    position: absolute;
    inset: 8px;
    border: 1px solid rgba(231, 200, 120, .18);
    border-radius: 50%;
    animation: eesahRing 2.6s ease-out infinite;
}

.eesah-symbol::after {
    inset: 13px;
    animation-delay: -1.3s;
}

.eesah-symbol i {
    position: absolute;
    left: 50%;
    top: 53%;
    z-index: 4;
    color: #F3DB89;
    font-family: Georgia, serif;
    font-size: 13px;
    font-style: normal;
    line-height: 1;
    opacity: 0;
    text-shadow: 0 0 8px rgba(243, 219, 137, .52);
    pointer-events: none;
    animation: eesahNoteRise 3.2s ease-out infinite;
}

.eesah-symbol i:nth-child(1) { --eesah-x: -18px; --eesah-y: -31px; --eesah-r: -18deg; animation-delay: 0s; }
.eesah-symbol i:nth-child(2) { --eesah-x: 11px; --eesah-y: -36px; --eesah-r: 19deg; animation-delay: -.65s; font-size: 15px; }
.eesah-symbol i:nth-child(3) { --eesah-x: -7px; --eesah-y: -43px; --eesah-r: -7deg; animation-delay: -1.3s; }
.eesah-symbol i:nth-child(4) { --eesah-x: 18px; --eesah-y: -27px; --eesah-r: 24deg; animation-delay: -1.95s; font-size: 14px; }
.eesah-symbol i:nth-child(5) { --eesah-x: -24px; --eesah-y: -22px; --eesah-r: -25deg; animation-delay: -2.6s; font-size: 12px; }

.site-tile--eesah:hover .eesah-symbol {
    animation-duration: 1.7s;
    box-shadow:
        0 0 0 7px rgba(116, 197, 110, .055),
        0 0 26px rgba(231, 200, 120, .18);
}

.site-tile--eesah:hover .eesah-symbol i {
    animation-duration: 2.15s;
}

.site-tile--roy {
    min-height: 82px;
    background:
        radial-gradient(circle at 14% 50%, rgba(231,200,120,.19), transparent 36%),
        linear-gradient(145deg, rgba(80,67,25,.39), rgba(14,30,18,.70));
}

.roy-swarm {
    position: absolute;
    inset: 0 auto 0 0;
    z-index: 1;
    width: 92px;
    pointer-events: none;
}

.roy-swarm i {
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--gold-bright);
    box-shadow: 0 0 8px rgba(255,240,185,.64);
    animation: beeDrift 4.2s ease-in-out infinite;
}

.roy-swarm i:nth-child(1) { left: 20px; top: 17px; }
.roy-swarm i:nth-child(2) { left: 45px; top: 24px; animation-delay: -.8s; }
.roy-swarm i:nth-child(3) { left: 28px; top: 48px; animation-delay: -1.5s; }
.roy-swarm i:nth-child(4) { left: 63px; top: 51px; animation-delay: -2.2s; }
.roy-swarm i:nth-child(5) { left: 73px; top: 19px; animation-delay: -2.9s; }
.roy-swarm i:nth-child(6) { left: 49px; top: 66px; animation-delay: -3.5s; }

.site-tile--mk {
    background:
        radial-gradient(circle at 17% 50%, rgba(171,46,29,.23), transparent 38%),
        linear-gradient(145deg, rgba(70,25,20,.58), rgba(13,17,13,.83));
    border-color: rgba(219, 105, 69, .18);
}

.site-tile--mk:hover {
    border-color: rgba(231, 139, 97, .48);
    box-shadow: 0 13px 33px rgba(0,0,0,.28), 0 0 27px rgba(200,76,44,.10);
}

.mk-orbit {
    position: absolute;
    left: 13px;
    top: 50%;
    z-index: 1;
    width: 44px;
    height: 44px;
    transform: translateY(-50%);
    border: 1px solid rgba(231,200,120,.25);
    border-radius: 50%;
    opacity: .65;
}

.mk-orbit::before,
.mk-orbit::after {
    content: "";
    position: absolute;
    inset: 7px;
    border: 1px solid rgba(231,105,69,.30);
    border-radius: inherit;
    animation: mkSpin 8s linear infinite;
}

.mk-orbit::after {
    inset: 16px;
    background: rgba(231,200,120,.42);
    border: 0;
    box-shadow: 0 0 13px rgba(231,105,69,.35);
}

.site-tile--mk .site-tile__copy {
    padding-left: 52px;
}


.site-tile__logo {
    position: absolute;
    left: 12px;
    top: 50%;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    overflow: hidden;
    transform: translateY(-50%);
    border: 1px solid rgba(231, 200, 120, .34);
    border-radius: 50%;
    background: rgba(7, 18, 11, .72);
    box-shadow:
        0 0 0 5px rgba(231, 200, 120, .035),
        0 0 18px rgba(231, 105, 69, .12);
}

.site-tile__logo img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 50%;
}

.site-tile--mk {
    min-height: 84px;
}

.site-tile--mk .site-tile__copy {
    padding-left: 55px;
}

.site-tile--oregon {
    min-height: 82px;
    padding-left: 72px;
    background:
        radial-gradient(circle at 17% 50%, rgba(162, 210, 119, .18), transparent 38%),
        linear-gradient(145deg, rgba(38, 75, 47, .54), rgba(12, 25, 17, .78));
}

.oregon-symbol {
    position: absolute;
    left: 18px;
    top: 50%;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    overflow: hidden;
    transform: translateY(-50%);
    border: 1px solid rgba(162, 210, 119, .28);
    border-radius: 50%;
    color: var(--gold-bright);
    background: rgba(10, 33, 22, .70);
    box-shadow: 0 0 18px rgba(116, 197, 110, .11);
}

.oregon-symbol svg {
    position: relative;
    z-index: 2;
    width: 28px;
    height: 28px;
}

.oregon-wind {
    position: absolute;
    left: -28px;
    z-index: 3;
    width: 25px;
    height: 1px;
    border-radius: 999px;
    background: linear-gradient(90deg, transparent, rgba(255,240,185,.90), transparent);
    box-shadow: 0 0 7px rgba(255,240,185,.32);
    animation: oregonBreeze 3.1s ease-in-out infinite;
}

.oregon-wind--one { top: 12px; }
.oregon-wind--two { top: 23px; animation-delay: -1.1s; width: 31px; }
.oregon-wind--three { top: 34px; animation-delay: -2.05s; width: 20px; }

/* Manitowish Waters Wisconsin — lake-sign badge with moving water */
.site-tile--manitowish {
    min-height: 82px;
    padding-left: 74px;
    background:
        radial-gradient(circle at 15% 50%, rgba(112, 184, 199, .18), transparent 39%),
        linear-gradient(145deg, rgba(47, 77, 60, .56), rgba(12, 25, 17, .80));
    border-color: rgba(151, 190, 174, .20);
}

.site-tile--manitowish .site-tile__copy small {
    display: none;
}

.manitowish-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 2px solid rgba(234, 237, 216, .72);
    border-radius: 50%;
    color: rgba(249, 247, 231, .96);
    background:
        linear-gradient(180deg, rgba(73, 101, 78, .96) 0 56%, rgba(70, 135, 158, .92) 57% 100%);
    box-shadow:
        0 0 0 3px rgba(122, 75, 61, .38),
        0 0 18px rgba(99, 177, 196, .16);
    animation: manitowishBadgeBreathe 4.2s ease-in-out infinite;
}

.manitowish-symbol::before {
    content: "";
    position: absolute;
    left: 7px;
    right: 7px;
    top: 7px;
    height: 18px;
    border: 1px solid rgba(241, 240, 221, .62);
    border-radius: 12px 12px 9px 9px;
    background:
        linear-gradient(155deg, transparent 0 31%, rgba(210, 227, 208, .18) 32% 37%, transparent 38% 100%);
}

.manitowish-symbol b {
    position: absolute;
    left: 50%;
    top: 9px;
    z-index: 3;
    transform: translateX(-50%);
    font-family: Georgia, serif;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: -.03em;
    color: #F6F3DE;
    text-shadow: 0 1px 4px rgba(0,0,0,.42);
}

.manitowish-symbol::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 18px;
    background:
        linear-gradient(180deg, rgba(125, 196, 213, .30), rgba(41, 109, 139, .80));
    box-shadow: inset 0 3px 9px rgba(225, 250, 255, .12);
}

.manitowish-symbol i {
    position: absolute;
    z-index: 4;
    left: -7px;
    width: 58px;
    height: 6px;
    border-top: 1.4px solid rgba(220, 247, 250, .88);
    border-radius: 50%;
    opacity: .78;
    animation: manitowishWater 2.9s ease-in-out infinite;
}

.manitowish-symbol i:nth-of-type(1) { bottom: 11px; }
.manitowish-symbol i:nth-of-type(2) { bottom: 6px; animation-delay: -.95s; opacity: .58; }
.manitowish-symbol i:nth-of-type(3) { bottom: 1px; animation-delay: -1.9s; opacity: .42; }

.site-tile--manitowish:hover .manitowish-symbol {
    animation-duration: 2.3s;
    box-shadow:
        0 0 0 3px rgba(122, 75, 61, .48),
        0 0 24px rgba(104, 196, 216, .24);
}

.site-tile--manitowish:hover .manitowish-symbol i {
    animation-duration: 1.9s;
}

/* Dallas Texas — a prairie sign with DL / TX and a drifting wind */
.site-tile--dallas {
    min-height: 82px;
    padding-left: 74px;
    background:
        radial-gradient(circle at 15% 50%, rgba(160, 205, 215, .16), transparent 38%),
        linear-gradient(145deg, rgba(66, 83, 59, .56), rgba(14, 26, 18, .82));
    border-color: rgba(178, 198, 186, .22);
}

.site-tile--dallas .site-tile__copy small {
    display: none;
}

.dallas-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 2px solid rgba(236, 237, 228, .72);
    border-radius: 50%;
    color: rgba(248, 247, 235, .96);
    background:
        linear-gradient(180deg, rgba(106, 122, 92, .95) 0 58%, rgba(137, 95, 65, .95) 59% 100%);
    box-shadow:
        0 0 0 3px rgba(89, 61, 43, .34),
        0 0 18px rgba(140, 198, 214, .14);
    animation: dallasBadgeBreathe 4s ease-in-out infinite;
}

.dallas-symbol::before {
    content: "";
    position: absolute;
    left: 7px;
    right: 7px;
    top: 7px;
    height: 18px;
    border: 1px solid rgba(244, 241, 224, .64);
    border-radius: 12px 12px 9px 9px;
    background:
        linear-gradient(155deg, transparent 0 28%, rgba(229, 239, 224, .18) 29% 35%, transparent 36% 100%);
}

.dallas-symbol::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    height: 16px;
    background: linear-gradient(180deg, rgba(173, 130, 90, .24), rgba(91, 60, 39, .68));
}

.dallas-symbol b {
    position: absolute;
    left: 50%;
    top: 8px;
    z-index: 3;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    font-family: Georgia, serif;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
    color: #F8F4DF;
    text-shadow: 0 1px 4px rgba(0,0,0,.42);
    line-height: 1;
}

.dallas-symbol b span:last-child {
    font-size: 6.5px;
    letter-spacing: .12em;
    opacity: .96;
}

.dallas-breeze {
    position: absolute;
    right: 5px;
    z-index: 4;
    display: block;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(238, 247, 248, 0), rgba(238, 247, 248, .95));
    box-shadow: 0 0 8px rgba(206, 238, 241, .14);
    animation: dallasBreeze 2.8s ease-in-out infinite;
}

.dallas-breeze--one { top: 24px; width: 17px; animation-delay: 0s; }
.dallas-breeze--two { top: 29px; width: 13px; animation-delay: -.85s; opacity: .76; }
.dallas-breeze--three { top: 34px; width: 10px; animation-delay: -1.7s; opacity: .56; }

.site-tile--dallas:hover .dallas-symbol {
    animation-duration: 2.4s;
    box-shadow:
        0 0 0 3px rgba(89, 61, 43, .46),
        0 0 24px rgba(169, 220, 232, .22);
}

.site-tile--dallas:hover .dallas-breeze {
    animation-duration: 1.9s;
}

.site-tile--classic {
    background:
        radial-gradient(circle at 15% 50%, rgba(220,220,220,.13), transparent 36%),
        linear-gradient(145deg, rgba(54,54,54,.62), rgba(12,24,15,.78));
}

.site-tile--delight {
    background:
        radial-gradient(circle at 16% 50%, rgba(107,147,214,.14), transparent 36%),
        linear-gradient(145deg, rgba(31,61,79,.43), rgba(12,25,17,.76));
}

.site-tile--road {
    background:
        radial-gradient(circle at 15% 50%, rgba(187,142,78,.14), transparent 37%),
        linear-gradient(145deg, rgba(67,53,33,.42), rgba(12,25,17,.76));
}

.site-tile--monitor {
    min-height: 82px;
    padding-left: 72px;
}

.monitor-symbol {
    position: absolute;
    left: 23px;
    top: 50%;
    width: 26px;
    height: 26px;
    transform: translateY(-50%);
    border-radius: 50%;
    background: #4DFF8B;
    box-shadow:
        0 0 0 8px rgba(77,255,139,.06),
        0 0 26px rgba(77,255,139,.58);
    animation: monitorPulse 2s ease-in-out infinite;
}

.monitor-symbol i {
    position: absolute;
    inset: -9px;
    border: 1px solid rgba(77,255,139,.42);
    border-radius: inherit;
    animation: monitorRing 2s ease-out infinite;
}


.site-tile--juniper,
.site-tile--greenlake,
.site-tile--crater {
    min-height: 82px;
    padding-left: 74px;
}

.site-tile--juniper {
    background:
        radial-gradient(circle at 15% 50%, rgba(149, 203, 127, .18), transparent 39%),
        linear-gradient(145deg, rgba(44, 88, 48, .56), rgba(12, 25, 17, .78));
    border-color: rgba(143, 200, 124, .20);
}

.site-tile--crater {
    background:
        radial-gradient(circle at 15% 50%, rgba(96, 171, 210, .16), transparent 38%),
        linear-gradient(145deg, rgba(29, 69, 83, .52), rgba(12, 25, 17, .79));
    border-color: rgba(102, 179, 211, .18);
}

.site-tile--greenlake {
    background:
        radial-gradient(circle at 15% 50%, rgba(111, 202, 120, .18), transparent 39%),
        linear-gradient(145deg, rgba(41, 89, 55, .56), rgba(11, 25, 18, .80));
    border-color: rgba(136, 204, 127, .20);
}

.juniper-symbol,
.greenlake-symbol,
.crater-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 1px solid rgba(162, 210, 119, .25);
    background: rgba(10, 33, 22, .74);
    box-shadow: 0 0 18px rgba(116, 197, 110, .10);
}

.juniper-symbol {
    border-radius: 15px;
}

.greenlake-symbol {
    border-radius: 50%;
    border-color: rgba(144, 213, 132, .28);
    background:
        radial-gradient(circle at 42% 38%, rgba(197, 245, 208, .16), transparent 35%),
        linear-gradient(180deg, rgba(34, 79, 44, .92), rgba(10, 38, 21, .96));
    box-shadow: 0 0 18px rgba(116, 197, 110, .14);
}

.greenlake-symbol::before {
    content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: 8px;
    height: 19px;
    border-radius: 50%;
    background: linear-gradient(180deg, rgba(103, 205, 124, .78), rgba(31, 116, 74, .94));
    box-shadow: inset 0 3px 8px rgba(234, 255, 236, .16), 0 0 12px rgba(102, 200, 123, .16);
}

.greenlake-symbol b {
    position: absolute;
    left: 50%;
    top: 8px;
    z-index: 4;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    font-family: Georgia, serif;
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .08em;
    color: #EEF8E8;
    text-shadow: 0 1px 4px rgba(0,0,0,.42);
    line-height: 1;
}

.greenlake-symbol b span:last-child {
    font-size: 6.5px;
    letter-spacing: .12em;
    opacity: .96;
}

.greenlake-wave {
    position: absolute;
    left: 9px;
    z-index: 3;
    display: block;
    height: 5px;
    border-top: 1.5px solid rgba(225, 252, 228, .86);
    border-radius: 50%;
    animation: greenlakeWater 3s ease-in-out infinite;
}

.greenlake-wave--one { top: 24px; width: 22px; }
.greenlake-wave--two { top: 30px; width: 28px; left: 7px; animation-delay: -1.15s; opacity: .76; }

.greenlake-trail {
    position: absolute;
    left: 18px;
    top: 11px;
    z-index: 2;
    width: 12px;
    height: 22px;
    border-radius: 55% 45% 60% 40%;
    border: 1.5px solid rgba(244, 240, 208, .74);
    border-color: rgba(244, 240, 208, .74) transparent transparent transparent;
    transform: rotate(24deg);
    opacity: .9;
}

.greenlake-trail::before {
    content: "";
    position: absolute;
    left: -2px;
    top: 7px;
    width: 14px;
    height: 10px;
    border-radius: 50%;
    border: 1.5px solid rgba(244, 240, 208, .72);
    border-color: rgba(244, 240, 208, .72) transparent transparent transparent;
    transform: rotate(10deg);
    animation: greenlakeTrail 3.6s ease-in-out infinite;
}

.site-tile--greenlake:hover .greenlake-wave {
    animation-duration: 2.1s;
}

.site-tile--greenlake:hover .greenlake-trail::before {
    animation-duration: 2.2s;
}

.juniper-symbol i {
    position: absolute;
    width: 18px;
    height: 3px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(220,243,201,.96), rgba(123,193,95,.96));
    box-shadow:
        0 -5px 0 -1px rgba(165,220,132,.84),
        0 5px 0 -1px rgba(165,220,132,.84),
        5px -3px 0 -1px rgba(133,202,107,.76),
        5px 3px 0 -1px rgba(133,202,107,.76);
    transform-origin: left center;
    animation: juniperNeedle 3.6s ease-in-out infinite;
}

.juniper-symbol i:nth-child(1) { left: 8px; top: 12px; --rot: -22deg; }
.juniper-symbol i:nth-child(2) { left: 13px; top: 20px; width: 20px; --rot: 8deg; animation-delay: -.9s; }
.juniper-symbol i:nth-child(3) { left: 10px; top: 30px; width: 17px; --rot: 26deg; animation-delay: -1.8s; }
.juniper-symbol i:nth-child(4) { left: 23px; top: 17px; width: 13px; --rot: 76deg; animation-delay: -2.5s; }

.crater-symbol {
    display: grid;
    place-items: center;
    border-radius: 50%;
    border-color: rgba(125, 195, 224, .28);
    color: rgba(196,241,255,.95);
}

.crater-symbol::before {
    content: "";
    position: absolute;
    inset: 10px;
    border-radius: 50%;
    background: radial-gradient(circle at 45% 35%, rgba(203,247,255,.92), rgba(72,152,185,.96) 55%, rgba(8,53,63,.98));
    box-shadow: inset 0 0 12px rgba(255,255,255,.14), 0 0 14px rgba(84,194,224,.24);
}

.crater-symbol i {
    position: absolute;
    border: 1px solid rgba(175, 230, 247, .65);
    border-radius: 50%;
    opacity: 0;
    animation: craterRipple 3.5s ease-out infinite;
}

.crater-symbol i:nth-child(1) { width: 16px; height: 6px; top: 17px; left: 15px; }
.crater-symbol i:nth-child(2) { width: 22px; height: 8px; top: 19px; left: 12px; animation-delay: -1.15s; }
.crater-symbol i:nth-child(3) { width: 28px; height: 10px; top: 21px; left: 9px; animation-delay: -2.25s; }

/* Carterain — a small home with a warm light breathing inside */
.site-tile--carterain,
.site-tile--wallowa,
.site-tile--oregonbeauty {
    min-height: 82px;
    padding-left: 74px;
}

.site-tile--carterain {
    background:
        radial-gradient(circle at 15% 50%, rgba(242, 201, 118, .16), transparent 38%),
        linear-gradient(145deg, rgba(69, 67, 40, .48), rgba(12, 25, 17, .79));
    border-color: rgba(226, 194, 117, .18);
}

.carterain-symbol,
.wallowa-symbol,
.oregonbeauty-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 1px solid rgba(162, 210, 119, .25);
    background: rgba(10, 33, 22, .74);
    box-shadow: 0 0 18px rgba(116, 197, 110, .10);
}

.carterain-symbol {
    border-radius: 15px;
    background:
        radial-gradient(circle at 50% 72%, rgba(246, 209, 121, .10), transparent 42%),
        linear-gradient(180deg, rgba(25, 52, 34, .92), rgba(9, 25, 16, .96));
}

.carterain-house {
    position: absolute;
    left: 11px;
    top: 16px;
    width: 24px;
    height: 19px;
    border: 2px solid rgba(221, 232, 208, .78);
    border-top: 0;
    border-radius: 2px 2px 5px 5px;
}

.carterain-house::before {
    content: "";
    position: absolute;
    left: 1px;
    top: -10px;
    width: 16px;
    height: 16px;
    border-left: 2px solid rgba(221, 232, 208, .78);
    border-top: 2px solid rgba(221, 232, 208, .78);
    transform: rotate(45deg);
    transform-origin: center;
}

.carterain-window {
    position: absolute;
    left: 19px;
    top: 24px;
    z-index: 2;
    width: 8px;
    height: 8px;
    border-radius: 2px;
    background: #F9D57A;
    box-shadow: 0 0 7px rgba(249, 213, 122, .75);
    animation: carterainWindow 3.1s ease-in-out infinite;
}

.carterain-glow {
    position: absolute;
    left: 13px;
    top: 16px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(249, 213, 122, .34), transparent 68%);
    animation: carterainGlow 3.1s ease-in-out infinite;
}

/* Wallowa Lake — small animated water surface */
.site-tile--wallowa {
    background:
        radial-gradient(circle at 15% 50%, rgba(90, 184, 211, .16), transparent 39%),
        linear-gradient(145deg, rgba(30, 75, 84, .50), rgba(11, 25, 18, .80));
    border-color: rgba(101, 187, 213, .18);
}

.wallowa-symbol {
    border-radius: 50%;
    border-color: rgba(128, 203, 226, .28);
    background:
        linear-gradient(180deg, rgba(35, 88, 91, .88), rgba(7, 42, 53, .96));
}

.wallowa-symbol::before {
    content: "";
    position: absolute;
    left: 8px;
    right: 8px;
    bottom: 8px;
    height: 20px;
    border-radius: 50%;
    background: linear-gradient(180deg, rgba(89, 188, 215, .76), rgba(30, 103, 140, .92));
    box-shadow: inset 0 3px 8px rgba(230, 252, 255, .15), 0 0 12px rgba(78, 180, 211, .18);
}

.wallowa-symbol i {
    position: absolute;
    left: 9px;
    width: 28px;
    height: 5px;
    border-top: 1.5px solid rgba(207, 243, 250, .86);
    border-radius: 50%;
    animation: wallowaWater 2.8s ease-in-out infinite;
}

.wallowa-symbol i:nth-child(1) { top: 22px; }
.wallowa-symbol i:nth-child(2) { top: 27px; width: 23px; left: 12px; animation-delay: -.85s; }
.wallowa-symbol i:nth-child(3) { top: 32px; width: 30px; left: 8px; animation-delay: -1.7s; }

/* The Beauty of Oregon — a diamond catching sunlight */
.site-tile--oregonbeauty {
    background:
        radial-gradient(circle at 15% 50%, rgba(219, 239, 236, .15), transparent 38%),
        linear-gradient(145deg, rgba(50, 76, 70, .48), rgba(12, 25, 17, .80));
    border-color: rgba(187, 220, 214, .18);
}

.oregonbeauty-symbol {
    display: grid;
    place-items: center;
    overflow: visible;
    border-radius: 15px;
    border-color: rgba(203, 230, 224, .26);
    background:
        radial-gradient(circle at 50% 46%, rgba(208, 240, 236, .11), transparent 60%),
        rgba(10, 33, 22, .78);
}

.oregonbeauty-diamond {
    position: relative;
    z-index: 2;
    width: 22px;
    height: 22px;
    transform: rotate(45deg);
    border: 1px solid rgba(235, 252, 248, .74);
    border-radius: 4px;
    background:
        linear-gradient(135deg, rgba(245,255,252,.90), rgba(123,196,187,.38) 42%, rgba(229,247,243,.78) 70%, rgba(78,142,132,.32));
    box-shadow: inset 0 0 7px rgba(255,255,255,.28), 0 0 11px rgba(185, 232, 224, .18);
    animation: oregonDiamondBreathe 3.8s ease-in-out infinite;
}

.oregonbeauty-diamond::before,
.oregonbeauty-diamond::after {
    content: "";
    position: absolute;
    background: rgba(255,255,255,.35);
}

.oregonbeauty-diamond::before { left: 50%; top: 0; bottom: 0; width: 1px; }
.oregonbeauty-diamond::after { top: 50%; left: 0; right: 0; height: 1px; }

.oregonbeauty-shine {
    position: absolute;
    z-index: 4;
    left: 50%;
    top: 50%;
    width: 4px;
    height: 4px;
    margin: -2px 0 0 -2px;
    border-radius: 50%;
    background: #FFFDF0;
    box-shadow:
        0 -10px 0 -1.5px rgba(255,253,240,.90),
        0 10px 0 -1.5px rgba(255,253,240,.90),
        10px 0 0 -1.5px rgba(255,253,240,.90),
        -10px 0 0 -1.5px rgba(255,253,240,.90),
        0 0 14px rgba(255,255,238,.90);
    opacity: 0;
    animation: oregonDiamondShine 3.2s ease-in-out infinite;
}

.oregonbeauty-shine--two {
    left: 69%;
    top: 31%;
    animation-delay: -1.55s;
}

.site-tile--time {
    min-height: 88px;
    padding-left: 104px;
    background:
        radial-gradient(circle at 19% 50%, rgba(231,200,120,.14), transparent 38%),
        linear-gradient(145deg, rgba(48,69,40,.48), rgba(12,25,17,.78));
}

.time-symbol {
    position: absolute;
    left: 14px;
    top: 50%;
    display: flex;
    align-items: center;
    gap: 2px;
    transform: translateY(-50%);
    padding: 8px 8px;
    border: 1px solid rgba(231,200,120,.22);
    border-radius: 9px;
    color: var(--cream);
    background: #0A2116;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.025);
    font-family: Arial, sans-serif;
}

.time-symbol b {
    min-width: 20px;
    text-align: center;
    font-size: .88rem;
}

.time-symbol em {
    color: var(--forest-200);
    font-style: normal;
    animation: clockBlink 1s steps(1) infinite;
}

.time-symbol small {
    margin-left: 3px;
    color: var(--gold-bright);
    font-size: .48rem;
    font-weight: 900;
}

/* Popular posts */
.popular-list {
    counter-reset: popular;
    display: grid;
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.popular-list li {
    counter-increment: popular;
    display: grid;
    grid-template-columns: 29px minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    padding-bottom: 11px;
    border-bottom: 1px dashed rgba(162,210,119,.13);
    color: var(--cream-soft);
}

.popular-list li:last-child {
    padding-bottom: 0;
    border-bottom: 0;
}

.popular-list li::before {
    content: counter(popular, decimal-leading-zero);
    color: var(--forest-200);
    font-family: Arial, sans-serif;
    font-size: .70rem;
    font-weight: 900;
}

.popular-list a {
    overflow: hidden;
    color: var(--cream);
    text-decoration: none;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.popular-list span {
    color: var(--gold-bright);
    font-family: Arial, sans-serif;
    font-size: .70rem;
    font-weight: 800;
}

.popular-list__empty {
    display: block !important;
    color: var(--cream-dim) !important;
}

.popular-list__empty::before {
    display: none;
}

/* Server status */
.server-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.status-orb {
    position: relative;
    width: 26px;
    height: 26px;
    flex: 0 0 auto;
    margin-top: 4px;
    border-radius: 50%;
}

.status-orb i {
    position: absolute;
    inset: -7px;
    border: 1px solid currentColor;
    border-radius: inherit;
    opacity: .22;
}

.status-orb i:nth-child(2) {
    inset: -14px;
    opacity: .10;
}

.status-orb--up {
    color: #4DFF8B;
    background: #4DFF8B;
    box-shadow: 0 0 24px rgba(77,255,139,.60);
    animation: monitorPulse 2s ease-in-out infinite;
}

.status-orb--up i {
    animation: monitorRing 2s ease-out infinite;
}

.status-orb--maintenance {
    color: #FFD55D;
    background: #FFD55D;
    box-shadow: 0 0 22px rgba(255,213,93,.42);
    animation: maintenancePulse 2.4s ease-in-out infinite;
}

.status-orb--down {
    color: #FF4D4D;
    background: #FF4D4D;
    box-shadow: 0 0 24px rgba(255,77,77,.55);
    animation: alertPulse .86s ease-in-out infinite;
}

.server-panel__state {
    margin: 18px 0 3px;
    font-size: 1.18rem;
    font-weight: 800;
}

.server-panel__note {
    margin: 0;
    color: var(--cream-dim);
    font-size: .88rem;
}

/* Search */
.search-form {
    display: flex;
    align-items: stretch;
    gap: 9px;
}

.search-form__field {
    position: relative;
    flex: 1;
    min-width: 0;
}

.search-form__icon {
    position: absolute;
    left: 15px;
    top: 50%;
    z-index: 2;
    transform: translateY(-50%);
    color: var(--forest-200);
    font-size: 1.2rem;
    pointer-events: none;
}

.search-field {
    width: 100%;
    min-height: 50px;
    padding: 10px 14px 10px 43px;
    border: 1px solid rgba(162,210,119,.18);
    border-radius: 999px;
    color: var(--cream);
    background: rgba(8,22,12,.54);
    outline: 0;
}

.search-field::placeholder {
    color: rgba(240,247,236,.42);
}

.search-field:focus {
    border-color: rgba(162,210,119,.48);
    box-shadow: 0 0 0 3px rgba(116,197,110,.08);
}

.search-submit {
    min-height: 50px;
    padding: 11px 17px;
    border: 1px solid rgba(231,200,120,.48);
}

/* Article templates */
.article-panel {
    max-width: 960px;
    margin: 0 auto;
}

.article-header h1 {
    margin: 0;
    font-size: clamp(2.6rem, 6vw, 6.5rem);
    line-height: .96;
    letter-spacing: -.05em;
}

.article-views {
    color: var(--cream-dim);
}

.article-cover {
    overflow: hidden;
    margin: 28px 0;
    border-radius: var(--radius-md);
}

.entry-content {
    font-size: 1.07rem;
}

.entry-content > * {
    max-width: 780px;
    margin-right: auto;
    margin-left: auto;
}

.entry-content > .alignwide {
    max-width: 1110px;
}

.entry-content > .alignfull {
    max-width: none;
}

.entry-content h2,
.entry-content h3 {
    margin-top: 1.8em;
    line-height: 1.15;
}

.entry-content a {
    color: var(--forest-200);
}

.entry-content blockquote {
    margin: 1.55em auto;
    padding: .55em 0 .55em 1.25em;
    border-left: 3px solid var(--gold);
    color: var(--cream-soft);
}

.article-footer {
    margin-top: 30px;
}

.tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.tag-list a {
    padding: 6px 11px;
    border: 1px solid rgba(162,210,119,.15);
    border-radius: 999px;
    background: rgba(116,197,110,.09);
    text-decoration: none;
    font-size: .82rem;
}

.post-navigation {
    max-width: 960px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
    margin: 22px auto 0;
    padding: 18px 21px;
    border-radius: var(--radius-md);
}

.post-navigation div:last-child {
    text-align: right;
}

.post-navigation a {
    color: var(--gold-bright);
    text-decoration: none;
    font-weight: 800;
}

.not-found {
    max-width: 760px;
    margin: 8vh auto;
    text-align: center;
}

.not-found__code {
    margin: 0;
    color: var(--gold-bright);
    font-size: clamp(5rem, 14vw, 11rem);
    line-height: .9;
    letter-spacing: -.08em;
}

.not-found .search-form {
    margin: 24px 0;
}

.nav-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 25px;
}

.page-numbers {
    min-width: 43px;
    min-height: 43px;
    display: grid;
    place-items: center;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    text-decoration: none;
}

.page-numbers.current {
    color: var(--gold-bright);
    background: rgba(116,197,110,.16);
}

/* Footer */
.site-footer {
    margin-top: 22px;
    padding: 18px 22px;
    border-radius: var(--radius-lg);
    color: var(--cream-dim);
    text-align: center;
    font-size: .90rem;
}

.site-footer p {
    margin: 0;
}

.site-footer__dot {
    margin: 0 8px;
    color: var(--gold);
}

/* Animation keyframes */
@keyframes veilDrift {
    from { background-position: 0% 0%; }
    to { background-position: 100% 100%; }
}

@keyframes haloBreathe {
    from { transform: scale(.97) rotate(0); opacity: .28; }
    to { transform: scale(1.05) rotate(5deg); opacity: .67; }
}

@keyframes musicIdle {
    0%, 88%, 100% { transform: rotate(0); }
    85% { transform: rotate(-7deg); }
    89% { transform: rotate(7deg); }
    93% { transform: rotate(-4deg); }
    97% { transform: rotate(3deg); }
}

@keyframes musicPlaying {
    0%, 100% { transform: rotate(-2deg) scale(1.01); }
    50% { transform: rotate(2deg) scale(1.05); }
}

@keyframes musicRing {
    from { transform: scale(.90); opacity: .84; }
    to { transform: scale(1.48); opacity: 0; }
}

@keyframes noteFlight {
    0% { opacity: 0; transform: translate(0, 0) scale(.5) rotate(0); }
    16% { opacity: 1; }
    100% {
        opacity: 0;
        transform: translate(var(--note-x), -92px) scale(1.18) rotate(var(--note-r));
    }
}

@keyframes dreamMarkBreathe {
    from { transform: scale(.975) translateY(0); opacity: .66; }
    to { transform: scale(1.025) translateY(-5px); opacity: .88; }
}

@keyframes daisyBloom {
    0%, 18%, 100% { opacity: 0; transform: translateY(4px) scale(.38) rotate(-12deg); }
    35%, 73% { opacity: 1; transform: translateY(0) scale(1) rotate(0); }
    86% { opacity: .25; transform: translateY(-4px) scale(.72) rotate(10deg); }
}

@keyframes eesahPulse {
    0%, 100% { transform: translateY(-50%) scale(1) rotate(0deg); }
    45% { transform: translateY(-50%) scale(1.055) rotate(-1.2deg); }
    55% { transform: translateY(-50%) scale(1.04) rotate(1.2deg); }
}

@keyframes eesahRing {
    0% { opacity: .42; transform: scale(.72); }
    70% { opacity: .10; }
    100% { opacity: 0; transform: scale(1.55); }
}

@keyframes eesahNoteRise {
    0% {
        opacity: 0;
        transform: translate(-50%, -20%) scale(.62) rotate(0deg);
    }
    18% { opacity: .95; }
    68% { opacity: .72; }
    100% {
        opacity: 0;
        transform: translate(calc(-50% + var(--eesah-x)), var(--eesah-y)) scale(1.18) rotate(var(--eesah-r));
    }
}

@keyframes voiceBars {
    from { height: 8px; opacity: .60; }
    to { height: 29px; opacity: 1; }
}

@keyframes oregonBreeze {
    0%, 10% { transform: translateX(0) scaleX(.45); opacity: 0; }
    28% { opacity: .95; }
    75% { opacity: .72; }
    100% { transform: translateX(77px) scaleX(1.2); opacity: 0; }
}

@keyframes manitowishBadgeBreathe {
    0%, 100% { transform: translateY(-50%) scale(1); filter: brightness(.96); }
    50% { transform: translateY(-50%) scale(1.035); filter: brightness(1.08); }
}

@keyframes manitowishWater {
    0%, 100% { transform: translateX(-5px) scaleX(.88); opacity: .34; }
    50% { transform: translateX(6px) scaleX(1.08); opacity: .90; }
}

@keyframes dallasBadgeBreathe {
    0%, 100% { transform: translateY(-50%) scale(1); filter: brightness(.96); }
    50% { transform: translateY(-50%) scale(1.035); filter: brightness(1.09); }
}

@keyframes dallasBreeze {
    0%, 100% { transform: translateX(-9px) scaleX(.72); opacity: .10; }
    35% { opacity: .88; }
    55% { transform: translateX(2px) scaleX(1); opacity: .72; }
    100% { transform: translateX(9px) scaleX(1.16); opacity: 0; }
}

@keyframes compassDrift {
    to { transform: rotate(360deg); }
}

@keyframes buttonBreathe {
    0%, 100% { box-shadow: 0 15px 34px rgba(0,0,0,.36), inset 0 1px 0 rgba(255,255,255,.55); }
    50% { box-shadow: 0 15px 36px rgba(0,0,0,.40), 0 0 22px rgba(231,200,120,.10), inset 0 1px 0 rgba(255,255,255,.55); }
}

@keyframes buttonSheen {
    0%, 69% { left: -45%; opacity: 0; }
    76% { opacity: .72; }
    91%, 100% { left: 132%; opacity: 0; }
}

@keyframes tileBreathe {
    0%, 100% { box-shadow: inset 0 0 0 rgba(116,197,110,0), 0 0 0 rgba(116,197,110,0); }
    50% { box-shadow: inset 0 0 20px rgba(116,197,110,.035), 0 0 20px rgba(116,197,110,.025); }
}

@keyframes beeDrift {
    0%, 100% { transform: translate(0,0) scale(.84); opacity: .55; }
    50% { transform: translate(6px,-5px) scale(1.18); opacity: 1; }
}

@keyframes mkSpin {
    to { transform: rotate(360deg); }
}

@keyframes monitorPulse {
    0%, 100% { transform: translateY(-50%) scale(.88); opacity: .72; }
    50% { transform: translateY(-50%) scale(1.08); opacity: 1; }
}

.status-orb--up {
    animation-name: statusUpPulse;
}

@keyframes statusUpPulse {
    0%, 100% { transform: scale(.88); opacity: .72; }
    50% { transform: scale(1.08); opacity: 1; }
}

@keyframes monitorRing {
    from { transform: scale(.8); opacity: .50; }
    to { transform: scale(1.65); opacity: 0; }
}

@keyframes maintenancePulse {
    0%, 100% { transform: scale(.90); opacity: .68; }
    50% { transform: scale(1.07); opacity: 1; }
}

@keyframes alertPulse {
    0%, 100% { transform: scale(.85); opacity: .60; }
    50% { transform: scale(1.15); opacity: 1; }
}

@keyframes clockBlink {
    0%, 56% { opacity: 1; }
    50%, 100% { opacity: .24; }
}

@keyframes emptyGlow {
    0%, 100% { opacity: .52; transform: scale(.92); }
    50% { opacity: 1; transform: scale(1.08); }
}

/* Tablet and mobile */
@media (max-width: 1100px) {
    .home-layout {
        grid-template-columns: 1fr;
    }

    .living-sidebar {
        position: static;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .sidebar-panel--sites,
    .server-panel {
        grid-column: 1 / -1;
    }

    .site-tiles {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 782px) {
    .admin-bar .corner-controls {
        top: 46px;
    }
}

@media (max-width: 720px) {
    .corner-controls {
        padding-top: max(10px, env(safe-area-inset-top));
        padding-right: max(11px, env(safe-area-inset-right));
        padding-left: max(11px, env(safe-area-inset-left));
    }

    .language-switch {
        width: 94px;
        height: 40px;
    }

    .music-control {
        width: 58px;
        height: 58px;
    }

    .music-control__disc {
        inset: 7px;
    }

    .music-control__disc svg {
        width: 26px;
        height: 26px;
    }

    .site-reveal {
        width: min(calc(100% - 18px), var(--content-width));
        padding-top: 84px;
    }

    .hero-panel {
        min-height: 73vh;
        padding: 24px;
        border-radius: 24px;
    }

    .hero-panel::after {
        inset: 8px;
        border-radius: 17px;
    }

    .hero-panel__title {
        display: block;
        font-size: clamp(3.05rem, 15vw, 5.3rem);
        overflow-wrap: anywhere;
    }

    .hero-panel__coordinates {
        display: none;
    }

    .hero-panel__dream-mark {
        right: -35px;
        top: 13%;
        width: 220px;
        opacity: .34;
    }

    .hero-panel__actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .living-button {
        width: 100%;
    }

    .journal-panel,
    .archive-panel,
    .article-panel,
    .not-found,
    .sidebar-panel {
        padding: 19px;
        border-radius: 22px;
    }

    .post-grid {
        grid-template-columns: 1fr;
    }

    .living-sidebar {
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .sidebar-panel--sites,
    .server-panel {
        grid-column: auto;
    }

    .site-tiles {
        grid-template-columns: 1fr;
    }

    .search-form {
        flex-direction: column;
    }

    .search-submit {
        width: 100%;
    }

    .post-navigation {
        grid-template-columns: 1fr;
    }

    .post-navigation div:last-child {
        text-align: left;
    }
}

@media (max-width: 420px) {
    .hero-panel__title {
        font-size: clamp(2.6rem, 14.5vw, 4.4rem);
    }

    .hero-panel__line {
        letter-spacing: .08em;
    }

    .site-tile__copy strong {
        font-size: .71rem;
    }
}

@media (max-width: 900px) {
    .hero-panel__dream-mark {
        top: 96px;
        right: -28px;
        width: clamp(190px, 42vw, 280px);
        opacity: .28;
    }

    .hero-brand-logo {
        width: 118px;
    }
}

@media (max-width: 620px) {
    .hero-panel__dream-mark {
        top: 82px;
        right: -72px;
        width: 220px;
        opacity: .20;
    }

    .hero-brand-logo {
        width: 102px;
        margin-bottom: 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .001ms !important;
    }

    .site-reveal {
        opacity: 1;
        transform: none;
        filter: none;
        clip-path: none;
    }
}


/* Video fallback remains attractive while a browser retries autoplay. */
.background-video-paused .site-background__video {
    opacity: .98;
}


/* Live presence — administrator, visitors, and crawlers */
.presence-panel {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.presence-panel::before {
    content: "";
    position: absolute;
    width: 190px;
    height: 190px;
    right: -86px;
    top: -88px;
    z-index: -1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(77,255,139,.13), transparent 68%);
    animation: presenceAmbient 4.8s ease-in-out infinite;
}

.presence-panel__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
}

.presence-panel__head h2 {
    margin: 0;
}

.presence-live-orb {
    position: relative;
    width: 18px;
    height: 18px;
    flex: 0 0 auto;
    margin: 7px 5px 0 0;
    border-radius: 50%;
    color: #4DFF8B;
    background: currentColor;
    box-shadow: 0 0 18px rgba(77,255,139,.72), 0 0 38px rgba(77,255,139,.24);
    animation: presenceCorePulse 1.75s ease-in-out infinite;
    transition: color .3s ease, box-shadow .3s ease;
}

.presence-live-orb i {
    position: absolute;
    inset: -7px;
    border: 1px solid currentColor;
    border-radius: inherit;
    animation: presenceRing 2s ease-out infinite;
}

.presence-live-orb i:nth-child(2) {
    animation-delay: 1s;
}

.presence-panel.is-unavailable .presence-live-orb {
    color: #FFD55D;
    box-shadow: 0 0 18px rgba(255,213,93,.58), 0 0 34px rgba(255,213,93,.18);
}

.presence-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin-top: 18px;
}

.presence-stat {
    position: relative;
    min-width: 0;
    padding: 12px 8px 11px;
    overflow: hidden;
    border: 1px solid rgba(240,247,236,.09);
    border-radius: 14px;
    background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(3,14,8,.24));
    text-align: center;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
}

.presence-stat::after {
    content: "";
    position: absolute;
    inset: auto 12% -18px;
    height: 28px;
    border-radius: 50%;
    background: currentColor;
    opacity: .12;
    filter: blur(12px);
    animation: presenceGlow 2.8s ease-in-out infinite;
}

.presence-stat__dot {
    display: block;
    width: 7px;
    height: 7px;
    margin: 0 auto 5px;
    border-radius: 50%;
    color: inherit;
    background: currentColor;
    box-shadow: 0 0 11px currentColor;
    animation: presenceDotBlink 1.55s ease-in-out infinite;
}

.presence-stat strong {
    position: relative;
    z-index: 1;
    display: block;
    color: currentColor;
    font-family: Arial, sans-serif;
    font-size: 1.28rem;
    line-height: 1.05;
    text-shadow: 0 0 14px currentColor;
}

.presence-stat small {
    position: relative;
    z-index: 1;
    display: block;
    margin-top: 5px;
    overflow: hidden;
    color: var(--cream-soft);
    font-family: Arial, sans-serif;
    font-size: .58rem;
    font-weight: 800;
    letter-spacing: .025em;
    line-height: 1.25;
    text-overflow: ellipsis;
}

.presence-stat--admin {
    color: #FF6767;
}

.presence-stat--visitor {
    color: #4DFF8B;
}

.presence-stat--bot {
    color: #FFAD5D;
}

.presence-stat--visitor .presence-stat__dot,
.presence-stat--bot .presence-stat__dot {
    animation-delay: .32s;
}

.presence-bot-area {
    margin-top: 14px;
    padding-top: 13px;
    border-top: 1px dashed rgba(162,210,119,.14);
}

.presence-bot-area__title {
    margin: 0 0 9px;
    color: var(--cream-dim);
    font-family: Arial, sans-serif;
    font-size: .64rem;
    font-weight: 900;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.presence-bot-list {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    min-height: 27px;
    align-items: center;
}

.presence-bot-tag {
    display: inline-flex;
    align-items: center;
    min-height: 25px;
    padding: 5px 9px;
    border: 1px solid rgba(255,173,93,.32);
    border-radius: 999px;
    color: #FFD0A4;
    background: linear-gradient(145deg, rgba(255,173,93,.13), rgba(84,42,12,.22));
    box-shadow: 0 0 14px rgba(255,173,93,.08), inset 0 1px 0 rgba(255,255,255,.045);
    font-family: Arial, sans-serif;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .035em;
    animation: presenceBotFloat 2.7s ease-in-out var(--presence-delay, 0ms) infinite;
}

.presence-bot-tag::before {
    content: "";
    width: 5px;
    height: 5px;
    margin-right: 6px;
    border-radius: 50%;
    background: #FFAD5D;
    box-shadow: 0 0 9px rgba(255,173,93,.9);
    animation: presenceDotBlink 1.65s ease-in-out infinite;
}

.presence-bot-empty {
    color: var(--cream-dim);
    font-size: .79rem;
    font-style: italic;
}

.presence-panel__note {
    margin: 11px 0 0;
    color: var(--cream-dim);
    font-size: .75rem;
}

@keyframes presenceCorePulse {
    0%, 100% { transform: scale(.86); opacity: .72; }
    50% { transform: scale(1.12); opacity: 1; }
}

@keyframes presenceRing {
    0% { transform: scale(.62); opacity: .52; }
    100% { transform: scale(1.75); opacity: 0; }
}

@keyframes presenceDotBlink {
    0%, 100% { transform: scale(.76); opacity: .68; }
    50% { transform: scale(1.22); opacity: 1; }
}

@keyframes presenceGlow {
    0%, 100% { transform: scale(.82); opacity: .07; }
    50% { transform: scale(1.18); opacity: .18; }
}

@keyframes presenceBotFloat {
    0%, 100% { transform: translateY(0); filter: brightness(.92); }
    50% { transform: translateY(-2px); filter: brightness(1.12); }
}

@keyframes presenceAmbient {
    0%, 100% { transform: scale(.88); opacity: .46; }
    50% { transform: scale(1.12); opacity: .9; }
}

@media (max-width: 430px) {
    .presence-stats {
        gap: 6px;
    }

    .presence-stat {
        padding-right: 5px;
        padding-left: 5px;
    }

    .presence-stat small {
        font-size: .53rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .presence-panel::before,
    .presence-live-orb,
    .presence-live-orb i,
    .presence-stat::after,
    .presence-stat__dot,
    .presence-bot-tag,
    .presence-bot-tag::before {
        animation: none !important;
    }
}


@keyframes juniperNeedle {
    0%, 100% { opacity: .78; transform: translateX(0) scale(1) rotate(var(--rot, 0deg)); }
    50% { opacity: 1; transform: translateX(1px) scale(1.06) rotate(calc(var(--rot, 0deg) + 2deg)); }
}

@keyframes craterRipple {
    0% { opacity: 0; transform: scale(.72); }
    20% { opacity: .85; }
    100% { opacity: 0; transform: scale(1.45); }
}

@keyframes carterainWindow {
    0%, 100% { opacity: .30; filter: brightness(.62); box-shadow: 0 0 3px rgba(249, 213, 122, .18); }
    48%, 58% { opacity: 1; filter: brightness(1.18); box-shadow: 0 0 10px rgba(249, 213, 122, .90); }
}

@keyframes carterainGlow {
    0%, 100% { opacity: .14; transform: scale(.84); }
    52% { opacity: .88; transform: scale(1.28); }
}

@keyframes wallowaWater {
    0%, 100% { opacity: .42; transform: translateX(-2px) scaleX(.90); }
    50% { opacity: .95; transform: translateX(2px) scaleX(1.08); }
}

@keyframes oregonDiamondBreathe {
    0%, 100% { filter: brightness(.92); box-shadow: inset 0 0 7px rgba(255,255,255,.20), 0 0 9px rgba(185, 232, 224, .12); }
    50% { filter: brightness(1.18); box-shadow: inset 0 0 9px rgba(255,255,255,.42), 0 0 17px rgba(215, 246, 239, .34); }
}

@keyframes oregonDiamondShine {
    0%, 34%, 100% { opacity: 0; transform: scale(.42) rotate(0deg); }
    47% { opacity: 1; transform: scale(1.05) rotate(34deg); }
    60% { opacity: 0; transform: scale(1.42) rotate(67deg); }
}

/* ================================================================
   Final atmospheric transition — Oregon rain glass and Roy's swarm
   ================================================================ */
html.page-loader-active,
html.page-loader-active body {
    overflow: hidden;
}

.page-loader {
    position: fixed;
    inset: 0;
    z-index: 2147482000;
    display: grid;
    place-items: center;
    overflow: hidden;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity .65s ease, visibility .65s ease;
    isolation: isolate;
}

.page-loader.is-active {
    animation: loaderSafetyRelease .65s ease var(--loader-safety-delay, 3000ms) forwards;
}

.page-loader.is-hidden {
    display: none;
}

.page-loader.is-complete {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}

.page-loader__glass {
    position: absolute;
    inset: 0;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 44%, rgba(231, 200, 120, .025), transparent 31%),
        linear-gradient(160deg, rgba(1, 7, 4, .52), rgba(2, 11, 6, .65));
    backdrop-filter: blur(16px) saturate(.55) brightness(.38) contrast(.82);
    -webkit-backdrop-filter: blur(16px) saturate(.55) brightness(.38) contrast(.82);
}

/* First entrance: full Juniper Rain. Internal transitions: compact matte glass without rain. */
.page-loader.is-compact .page-loader__glass {
    background:
        radial-gradient(circle at 50% 44%, rgba(231, 200, 120, .018), transparent 29%),
        linear-gradient(160deg, rgba(1, 7, 4, .74), rgba(2, 11, 6, .86));
    backdrop-filter: blur(26px) saturate(.42) brightness(.28) contrast(.72);
    -webkit-backdrop-filter: blur(26px) saturate(.42) brightness(.28) contrast(.72);
}

.page-loader.is-compact .page-loader__rain {
    opacity: 0;
    visibility: hidden;
}

.page-loader.is-compact .page-loader__glass::before {
    opacity: .18;
}

.page-loader.is-compact .page-loader__glass::after {
    opacity: .92;
    background:
        radial-gradient(circle at 50% 46%, rgba(8, 28, 16, .10), rgba(1, 7, 4, .78) 88%),
        linear-gradient(115deg, rgba(210,230,219,.018), transparent 27%, rgba(210,230,219,.008) 52%, transparent 76%);
}

.page-loader.is-compact .page-loader__mist {
    opacity: .58;
    filter: blur(42px);
    backdrop-filter: blur(11px) brightness(.60);
    -webkit-backdrop-filter: blur(11px) brightness(.60);
}

.page-loader__glass::before,
.page-loader__glass::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.page-loader__glass::before {
    opacity: .30;
    background-image:
        radial-gradient(circle at 12% 18%, rgba(255,255,255,.36) 0 1.5px, transparent 3px),
        radial-gradient(circle at 37% 67%, rgba(255,255,255,.28) 0 2px, transparent 3.6px),
        radial-gradient(circle at 63% 25%, rgba(255,255,255,.31) 0 1.8px, transparent 3.2px),
        radial-gradient(circle at 81% 76%, rgba(255,255,255,.27) 0 2.1px, transparent 3.8px);
    background-size: 74px 89px, 109px 123px, 94px 106px, 126px 138px;
    filter: blur(.3px);
}

.page-loader__glass::after {
    background:
        radial-gradient(circle at 50% 46%, rgba(8, 28, 16, .10), rgba(1, 7, 4, .72) 88%),
        linear-gradient(115deg, rgba(210,230,219,.025), transparent 27%, rgba(210,230,219,.012) 52%, transparent 76%);
    mix-blend-mode: normal;
    opacity: .88;
}

.page-loader__mist {
    position: absolute;
    inset: -12%;
    background:
        radial-gradient(ellipse at 28% 33%, rgba(192, 218, 204, .15), transparent 37%),
        radial-gradient(ellipse at 70% 63%, rgba(204, 224, 211, .11), transparent 42%);
    filter: blur(42px);
    opacity: .78;
    backdrop-filter: blur(9px) brightness(.70);
    -webkit-backdrop-filter: blur(9px) brightness(.70);
    animation: loaderMistDrift 8s ease-in-out infinite alternate;
}

.page-loader__rain {
    position: absolute;
    inset: 0;
    z-index: 2;
    overflow: hidden;
    pointer-events: none;
}

/* CSS drops hidden — Canvas rain (juniper-rain.js) draws them instead */
.page-loader__drop {
    display: none !important;
}


.page-loader__stage {
    position: absolute;
    inset: 0;
    z-index: 4;
    display: grid;
    place-items: center;
    pointer-events: none;
}




.page-loader__halo {
    position: absolute;
    width: min(58vw, 520px);
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(231,200,120,.13), rgba(116,197,110,.05) 38%, transparent 70%);
    filter: blur(7px);
    opacity: .72;
    animation: loaderHaloBreathe 3.4s ease-in-out infinite;
}

.page-loader__figure-wrap {
    position: relative;
    width: clamp(220px, 22vw, 300px);
    aspect-ratio: 740 / 600;
    transform: translateY(.8vh);
    filter: drop-shadow(0 25px 26px rgba(0,0,0,.52));
}

.page-loader__figure {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    object-position: center;
    opacity: 0;
    transform: scale(.97) translateY(8px);
    filter: contrast(1.05) saturate(.98) brightness(.92);
    will-change: opacity, transform, filter, clip-path;
}

.page-loader.is-full.is-playing .page-loader__figure {
    animation: loaderRoyDissolve 2.72s cubic-bezier(.24,.7,.18,1) both;
}

.page-loader.is-compact.is-playing .page-loader__figure {
    animation: loaderRoyDissolve 1.86s cubic-bezier(.24,.7,.18,1) both;
}

.page-loader__swarm {
    position: absolute;
    inset: 0;
    overflow: visible;
}

.page-loader__bee {
    position: absolute;
    top: var(--bee-start-y);
    left: var(--bee-start-x);
    width: calc(var(--bee-size) * 1.75);
    height: var(--bee-size);
    border-radius: 55% 45% 52% 48%;
    background:
        linear-gradient(90deg,
            #17130b 0 20%,
            #d9a93d 20% 42%,
            #17130b 42% 61%,
            #e3ba52 61% 80%,
            #17130b 80% 100%);
    box-shadow: 0 0 5px rgba(231,200,120,.52);
    opacity: 0;
    transform: translate(-50%, -50%) scale(.2) rotate(0deg);
    transform-origin: center;
    will-change: transform, opacity;
}

.page-loader__bee::before,
.page-loader__bee::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 68%;
    height: 86%;
    border: 1px solid rgba(240,247,236,.56);
    border-radius: 70% 30% 70% 30%;
    background: rgba(240,247,236,.16);
    filter: blur(.2px);
}

.page-loader__bee::before {
    right: 57%;
    transform: translateY(-88%) rotate(-27deg);
}

.page-loader__bee::after {
    left: 57%;
    transform: translateY(-88%) scaleX(-1) rotate(-27deg);
}

.page-loader.is-full.is-playing .page-loader__bee {
    animation: loaderBeeFlight var(--bee-duration-full) cubic-bezier(.18,.7,.14,1) var(--bee-delay-full) both;
}

.page-loader.is-compact.is-playing .page-loader__bee {
    animation: loaderBeeFlight var(--bee-duration-compact) cubic-bezier(.18,.7,.14,1) var(--bee-delay-compact) both;
}

.page-loader__ground-glow {
    position: absolute;
    left: 50%;
    top: calc(50% + min(17vh, 145px));
    width: clamp(170px, 25vw, 290px);
    height: 34px;
    border-radius: 50%;
    background: radial-gradient(ellipse, rgba(231,200,120,.22), rgba(116,197,110,.06) 46%, transparent 72%);
    filter: blur(10px);
    transform: translateX(-50%);
    opacity: 0;
}

.page-loader.is-full.is-playing .page-loader__ground-glow {
    animation: loaderGroundGlow 2.65s ease both;
}

.page-loader.is-compact.is-playing .page-loader__ground-glow {
    animation: loaderGroundGlow 1.82s ease both;
}

@keyframes loaderMistDrift {
    from { transform: translate3d(-2%, -1%, 0) scale(1); }
    to { transform: translate3d(3%, 2%, 0) scale(1.06); }
}


@keyframes loaderHaloBreathe {
    0%, 100% { transform: scale(.9); opacity: .38; }
    50% { transform: scale(1.08); opacity: .78; }
}

@keyframes loaderRoyDissolve {
    0% {
        opacity: 0;
        transform: scale(.965) translateY(12px);
        filter: contrast(1.03) saturate(.9) brightness(.72) blur(1px);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    }
    14%, 46% {
        opacity: 1;
        transform: scale(1) translateY(0);
        filter: contrast(1.08) saturate(1.03) brightness(.93) blur(0);
        clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    }
    56% {
        opacity: .98;
        transform: scale(1.012) translateY(-2px);
        filter: contrast(1.18) saturate(1.08) brightness(1.02) blur(.2px);
        clip-path: polygon(0 0, 100% 0, 98% 94%, 83% 89%, 71% 96%, 58% 88%, 47% 96%, 34% 87%, 18% 95%, 0 86%);
    }
    74% {
        opacity: .42;
        transform: scale(1.025) translateY(-8px);
        filter: contrast(1.45) saturate(.72) brightness(1.18) blur(1.8px);
        clip-path: polygon(7% 0, 93% 0, 89% 45%, 76% 52%, 67% 42%, 55% 54%, 42% 41%, 31% 53%, 17% 43%, 10% 31%);
    }
    88%, 100% {
        opacity: 0;
        transform: scale(1.075) translateY(-14px);
        filter: contrast(1.7) saturate(.4) brightness(1.34) blur(5px);
        clip-path: polygon(28% 0, 72% 0, 67% 14%, 58% 21%, 48% 12%, 38% 22%, 31% 12%, 24% 8%);
    }
}

@keyframes loaderBeeFlight {
    0% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(.1) rotate(0deg);
    }
    8% {
        opacity: .96;
        transform: translate(-50%, -50%) scale(1) rotate(25deg);
    }
    38% {
        opacity: 1;
        transform:
            translate(calc(-50% + var(--bee-curve-x)), calc(-50% + var(--bee-curve-y)))
            scale(1.12)
            rotate(var(--bee-mid-spin));
    }
    100% {
        opacity: 0;
        transform:
            translate(calc(-50% + var(--bee-end-x)), calc(-50% + var(--bee-end-y)))
            scale(.72)
            rotate(var(--bee-spin));
    }
}

@keyframes loaderGroundGlow {
    0%, 10% { opacity: 0; transform: translateX(-50%) scaleX(.72); }
    28%, 52% { opacity: .78; transform: translateX(-50%) scaleX(1); }
    85%, 100% { opacity: 0; transform: translateX(-50%) scaleX(1.35); }
}

@keyframes loaderSafetyRelease {
    0%, 99% { opacity: 1; visibility: visible; pointer-events: auto; }
    100% { opacity: 0; visibility: hidden; pointer-events: none; }
}

@media (max-width: 700px) {
    .page-loader__glass {
        backdrop-filter: blur(12px) saturate(.52) brightness(.35) contrast(.80);
        -webkit-backdrop-filter: blur(12px) saturate(.52) brightness(.35) contrast(.80);
    }

    .page-loader__figure-wrap {
        width: clamp(210px, 70vw, 290px);
        transform: translateY(.3vh);
    }

    .page-loader__halo {
        width: 88vw;
    }
}

@media (prefers-reduced-motion: reduce) {
    .page-loader__drop,
    .page-loader__mist,
    .page-loader__halo {
        animation-duration: 8s !important;
    }
}

/* ================================================================
   Restored animated navigation buttons for diary entries
   ================================================================ */
.article-return-nav {
    width: min(100%, 960px);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0 auto 16px;
}

.article-return-nav--bottom {
    margin-top: 18px;
    margin-bottom: 0;
}

.article-return-button {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 48px;
    padding: 11px 18px;
    border: 1px solid rgba(231, 200, 120, .46);
    border-radius: 999px;
    color: var(--cream);
    background:
        linear-gradient(145deg, rgba(72, 118, 65, .42), rgba(9, 27, 15, .91));
    box-shadow:
        0 13px 28px rgba(0, 0, 0, .30),
        inset 0 1px 0 rgba(255, 255, 255, .08);
    font-family: Arial, sans-serif;
    font-size: .79rem;
    font-weight: 900;
    letter-spacing: .055em;
    text-decoration: none;
    animation: articleReturnIdle 3.7s ease-in-out infinite;
    transition:
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease,
        color .18s ease;
}

.article-return-button:nth-child(2) {
    animation-delay: -1.75s;
}

.article-return-button::before {
    content: "";
    position: absolute;
    inset: -70% auto -70% -34%;
    z-index: -1;
    width: 25%;
    transform: rotate(17deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .32), transparent);
    animation: articleReturnSheen 5.8s ease-in-out infinite;
}

.article-return-button:hover {
    color: var(--gold-bright);
    border-color: rgba(255, 240, 185, .78);
    background:
        linear-gradient(145deg, rgba(86, 142, 76, .55), rgba(10, 35, 18, .96));
    box-shadow:
        0 18px 38px rgba(0, 0, 0, .39),
        0 0 25px rgba(231, 200, 120, .13),
        inset 0 1px 0 rgba(255, 255, 255, .12);
    animation: articleReturnHover .54s ease-in-out infinite;
}

.article-return-button:active {
    animation: none;
    transform: translateY(5px) scale(.965);
    box-shadow:
        0 5px 12px rgba(0, 0, 0, .34),
        inset 0 5px 11px rgba(0, 0, 0, .28);
}

.article-return-button__icon {
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    border: 1px solid rgba(231, 200, 120, .25);
    border-radius: 50%;
    color: var(--gold-bright);
    background: rgba(8, 22, 12, .45);
    font-size: 1rem;
    line-height: 1;
}

@keyframes articleReturnIdle {
    0%, 100% { transform: translateY(0); }
    45% { transform: translateY(-2px); }
    58% { transform: translateY(1px); }
}

@keyframes articleReturnHover {
    0%, 100% { transform: translateY(-2px) rotate(-.35deg); }
    50% { transform: translateY(-6px) rotate(.35deg); }
}

@keyframes articleReturnSheen {
    0%, 70% { left: -34%; opacity: 0; }
    77% { opacity: .66; }
    91%, 100% { left: 130%; opacity: 0; }
}

@media (max-width: 560px) {
    .article-return-nav {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 9px;
    }

    .article-return-button {
        width: 100%;
        min-height: 46px;
        padding: 10px 11px;
        gap: 7px;
        font-size: .69rem;
        letter-spacing: .025em;
    }

    .article-return-button__icon {
        width: 21px;
        height: 21px;
        font-size: .9rem;
    }
}

/* ================================================================
   Native per-entry Like button
   ================================================================ */
.livinginbend-like {
    width: min(100%, 780px);
    display: flex;
    justify-content: center;
    margin: 2.45rem auto .35rem;
}

.livinginbend-like__button {
    position: relative;
    isolation: isolate;
    overflow: hidden;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 158px;
    min-height: 50px;
    padding: 10px 13px 10px 15px;
    border: 1px solid rgba(231, 200, 120, .43);
    border-radius: 999px;
    color: var(--cream);
    background:
        linear-gradient(145deg, rgba(64, 105, 59, .42), rgba(8, 25, 14, .94));
    box-shadow:
        0 13px 30px rgba(0, 0, 0, .31),
        inset 0 1px 0 rgba(255, 255, 255, .08);
    font: 900 .82rem/1 Arial, sans-serif;
    letter-spacing: .025em;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition:
        transform .18s ease,
        border-color .18s ease,
        background .18s ease,
        box-shadow .18s ease,
        color .18s ease,
        opacity .18s ease;
}

.livinginbend-like__button::before {
    content: "";
    position: absolute;
    inset: -90% auto -90% -42%;
    z-index: -1;
    width: 30%;
    transform: rotate(18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .28), transparent);
    opacity: 0;
}

.livinginbend-like__button:hover {
    color: var(--gold-bright);
    border-color: rgba(255, 239, 180, .76);
    background:
        linear-gradient(145deg, rgba(79, 132, 70, .56), rgba(9, 34, 17, .97));
    box-shadow:
        0 18px 38px rgba(0, 0, 0, .39),
        0 0 24px rgba(231, 200, 120, .12),
        inset 0 1px 0 rgba(255, 255, 255, .12);
    transform: translateY(-3px);
}

.livinginbend-like__button:hover::before {
    animation: livinginbendLikeSheen .72s ease both;
}

.livinginbend-like__button:active {
    transform: translateY(3px) scale(.97);
    box-shadow:
        0 5px 13px rgba(0, 0, 0, .36),
        inset 0 5px 11px rgba(0, 0, 0, .28);
}

.livinginbend-like__button:focus-visible {
    outline: 3px solid rgba(231, 200, 120, .34);
    outline-offset: 4px;
}

.livinginbend-like__icon {
    display: grid;
    place-items: center;
    width: 27px;
    height: 27px;
    color: var(--gold-bright);
    transform-origin: 55% 85%;
    transition: transform .22s ease, color .22s ease, filter .22s ease;
}

.livinginbend-like__icon svg {
    width: 100%;
    height: 100%;
    overflow: visible;
    fill: rgba(231, 200, 120, .08);
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.livinginbend-like__button:hover .livinginbend-like__icon {
    transform: translateY(-3px) rotate(-8deg) scale(1.07);
}

.livinginbend-like__label {
    white-space: nowrap;
}

.livinginbend-like__count {
    display: inline-grid;
    place-items: center;
    min-width: 28px;
    height: 28px;
    padding: 0 7px;
    border: 1px solid rgba(231, 200, 120, .25);
    border-radius: 999px;
    color: var(--gold-bright);
    background: rgba(3, 14, 8, .52);
    font-size: .76rem;
    font-variant-numeric: tabular-nums;
    box-shadow: inset 0 1px 5px rgba(0, 0, 0, .24);
}

.livinginbend-like__button.is-liked {
    color: #f4f0dc;
    border-color: rgba(150, 218, 123, .66);
    background:
        linear-gradient(145deg, rgba(75, 139, 67, .69), rgba(7, 31, 15, .98));
    box-shadow:
        0 14px 34px rgba(0, 0, 0, .34),
        0 0 23px rgba(116, 197, 110, .16),
        inset 0 1px 0 rgba(255, 255, 255, .12);
    cursor: pointer;
}

.livinginbend-like__button.is-liked .livinginbend-like__icon {
    color: #b9ed9d;
    filter: drop-shadow(0 0 7px rgba(116, 197, 110, .48));
}

.livinginbend-like__button.is-liked .livinginbend-like__icon svg {
    fill: rgba(116, 197, 110, .22);
}

.livinginbend-like__button.is-liked:hover {
    transform: translateY(-3px);
}

.livinginbend-like__button.is-busy {
    opacity: .68;
    cursor: progress;
    pointer-events: none;
}

.livinginbend-like__button.is-busy .livinginbend-like__icon {
    animation: livinginbendLikeWaiting .72s ease-in-out infinite;
}

.livinginbend-like__button.is-celebrating .livinginbend-like__icon {
    animation: livinginbendLikeApproved .68s cubic-bezier(.2, .85, .28, 1.35) both;
}

.livinginbend-like__button.is-celebrating .livinginbend-like__count {
    animation: livinginbendLikeCount .58s ease both;
}

.livinginbend-like__button.is-unliking .livinginbend-like__icon {
    animation: livinginbendUnlikeReleased .62s cubic-bezier(.35, .05, .3, 1) both;
}

.livinginbend-like__button.is-unliking .livinginbend-like__count {
    animation: livinginbendUnlikeCount .52s ease both;
}

.livinginbend-like__button.is-error {
    animation: livinginbendLikeError .42s ease both;
}

@keyframes livinginbendLikeSheen {
    0% { left: -42%; opacity: 0; }
    18% { opacity: .72; }
    100% { left: 132%; opacity: 0; }
}

@keyframes livinginbendLikeWaiting {
    0%, 100% { transform: translateY(0) rotate(-4deg); }
    50% { transform: translateY(-3px) rotate(5deg); }
}

@keyframes livinginbendLikeApproved {
    0% { transform: translateY(0) rotate(0) scale(1); }
    38% { transform: translateY(-9px) rotate(-12deg) scale(1.2); }
    68% { transform: translateY(1px) rotate(4deg) scale(.95); }
    100% { transform: translateY(0) rotate(0) scale(1); }
}

@keyframes livinginbendLikeCount {
    0% { transform: scale(1); }
    45% { transform: scale(1.28); box-shadow: 0 0 16px rgba(116, 197, 110, .34); }
    100% { transform: scale(1); }
}

@keyframes livinginbendUnlikeReleased {
    0% { transform: translateY(0) rotate(0) scale(1); }
    42% { transform: translateY(5px) rotate(8deg) scale(.9); opacity: .62; }
    100% { transform: translateY(0) rotate(0) scale(1); opacity: 1; }
}

@keyframes livinginbendUnlikeCount {
    0% { transform: scale(1); }
    45% { transform: scale(.8); opacity: .58; }
    100% { transform: scale(1); opacity: 1; }
}

@keyframes livinginbendLikeError {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    50% { transform: translateX(5px); }
    75% { transform: translateX(-3px); }
}

@media (max-width: 560px) {
    .livinginbend-like {
        margin-top: 2rem;
    }

    .livinginbend-like__button {
        min-width: 150px;
        min-height: 48px;
        padding: 9px 12px 9px 14px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .livinginbend-like__button,
    .livinginbend-like__icon,
    .livinginbend-like__count {
        animation: none !important;
        transition-duration: .01ms !important;
    }
}

/* Living in Bend — bilingual now-playing speech bubble (v4.0.21) */
.music-now-playing {
    --now-playing-width: 330px;
    --now-playing-left: 18px;
    --now-playing-top: 96px;
    --now-playing-arrow-x: 292px;
    --now-playing-origin-x: 292px;
    position: fixed;
    z-index: 101;
    top: var(--now-playing-top);
    left: var(--now-playing-left);
    width: var(--now-playing-width);
    max-width: calc(100vw - 22px);
    min-height: 112px;
    padding: 18px 20px 16px;
    overflow: visible;
    border: 1px solid rgba(200, 226, 174, .28);
    border-radius: 21px 21px 21px 10px;
    background:
        radial-gradient(circle at 24% 0%, rgba(255, 246, 206, .10), transparent 40%),
        linear-gradient(145deg, rgba(16, 45, 25, .94), rgba(6, 19, 11, .97));
    box-shadow:
        0 22px 56px rgba(0, 0, 0, .55),
        inset 0 1px 0 rgba(255, 255, 255, .08),
        0 0 32px rgba(123, 171, 92, .10);
    color: var(--cream-soft);
    backdrop-filter: blur(18px) saturate(1.18);
    -webkit-backdrop-filter: blur(18px) saturate(1.18);
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-17px) scale(.20) rotate(-3deg);
    transform-origin: var(--now-playing-origin-x) -12px;
    will-change: transform, opacity, filter;
}

.music-now-playing::before {
    content: '';
    position: absolute;
    top: -12px;
    left: calc(var(--now-playing-arrow-x) - 12px);
    width: 24px;
    height: 24px;
    border-top: 1px solid rgba(200, 226, 174, .28);
    border-left: 1px solid rgba(200, 226, 174, .28);
    background: rgba(13, 37, 21, .97);
    transform: rotate(45deg);
    border-radius: 5px 0 0;
}

.music-now-playing::after {
    content: '♫';
    position: absolute;
    top: 16px;
    right: 17px;
    color: rgba(232, 202, 124, .26);
    font-size: 35px;
    line-height: 1;
    text-shadow: 0 3px 13px rgba(0, 0, 0, .38);
    transform: rotate(8deg);
}

.music-now-playing.is-visible {
    visibility: visible;
    animation: nowPlayingBubbleIn .58s cubic-bezier(.18, .88, .22, 1.24) forwards;
}

.music-now-playing.is-hiding {
    visibility: visible;
    animation: nowPlayingBubbleOut .54s cubic-bezier(.58, -.05, .78, .24) forwards;
}

.music-now-playing__shine {
    position: absolute;
    inset: 1px;
    overflow: hidden;
    border-radius: inherit;
}

.music-now-playing__shine::after {
    content: '';
    position: absolute;
    top: -70%;
    left: -38%;
    width: 36%;
    height: 230%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.13), transparent);
    transform: rotate(17deg);
    animation: nowPlayingShine 1.8s ease-out .35s both;
}

.music-now-playing__eyebrow,
.music-now-playing__track,
.music-now-playing__duration {
    position: relative;
    z-index: 1;
    display: block;
    padding-right: 37px;
}

.music-now-playing__eyebrow {
    margin-bottom: 7px;
    color: var(--gold-bright);
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.65px;
    line-height: 1.2;
    text-transform: uppercase;
}

.music-now-playing__track {
    color: #FFF7D9;
    font-size: clamp(.98rem, 2vw, 1.12rem);
    font-weight: 700;
    line-height: 1.34;
    text-wrap: balance;
    text-shadow: 0 3px 12px rgba(0, 0, 0, .58);
}

.music-now-playing__duration {
    margin-top: 10px;
    color: rgba(232, 238, 218, .72);
    font-family: Arial, sans-serif;
    font-size: 11px;
    letter-spacing: .25px;
}

.music-now-playing__duration b {
    color: rgba(255, 239, 189, .92);
    font-weight: 700;
}

@keyframes nowPlayingBubbleIn {
    0% {
        opacity: 0;
        filter: blur(7px);
        transform: translateY(-17px) scale(.20) rotate(-3deg);
    }
    54% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(4px) scale(1.035) rotate(.5deg);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1) rotate(0);
    }
}

@keyframes nowPlayingBubbleOut {
    0% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1) rotate(0);
    }
    36% {
        opacity: .86;
        transform: translateY(-2px) scale(.96) rotate(-.5deg);
    }
    100% {
        opacity: 0;
        filter: blur(6px);
        transform: translateY(-23px) scale(.08) rotate(7deg);
    }
}

@keyframes nowPlayingShine {
    0% {
        opacity: 0;
        transform: translateX(-40px) rotate(17deg);
    }
    35% {
        opacity: .75;
    }
    100% {
        opacity: 0;
        transform: translateX(430px) rotate(17deg);
    }
}

@media (max-width: 720px) {
    .music-now-playing {
        min-height: 104px;
        padding: 16px 17px 14px;
        border-radius: 18px 18px 18px 9px;
    }

    .music-now-playing__track {
        font-size: .96rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .music-now-playing.is-visible,
    .music-now-playing.is-hiding,
    .music-now-playing__shine::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* Living in Bend — bilingual language-switch hint and safe music resume (v4.0.22) */
.language-switch-hint {
    --language-hint-width: 270px;
    --language-hint-left: 18px;
    --language-hint-top: 74px;
    --language-hint-arrow-x: 53px;
    --language-hint-origin-x: 53px;
    position: fixed;
    z-index: 102;
    top: var(--language-hint-top);
    left: var(--language-hint-left);
    width: var(--language-hint-width);
    max-width: calc(100vw - 22px);
    min-height: 58px;
    padding: 15px 18px;
    border: 1px solid rgba(200, 226, 174, .28);
    border-radius: 17px 17px 17px 9px;
    background:
        radial-gradient(circle at 18% 0%, rgba(255, 246, 206, .10), transparent 44%),
        linear-gradient(145deg, rgba(16, 45, 25, .95), rgba(6, 19, 11, .98));
    box-shadow:
        0 19px 46px rgba(0, 0, 0, .52),
        inset 0 1px 0 rgba(255, 255, 255, .08),
        0 0 28px rgba(123, 171, 92, .10);
    color: #FFF7D9;
    backdrop-filter: blur(18px) saturate(1.18);
    -webkit-backdrop-filter: blur(18px) saturate(1.18);
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transform: translateY(-14px) scale(.18) rotate(2deg);
    transform-origin: var(--language-hint-origin-x) -10px;
    will-change: transform, opacity, filter;
}

.language-switch-hint::before {
    content: '';
    position: absolute;
    top: -10px;
    left: calc(var(--language-hint-arrow-x) - 10px);
    width: 20px;
    height: 20px;
    border-top: 1px solid rgba(200, 226, 174, .28);
    border-left: 1px solid rgba(200, 226, 174, .28);
    border-radius: 4px 0 0;
    background: rgba(13, 37, 21, .98);
    transform: rotate(45deg);
}

.language-switch-hint::after {
    content: 'RU · EN';
    position: absolute;
    right: 14px;
    bottom: 8px;
    color: rgba(232, 202, 124, .30);
    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.2px;
}

.language-switch-hint__shine {
    position: absolute;
    inset: 1px;
    overflow: hidden;
    border-radius: inherit;
}

.language-switch-hint__shine::after {
    content: '';
    position: absolute;
    top: -80%;
    left: -42%;
    width: 34%;
    height: 260%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.13), transparent);
    transform: rotate(17deg);
    animation: languageHintShine 1.55s ease-out .28s both;
}

.language-switch-hint__text {
    position: relative;
    z-index: 1;
    display: block;
    padding-right: 46px;
    font-size: .94rem;
    font-weight: 700;
    line-height: 1.34;
    text-shadow: 0 3px 12px rgba(0, 0, 0, .58);
    text-wrap: balance;
}

.language-switch-hint.is-visible {
    visibility: visible;
    animation: languageHintIn .52s cubic-bezier(.18, .88, .22, 1.24) forwards;
}

.language-switch-hint.is-hiding {
    visibility: visible;
    animation: languageHintOut .48s cubic-bezier(.58, -.05, .78, .24) forwards;
}

@keyframes languageHintIn {
    0% {
        opacity: 0;
        filter: blur(7px);
        transform: translateY(-14px) scale(.18) rotate(2deg);
    }
    56% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(3px) scale(1.03) rotate(-.35deg);
    }
    100% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1) rotate(0);
    }
}

@keyframes languageHintOut {
    0% {
        opacity: 1;
        filter: blur(0);
        transform: translateY(0) scale(1) rotate(0);
    }
    40% {
        opacity: .84;
        transform: translateY(-2px) scale(.95) rotate(.35deg);
    }
    100% {
        opacity: 0;
        filter: blur(6px);
        transform: translateY(-19px) scale(.07) rotate(-6deg);
    }
}

@keyframes languageHintShine {
    0% {
        opacity: 0;
        transform: translateX(-35px) rotate(17deg);
    }
    35% {
        opacity: .72;
    }
    100% {
        opacity: 0;
        transform: translateX(350px) rotate(17deg);
    }
}

@media (max-width: 720px) {
    .language-switch-hint {
        min-height: 54px;
        padding: 14px 16px;
        border-radius: 16px 16px 16px 8px;
    }

    .language-switch-hint__text {
        padding-right: 42px;
        font-size: .90rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .language-switch-hint.is-visible,
    .language-switch-hint.is-hiding,
    .language-switch-hint__shine::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
    }
}



@media (prefers-reduced-motion: reduce) {
    .carterain-window,
    .carterain-glow,
    .greenlake-wave,
    .greenlake-trail::before,
    .wallowa-symbol i,
    .oregonbeauty-diamond,
    .oregonbeauty-shine,
    .eesah-symbol,
    .eesah-symbol::before,
    .eesah-symbol::after,
    .eesah-symbol i,
    .dallas-symbol,
    .dallas-breeze,
    .twopac-symbol,
    .twopac-symbol i,
    .bobmarley-symbol b,
    .bobmarley-symbol i,
    .paintedhills-symbol,
    .paintedhills-symbol::after,
    .canada-symbol svg,
    .canada-breeze {
        animation: none !important;
    }
}


/* 2PAC */
.site-tile--2pac,
.site-tile--bobmarley,
.site-tile--paintedhills,
.site-tile--canada {
    min-height: 82px;
    padding-left: 74px;
}

.site-tile--2pac {
    background:
        radial-gradient(circle at 15% 50%, rgba(210, 192, 119, .16), transparent 38%),
        linear-gradient(145deg, rgba(54, 62, 48, .58), rgba(12, 25, 17, .80));
    border-color: rgba(208, 188, 112, .20);
}

.twopac-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 1px solid rgba(214, 197, 124, .30);
    border-radius: 50%;
    color: rgba(247, 236, 191, .94);
    background:
        radial-gradient(circle at 34% 28%, rgba(255,255,255,.16), transparent 30%),
        linear-gradient(180deg, rgba(53, 75, 46, .95), rgba(17, 38, 23, .96));
    box-shadow: 0 0 18px rgba(188, 170, 92, .14);
    animation: twopacBadgeFloat 4.2s ease-in-out infinite;
}

.twopac-symbol b {
    position: absolute;
    left: 50%;
    top: 13px;
    z-index: 2;
    transform: translateX(-50%);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .08em;
    color: #F6EFC7;
    text-shadow: 0 1px 5px rgba(0,0,0,.48);
}

.twopac-symbol i {
    position: absolute;
    font-style: normal;
    font-size: 11px;
    color: rgba(248, 239, 195, .92);
    text-shadow: 0 0 8px rgba(249, 230, 148, .24);
    animation: twopacNoteDrift 3.2s ease-in-out infinite;
}

.twopac-symbol i:nth-of-type(1) { left: 7px; top: 24px; }
.twopac-symbol i:nth-of-type(2) { right: 8px; top: 18px; animation-delay: -.9s; }
.twopac-symbol i:nth-of-type(3) { left: 18px; bottom: 4px; animation-delay: -1.8s; }

.site-tile--2pac:hover .twopac-symbol {
    animation-duration: 2.4s;
}

.site-tile--2pac:hover .twopac-symbol i {
    animation-duration: 2.1s;
}

/* Bob Marley */
.site-tile--bobmarley {
    background:
        radial-gradient(circle at 15% 50%, rgba(162, 205, 106, .16), transparent 38%),
        linear-gradient(145deg, rgba(51, 72, 40, .58), rgba(12, 25, 17, .80));
    border-color: rgba(152, 196, 95, .18);
}

.bobmarley-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    border-radius: 50%;
    overflow: hidden;
    background: rgba(10, 28, 18, .82);
    box-shadow: 0 0 18px rgba(126, 197, 98, .12);
}

.bobmarley-symbol b,
.bobmarley-symbol b::before,
.bobmarley-symbol b::after {
    content: "";
    position: absolute;
    border-radius: 50%;
}

.bobmarley-symbol b {
    inset: 5px;
    border: 1.5px solid rgba(40, 40, 40, .96);
    background:
        conic-gradient(from 210deg,
            #161616 0 48%,
            #d4b04d 48% 61%,
            #296d42 61% 76%,
            #d9c95f 76% 86%,
            #8d2d23 86% 100%);
    box-shadow: inset 0 0 0 5px rgba(0,0,0,.20);
    animation: bobmarleySpin 4.2s linear infinite;
}

.bobmarley-symbol b::before {
    inset: 6px;
    background: rgba(11, 16, 12, .82);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}

.bobmarley-symbol b::after {
    left: 50%;
    top: 50%;
    width: 6px;
    height: 6px;
    transform: translate(-50%, -50%);
    background: rgba(233, 224, 176, .95);
}

.bobmarley-symbol i {
    position: absolute;
    z-index: 3;
    font-style: normal;
    font-size: 11px;
    color: rgba(244, 238, 193, .94);
    text-shadow: 0 0 8px rgba(249, 230, 148, .20);
    animation: bobmarleyNoteFloat 3.5s ease-in-out infinite;
}

.bobmarley-symbol i:nth-of-type(1) { right: 2px; top: 7px; }
.bobmarley-symbol i:nth-of-type(2) { left: 4px; bottom: 6px; animation-delay: -1.15s; }
.bobmarley-symbol i:nth-of-type(3) { right: 11px; bottom: 2px; animation-delay: -2.2s; }

.site-tile--bobmarley:hover .bobmarley-symbol b {
    animation-duration: 2.3s;
}

/* Painted Hills */
.site-tile--paintedhills {
    background:
        radial-gradient(circle at 15% 50%, rgba(219, 173, 98, .18), transparent 39%),
        linear-gradient(145deg, rgba(63, 84, 49, .58), rgba(12, 25, 17, .80));
    border-color: rgba(215, 171, 98, .20);
}

.paintedhills-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 1px solid rgba(224, 193, 136, .34);
    border-radius: 50%;
    background:
        radial-gradient(circle at 34% 28%, rgba(255,255,255,.23), transparent 32%),
        linear-gradient(180deg, rgba(67, 93, 59, .92), rgba(25, 50, 30, .96));
    box-shadow: 0 0 18px rgba(214, 166, 100, .14);
    animation: paintedhillsGlow 4.6s ease-in-out infinite;
}

.paintedhills-band {
    position: absolute;
    left: -4px;
    width: 56px;
    height: 12px;
    border-radius: 50%;
    transform: rotate(-11deg);
    opacity: .95;
}

.paintedhills-band--one { top: 8px; background: linear-gradient(90deg, rgba(213, 111, 73, .96), rgba(237, 179, 99, .92)); }
.paintedhills-band--two { top: 16px; background: linear-gradient(90deg, rgba(192, 171, 88, .95), rgba(146, 109, 58, .90)); }
.paintedhills-band--three { top: 24px; background: linear-gradient(90deg, rgba(119, 154, 84, .92), rgba(88, 116, 59, .94)); }
.paintedhills-band--four { top: 32px; background: linear-gradient(90deg, rgba(201, 123, 98, .90), rgba(116, 142, 177, .88)); }

.paintedhills-symbol::after {
    content: "";
    position: absolute;
    inset: -20% auto -25% -35%;
    width: 38%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.30), transparent);
    transform: rotate(18deg);
    animation: paintedhillsShine 3.9s ease-in-out infinite;
}

/* Canada */
.site-tile--canada {
    background:
        radial-gradient(circle at 15% 50%, rgba(187, 223, 229, .15), transparent 38%),
        linear-gradient(145deg, rgba(33, 73, 62, .58), rgba(12, 25, 17, .80));
    border-color: rgba(182, 219, 213, .20);
}

.canada-symbol {
    position: absolute;
    left: 17px;
    top: 50%;
    z-index: 2;
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    transform: translateY(-50%);
    overflow: hidden;
    border: 1px solid rgba(206, 232, 226, .28);
    border-radius: 50%;
    color: rgba(236, 246, 243, .95);
    background:
        radial-gradient(circle at 40% 30%, rgba(255,255,255,.16), transparent 34%),
        linear-gradient(180deg, rgba(38, 78, 65, .96), rgba(10, 35, 25, .96));
    box-shadow: 0 0 18px rgba(154, 214, 201, .12);
}

.canada-symbol svg {
    position: relative;
    z-index: 2;
    width: 23px;
    height: 23px;
    color: #DCEDE4;
    filter: drop-shadow(0 1px 4px rgba(0,0,0,.32));
    animation: canadaLeafSway 3.8s ease-in-out infinite;
    transform-origin: 50% 70%;
}

.canada-breeze {
    position: absolute;
    right: 4px;
    z-index: 1;
    display: block;
    height: 2px;
    border-radius: 999px;
    background: linear-gradient(90deg, rgba(230,245,241,0), rgba(230,245,241,.92));
    box-shadow: 0 0 7px rgba(204, 238, 230, .12);
    animation: canadaBreeze 2.6s ease-in-out infinite;
}

.canada-breeze--one { top: 19px; width: 14px; }
.canada-breeze--two { top: 27px; width: 11px; animation-delay: -1.1s; opacity: .74; }

@keyframes twopacBadgeFloat {
    0%, 100% { transform: translateY(-50%) scale(1); }
    50% { transform: translateY(calc(-50% - 1px)) scale(1.03); }
}

@keyframes twopacNoteDrift {
    0%, 100% { transform: translateY(0) scale(1); opacity: .72; }
    50% { transform: translateY(-4px) scale(1.08); opacity: 1; }
}

@keyframes bobmarleySpin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes bobmarleyNoteFloat {
    0%, 100% { transform: translateY(0) scale(1); opacity: .7; }
    50% { transform: translateY(-4px) scale(1.07); opacity: 1; }
}

@keyframes paintedhillsGlow {
    0%, 100% { transform: translateY(-50%) scale(1); box-shadow: 0 0 18px rgba(214, 166, 100, .14); }
    50% { transform: translateY(-50%) scale(1.03); box-shadow: 0 0 24px rgba(231, 193, 124, .22); }
}

@keyframes paintedhillsShine {
    0% { opacity: 0; transform: translateX(-16px) rotate(18deg); }
    30% { opacity: .68; }
    100% { opacity: 0; transform: translateX(52px) rotate(18deg); }
}

@keyframes canadaLeafSway {
    0%, 100% { transform: rotate(-4deg) translateY(0); }
    50% { transform: rotate(5deg) translateY(-1px); }
}

@keyframes canadaBreeze {
    0%, 100% { transform: translateX(0); opacity: .42; }
    50% { transform: translateX(3px); opacity: .96; }
}