html body{margin:0;overflow:hidden;height:100dvh;display:block}
html body .comparison{display:block;margin:0;padding:0;height:100dvh}
html body .mock-surface{width:100%;height:100%;min-height:0;max-height:none;border:0;border-radius:0;box-shadow:none;margin:0}
html body .mock-banner>span{display:none}
html body.pass-preview-active .comparison{margin:0;height:100dvh}
html body.pass-preview-active .mock-surface{height:100%;min-height:0}
body[data-mobile-pass=true] #mockup .pass-header{padding-top:max(14px,env(safe-area-inset-top,0px))}
/* Live navigation uses the same geometry as home, Dex and settings. */
html body[data-home-navigation=v02] #mockup.mock-surface>.main-navigation{height:calc(110px + env(safe-area-inset-bottom,0px))!important}
html body[data-home-navigation=v02] #mockup.mock-surface .main-navigation .home-nav-dock{inset:auto 12px max(14px,env(safe-area-inset-bottom,0px))!important;max-width:430px!important;width:calc(100% - 24px)!important;padding:11px 10px!important;gap:8px!important}
/* Only the glass dock has a background; its reserve must not cover rewards. */
html body[data-home-navigation=v02] #mockup.mock-surface>.main-navigation{background:none!important}
body[data-embedded-navigation=true] #mockup>.main-navigation{visibility:hidden;pointer-events:none}
body[data-embedded-navigation=true] #mockup>.main-navigation *{pointer-events:none!important}
/* A streak opens the same saved gift, without flashing the album underneath. */
body.streak-gift-only #mockup>:not(#album-gifts){visibility:hidden;pointer-events:none}

/* Current game palette. The Pass keeps its own night-sky presentation. */
body:not(.pass-preview-active) #mockup{
 --bg:#f0e7fb;--paper:#fffaf1;--ink:#46305e;--muted:#74677f;--edge:#c8bdce;
 --cream:#f0e7fb;--active:rgba(117,117,117,.3);--track:#ded9df;--shadow:#c8bdce;
 --mint:#c6f5df;--green:#285f54;--gold:#735b27;--reward:#fff1c6;--reward-edge:#c7ad69;
 --album-ready-ink:#285f54;--album-done-ink:#285f54;--album-pattern:none;
 --frame-paper:#fffaf1;--frame-line:#c8bdce;--frame-ink:#46305e;
 --frame-disabled:#ded9df;--frame-disabled-line:#aaa3ad;--frame-disabled-ink:#8a818d;
 --frame-mint:#c6f5df;--frame-mint-line:#76ab99;--frame-mint-ink:#285f54;
 --frame-lavender:rgba(117,117,117,.3);--quest-xp-ink:#49345f;
 --album-progress-face:#ded9df;--album-progress-edge:#c8bdce;
 --album-progress-fill:#c6f5df;--album-progress-filled-ink:#285f54;
}
html[data-ui-theme=dark] body:not(.pass-preview-active) #mockup{
 --bg:#292c30;--paper:#1b1d1f;--ink:#e8e9e7;--muted:#a8afb7;--edge:#42474d;
 --cream:#292c30;--active:#6b6b6b;--track:#34373b;--shadow:#1b1d1f;
 --mint:#58cc02;--green:#58cc02;--gold:#ffd600;--reward:#292c30;--reward-edge:#b89a00;
 --album-ready-ink:#58cc02;--album-done-ink:#58cc02;
 --frame-paper:#1b1d1f;--frame-line:#42474d;--frame-ink:#e8e9e7;
 --frame-disabled:#34373b;--frame-disabled-line:#51565b;--frame-disabled-ink:#999ca1;
 --frame-mint:#58cc02;--frame-mint-line:#3f9301;--frame-mint-ink:#292c30;
 --frame-lavender:#6b6b6b;--quest-xp-ink:#ce82ff;
 --album-progress-face:#1b1d1f;--album-progress-edge:#42474d;
 --album-progress-fill:#58cc02;--album-progress-filled-ink:#292c30;
}
body:not(.pass-preview-active) #mockup [data-rounded-progress]{
 --rounded-face:var(--album-progress-face);--rounded-edge:var(--album-progress-edge);
 --progress-fill:var(--album-progress-fill);--progress-text:var(--ink);
 --progress-filled-text:var(--album-progress-filled-ink);
}
body:not(.pass-preview-active) #mockup :is(#album-rewards,.album-detail-footer) .style-button{
 --action-face:var(--frame-mint);--action-edge:var(--frame-mint-line);--action-ink:var(--frame-mint-ink);
 --reward-action-outline:var(--frame-mint-line);
}
body[data-settings-offers=true] #mockup .pass-offers-header{display:none}
html[data-ui-theme=dark] body[data-settings-offers=true] #mockup .pass-offer-periods button{
 --rounded-face:#1b1d1f;--rounded-edge:#51565b;color:#e8e9e7;
}
html[data-ui-theme=dark] body[data-settings-offers=true] #mockup .pass-offer-periods button[aria-pressed=true]{
 --rounded-face:#1cb0f5;--rounded-edge:#147fb0;color:#1b1d1f;
}
html[data-ui-theme=dark] body[data-settings-offers=true] .pass-offer-actions [data-pass-return].style-button{
 --action-face:#34373b;--action-edge:#51565b;--action-ink:#e8e9e7;--reward-action-outline:#51565b;
}