.site-header {
    max-width:1160px;
    margin:auto;
    min-height:100px;
    padding:20px 28px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
    border-bottom:1px solid var(--line)
}
.brand {
    display:flex;
    align-items:center;
    gap:8px;
    font-weight:800;
    letter-spacing:-1.3px;
    font-size:28px;
    line-height:1
}
.brand-light {
    font-weight:400
}
.brand small {
    display:block;
    font-size:7px;
    font-weight:650;
    letter-spacing:1.8px;
    margin-top:7px;
    color:var(--muted)
}
.site-header nav {
    display:flex;
    align-items:center;
    gap:22px;
    margin-left:auto;
    margin-right:auto;
    font-size:12px;
    font-weight:600
}
.site-header nav a {
    position:relative;
    padding:12px 0
}
.site-header nav a[aria-current=page] {
    color:var(--green)
}
.site-header nav a[aria-current=page]::after {
    content:'';
    position:absolute;
    bottom:3px;
    left:50%;
    width:22px;
    height:2px;
    background:var(--green);
    border-radius:999px;
    transform:translateX(-50%)
}
.breadcrumbs {
    width:min(1110px,calc(100% - 32px));
    margin:18px auto 0;
    font-size:11px;
    color:var(--muted)
}
.breadcrumbs ol {
    display:flex;
    align-items:center;
    gap:0;
    margin:0;
    padding:0;
    list-style:none;
    white-space:nowrap;
    overflow-x:auto;
    scrollbar-width:none
}
.breadcrumbs ol::-webkit-scrollbar {
    display:none
}
.breadcrumbs li {
    display:flex;
    align-items:center
}
.breadcrumbs li+li::before {
    content:'›';
    margin:0 8px;
    color:#9aa28f
}
.breadcrumbs a {
    color:inherit;
    text-decoration:none
}
.breadcrumbs a:hover {
    color:var(--green)
}
.breadcrumbs [aria-current=page] {
    color:var(--ink);
    font-weight:650
}
.header-actions {
    display:flex;
    align-items:center;
    gap:10px
}
.player-button {
    display:flex;
    align-items:center;
    gap:8px;
    background:#ebeede;
    border:1px solid #d9dfcc;
    padding:7px 13px;
    border-radius:24px;
    font-size:11px;
    font-weight:600;
    min-height:42px
}
.player-button span {
    max-width:165px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap
}
.game-intro {
    text-align:center;
    padding:34px 16px 28px
}
.season-label {
    font-size:8px;
    font-weight:750;
    letter-spacing:2px;
    color:#707e60;
    margin-bottom:12px
}
.season-label>span {
    display:inline-block;
    background:#8ca37b;
    width:5px;
    height:5px;
    border-radius:50%;
    margin-right:7px;
    vertical-align:middle
}
.game-intro h1 {
    font-family:Georgia,serif;
    font-size:clamp(30px,3.4vw,44px);
    font-weight:500;
    letter-spacing:-1.5px
}
.game-intro h1 em {
    font-weight:400;
    color:#6e895b
}
.game-intro p {
    color:var(--muted);
    font-size:12px;
    margin-top:12px
}
.game-layout {
    max-width:1110px;
    margin:auto;
    display:grid;
    grid-template-columns:220px minmax(0,460px) 220px;
    gap:28px;
    justify-content:center;
    align-items:start;
    padding:0 20px
}
.left-rail,.right-rail {
    padding-top:92px;
    display:grid;
    gap:18px
}
.goal-card {
    padding:22px 20px
}
.little-star {
    color:#c49b43;
    font-size:17px;
    vertical-align:middle;
    margin-right:5px
}
.goal-art {
    height:164px;
    display:grid;
    place-items:center;
    position:relative
}
.goal-art>img {
    width:110px;
    z-index:1;
    filter:drop-shadow(0 8px 9px #cba65225)
}
.orbit {
    position:absolute;
    border:1px dashed #e2dbc4;
    border-radius:50%;
    width:132px;
    height:132px
}
.orbit-two {
    width:156px;
    height:156px;
    border-style:solid;
    border-color:#f0eddf
}
.goal-card h2 {
    font-family:Georgia,serif;
    font-size:21px;
    font-weight:500;
    letter-spacing:-.5px;
    text-align:center
}
.goal-card p {
    font-size:11px;
    color:var(--muted);
    text-align:center;
    margin-top:10px;
    line-height:1.8
}
.goal-progress {
    display:flex;
    justify-content:space-between;
    font-size:8px;
    color:var(--muted);
    margin:22px 0 7px
}
.tip-card {
    padding:21px;
    background:#eff1e6;
    box-shadow:none
}
.tip-card .section-label {
    font-size:8px
}
.tip-card h3 {
    font-family:Georgia,serif;
    font-size:20px;
    font-weight:500;
    margin:14px 0 8px
}
.tip-card p {
    color:#687160;
    font-size:11px;
    line-height:1.8
}
.tip-card a {
    font-size:11px;
    font-weight:650;
    display:flex;
    justify-content:space-between;
    margin-top:16px
}
.save-note {
    display:flex;
    justify-content:center;
    gap:7px;
    align-items:center;
    font-size:10px;
    color:var(--muted)
}
.harvest-card {
    padding:23px 22px
}
.harvest-card h2 {
    font-family:Georgia,serif;
    font-size:23px;
    font-weight:500;
    margin:14px 0 23px
}
.harvest-stat {
    display:flex;
    align-items:center;
    gap:13px;
    margin-top:18px
}
.stat-symbol {
    display:grid;
    place-items:center;
    background:#edf0e2;
    width:43px;
    height:45px;
    border-radius:12px;
    color:#6d8854;
    font-size:26px
}
.stat-symbol.peach {
    background:#fae8db;
    color:#c78d64
}
.harvest-stat div>span {
    display:block;
    font-size:10px;
    color:var(--muted)
}
.harvest-stat strong {
    font-size:23px;
    font-weight:650;
    line-height:1.4
}
.achievement-teaser {
    position:relative;
    text-align:left;
    padding:22px;
    display:flex;
    gap:12px;
    align-items:flex-start
}
.badge-icon {
    flex:none;
    display:grid;
    place-items:center;
    background:#f7eccb;
    color:#b8953f;
    width:37px;
    height:42px;
    border-radius:12px;
    font-size:26px
}
.achievement-teaser .eyebrow {
    font-size:7px;
    letter-spacing:1px;
    display:block
}
.achievement-teaser h3 {
    font-size:13px;
    margin:8px 0
}
.achievement-teaser p {
    font-size:10px;
    color:var(--muted)
}
.teaser-arrow {
    position:absolute;
    right:16px;
    bottom:10px;
    color:var(--muted)
}
.leaderboard-teaser {
    background:#f4e9df;
    padding:23px 22px;
    overflow:hidden;
    position:relative;
    min-height:200px;
    box-shadow:none
}
.leaderboard-teaser .section-label {
    font-size:8px;
    line-height:1.7;
    max-width:135px
}
.leaderboard-teaser h3 {
    font-family:Georgia,serif;
    font-size:24px;
    font-weight:500;
    margin:14px 0;
    max-width:150px
}
.leaderboard-teaser>span {
    font-size:10px;
    font-weight:600
}
.leaderboard-teaser b {
    margin-left:8px
}
.mini-fruits {
    display:flex;
    margin-top:12px;
    justify-content:flex-end;
    align-items:flex-end;
    height:55px
}
.mini-fruits img {
    width:47px;
    margin-left:-5px;
    transform:translateY(0) rotate(-15deg);
    transform-origin:50% 85%;
    transition:transform .22s ease;
    will-change:transform
}
.mini-fruits img:nth-child(2) {
    transform:translateY(0) rotate(12deg)
}
.mini-fruits img:nth-child(3) {
    transform:translateY(0) rotate(-9deg)
}
@media (hover:hover) and (pointer:fine) {
    .leaderboard-teaser:hover .mini-fruits img:first-child,
    .leaderboard-teaser:focus-visible .mini-fruits img:first-child {
        animation:mini-fruit-orange .68s cubic-bezier(.2,.8,.25,1) both
    }
    .leaderboard-teaser:hover .mini-fruits img:nth-child(2),
    .leaderboard-teaser:focus-visible .mini-fruits img:nth-child(2) {
        animation:mini-fruit-strawberry .72s .07s cubic-bezier(.2,.8,.25,1) both
    }
    .leaderboard-teaser:hover .mini-fruits img:nth-child(3),
    .leaderboard-teaser:focus-visible .mini-fruits img:nth-child(3) {
        animation:mini-fruit-pear .76s .13s cubic-bezier(.2,.8,.25,1) both
    }
}
@keyframes mini-fruit-orange {
    0% {transform:translateY(0) rotate(-15deg) scale(1)}
    32% {transform:translateY(-13px) rotate(-27deg) scale(1.08)}
    58% {transform:translateY(2px) rotate(-8deg) scale(.98)}
    78% {transform:translateY(-4px) rotate(-18deg) scale(1.02)}
    100% {transform:translateY(0) rotate(-15deg) scale(1)}
}
@keyframes mini-fruit-strawberry {
    0% {transform:translateY(0) rotate(12deg) scale(1)}
    30% {transform:translateY(-16px) rotate(24deg) scale(1.1)}
    56% {transform:translateY(1px) rotate(5deg) scale(.98)}
    78% {transform:translateY(-5px) rotate(15deg) scale(1.03)}
    100% {transform:translateY(0) rotate(12deg) scale(1)}
}
@keyframes mini-fruit-pear {
    0% {transform:translateY(0) rotate(-9deg) scale(1)}
    28% {transform:translateY(-11px) rotate(8deg) scale(1.07)}
    52% {transform:translateY(1px) rotate(-17deg) scale(.99)}
    74% {transform:translateY(-4px) rotate(-4deg) scale(1.02)}
    100% {transform:translateY(0) rotate(-9deg) scale(1)}
}
@media (prefers-reduced-motion:reduce) {
    .mini-fruits img {
        transition:none
    }
    .leaderboard-teaser:hover .mini-fruits img,
    .leaderboard-teaser:focus-visible .mini-fruits img {
        animation:none
    }
}
.fruit-journey {
    max-width:1054px;
    margin:46px auto 0;
    padding:24px 0 29px;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line)
}
.journey-title {
    display:flex;
    justify-content:space-between;
    align-items:center
}
.journey-title .eyebrow {
    font-size:8px
}
.journey-title h2 {
    font-family:Georgia,serif;
    font-size:23px;
    font-weight:500;
    margin-top:7px
}
.journey-title>span {
    font-size:8px;
    letter-spacing:1.5px;
    color:var(--muted)
}
.fruit-journey ol {
    list-style:none;
    padding:0;
    margin:25px 0 0;
    display:grid;
    grid-template-columns:repeat(11,1fr);
    gap:8px
}
.fruit-journey li {
    display:flex;
    flex-direction:column;
    align-items:center;
    position:relative
}
.fruit-journey li:not(:last-child)::after {
    content:'›';
    position:absolute;
    top:20px;
    right:-8px;
    color:#b8bda9
}
.fruit-journey li img {
    height:56px;
    width:53px;
    transition:transform .2s
}
.fruit-journey li:hover img {
    transform:translateY(-5px) rotate(-5deg)
}
.fruit-journey li span {
    font-size:9px;
    font-weight:600;
    margin-top:6px
}
.fruit-journey li small {
    font-size:8px;
    color:var(--muted);
    margin-top:3px
}
.below-game {
    max-width:1054px;
    margin:44px auto;
    display:grid;
    grid-template-columns:1fr 1.5fr;
    gap:80px
}
.below-game h2 {
    font-family:Georgia,serif;
    font-weight:500;
    font-size:30px;
    line-height:1.25;
    margin-top:15px
}
.below-game p {
    font-size:12px;
    color:var(--muted);
    line-height:1.85;
    margin-bottom:12px
}
.below-game a {
    font-size:11px;
    font-weight:600
}
.site-footer {
    max-width:1110px;
    margin:50px auto 0;
    border-top:1px solid var(--line);
    padding:27px 28px;
    display:flex;
    align-items:center;
    gap:40px
}
.footer-wordmark {
    font-size:19px;
    letter-spacing:-.8px;
    font-weight:650
}
.footer-wordmark span {
    display:block;
    font-size:9px;
    letter-spacing:0;
    color:var(--muted);
    font-weight:400;
    margin-top:4px
}
.site-footer nav {
    display:flex;
    gap:24px;
    font-size:10px;
    margin-left:auto
}
.footer-note {
    font-size:9px;
    color:var(--muted)
}


