/* One content transition; the mobile navigation and page background stay still. */
/* Account switching submits a native POST so the previous page state is discarded. */
.sg-more-panel:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) { max-height:calc(100dvh - 28px); overflow-y:auto; overscroll-behavior:contain; }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:18px 0 0; padding:16px 0 0; border:0; border-top:1px solid #dce6d5; }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>div { min-width:0; display:grid; gap:4px; }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>div>span { color:#849080; font-size:11px; line-height:1.4; letter-spacing:0; }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#415c49; font-size:14px; line-height:1.5; letter-spacing:0; }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) button { display:flex; flex-shrink:0; align-items:center; justify-content:center; gap:7px; min-height:46px; margin:0; padding:10px 14px; border:1px solid #ccdbc7; border-radius:14px; background:#edf4e7; color:#42664c; font-family:inherit; font-size:13px; font-weight:600; line-height:1.4; letter-spacing:0; cursor:pointer; touch-action:manipulation; }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) button svg { width:19px; height:19px; flex-shrink:0; }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) button:active { transform:scale(.96); }
.sg-more-account:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) button:focus-visible { outline:2px solid #467550; outline-offset:2px; }
.fi-panel-player .fi-main { transition: opacity .18s ease; }
.sg-route-pending .fi-panel-player .fi-main { opacity: .84; }
.sg-route-arriving .fi-panel-player .fi-main {
    animation: sg-route-arrive .32s cubic-bezier(.2, .75, .3, 1) both;
}
.sg-route-arriving .sg-reveal { animation: none !important; }
.sg-mobile-nav a.is-pending {
    background: #dcebd6;
    color: #2f725a;
    box-shadow: inset 0 0 0 1px #adcbb36b;
}
@keyframes sg-route-arrive {
    from { opacity: .45; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .fi-panel-player .fi-main { transition: none; }
    .sg-route-pending .fi-panel-player .fi-main { opacity: 1; }
    .sg-route-arriving .fi-panel-player .fi-main { animation: none; }
}

/* The shared shop navigation must outrank the twelve-guard legacy stylesheet. */
.fi-panel-player { --sg-mobile-nav-height:calc(60px + max(4px, env(safe-area-inset-bottom))); }
.sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) { display:none!important; }
@media (max-width:1024px) {
    .fi-panel-player:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) .fi-main { padding-bottom:calc(var(--sg-mobile-nav-height) + 24px)!important; }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#) {
        position:fixed; inset:auto 0 0; z-index:1001; display:grid!important;
        grid-template-columns:repeat(5,minmax(0,1fr)); align-items:start;
        width:100%; max-width:none; height:var(--sg-mobile-nav-height); min-height:0;
        margin:0; padding:4px 8px max(4px,env(safe-area-inset-bottom));
        box-sizing:border-box; border:0; border-top:1px solid #e1e7db; border-radius:0;
        color:#97a58d; background:#ffffffe8!important; box-shadow:none;
        -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px);
        font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;
        letter-spacing:0; isolation:isolate;
    }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>a,
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>button {
        position:relative; z-index:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
        gap:4px; width:100%; min-width:0; max-width:none; height:55px; min-height:0;
        margin:0; padding:3px; box-sizing:border-box; border:0; border-radius:10px;
        color:#97a58d!important; background:transparent!important; box-shadow:none;
        font-family:inherit; font-size:9px; font-weight:400; line-height:1.4; letter-spacing:0;
        text-decoration:none; cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation;
        transition:transform .28s cubic-bezier(.2,.8,.3,1.2),color .18s,background .18s!important;
    }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>a>svg,
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>button>svg {
        display:block; flex-shrink:0; width:21px; height:21px; margin:0; color:inherit;
    }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>a>span,
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>button>span {
        display:block; height:auto; margin:0; padding:0; color:inherit; font-size:9px;
        font-weight:inherit; line-height:1.4; letter-spacing:0; white-space:nowrap;
    }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>.is-active { color:#467550!important; font-weight:700; }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>.is-active::before {
        content:""; position:absolute; z-index:-1; top:3px; left:50%; width:43px; height:30px;
        border-radius:10px; background:#e5efdcc7; transform:translateX(-50%); pointer-events:none;
    }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>a.is-pending { color:#2f725a!important; background:#dcebd6!important; box-shadow:inset 0 0 0 1px #adcbb36b; }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>a:active,
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>button:active { transform:scale(.96); }
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>a:focus-visible,
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>button:focus-visible { outline:2px solid #467550; outline-offset:-2px; }
}
@media (prefers-reduced-motion:reduce) {
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>a,
    .sg-unified-nav:not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#):not(#\#)>button { transition:none!important; }
}