/* Social sharing */
.share-invite {
    width: min(1180px, calc(100% - 40px));
    margin: 34px auto 54px;
    padding: 28px 30px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(320px, auto);
    gap: 28px;
    align-items: center;
    border: 1px solid var(--line, #e3dfd2);
    border-radius: 24px;
    background: rgba(255,255,255,.68);
    box-shadow: 0 18px 50px rgba(88,74,45,.08);
}
.share-invite-copy {min-width:0;}
.share-invite h2 {margin:.3rem 0 .45rem;font-size:clamp(1.55rem,2.4vw,2.25rem);line-height:1.05;}
.share-invite p {margin:0;max-width:620px;color:var(--muted, #716f65);}
.share-actions {display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end;min-width:0;}
.share-button {
    appearance:none;
    border:1px solid var(--line, #ded9ca);
    border-radius:999px;
    background:#fff;
    color:inherit;
    padding:9px 13px;
    min-height:39px;
    font:inherit;
    font-size:.78rem;
    font-weight:800;
    line-height:1;
    cursor:pointer;
    white-space:nowrap;
    box-shadow:0 5px 16px rgba(64,53,30,.06);
}
.share-button:hover,.share-button:focus-visible {transform:translateY(-1px);box-shadow:0 8px 20px rgba(64,53,30,.11);}
.share-copy {background:var(--ink, #24352d);color:#fff;border-color:transparent;}
.game-over-share {margin:18px 0 6px;padding:14px 0;border-top:1px solid var(--line, #e3dfd2);border-bottom:1px solid var(--line, #e3dfd2);}
.game-over-share>span {display:block;margin-bottom:10px;font-size:.76rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;}
.share-actions.compact {justify-content:flex-start;}
.share-actions.compact .share-button {font-size:.72rem;padding:8px 11px;min-height:35px;}

/* Footer issue log link */
.footer-bug-link{display:grid!important;place-items:center;width:31px;height:31px;margin:-7px 0;border:1px solid var(--line);border-radius:50%;background:#f4f5ec;transition:transform .16s ease,background .16s ease,border-color .16s ease}
.footer-bug-link img{width:17px;height:17px;display:block;color:#5f6e4d}
.footer-bug-link:hover,.footer-bug-link:focus-visible{transform:translateY(-1px);background:#fff;border-color:#c8cdb9}

/* Avatar-aware header button */
.player-button img {
    width:25px;
    height:27px;
    object-fit:contain;
}
.player-button.has-character-avatar {
    padding:6px 12px 6px 8px;
}
.player-button.has-character-avatar img {
    width:34px;
    height:34px;
    border-radius:50%;
    object-fit:contain;
    background:#fffdf7;
    border:1px solid #d9dfcc;
    box-shadow:0 4px 14px rgba(71,77,57,.10);
}

@media (min-width:691px) {
    .fruit-journey ol {
        grid-template-columns:repeat(8,minmax(0,1fr));
        row-gap:22px;
    }
    .fruit-journey li:nth-child(8)::after {
        display:none;
    }
}