@import url('/interface-page-polish.css');
@import url('/home-navigation-glass.css');
@import url('/dex-overview.css');
/* Approved common frame: native V02 artwork, outline dark / colored pastel. */
html body[data-home-navigation=v02]{--main-height:110px}
html body[data-home-navigation=v02] .main-navigation{height:calc(var(--main-height) + env(safe-area-inset-bottom,0px));}
html body[data-home-navigation=v02] .main-navigation .home-nav-size{
 position:absolute;inset:0;pointer-events:none;transform:scale(var(--home-nav-scale,1));
 transform-origin:center calc(100% - max(14px,env(safe-area-inset-bottom,0px)));
 will-change:transform;
}
html body[data-home-navigation=v02] .main-navigation .home-nav-dock{
 --dock:#fff9ee;--dock-edge:#8e75a3;--active:#ded0ef;--selection-glow:#b78cda26;
 position:absolute!important;inset:auto 12px max(14px,env(safe-area-inset-bottom,0px))!important;
 display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px!important;
 width:calc(100% - 24px)!important;max-width:430px!important;height:auto!important;margin:0 auto!important;
 padding:11px 10px!important;align-items:start!important;box-sizing:border-box;
 border:1px solid var(--dock-edge)!important;border-radius:23px!important;border-image:none!important;
 background:var(--dock)!important;box-shadow:0 0 0 1.5px var(--dock-edge),0 4px 12px #17131b24!important;
 transform-origin:center;will-change:transform;isolation:isolate;touch-action:none;pointer-events:auto;
 -webkit-tap-highlight-color:transparent;
}

/* Deliberately no !important on transform: the approved press uses Web Animations. */
html body[data-home-navigation=v02] .main-navigation .v2-home-dock.home-nav-dock{transform:var(--home-dock-transform,none)}
html[data-ui-theme=dark] body[data-home-navigation=v02] .main-navigation .home-nav-dock{--dock:#24282d;--dock-edge:#40464e;--active:#41464b;--selection-glow:#aab3be14;box-shadow:0 4px 12px #17131b24!important}
html body[data-home-navigation=v02] .main-navigation .home-nav-dock>.home-nav-button{
 position:relative!important;z-index:1;display:block!important;flex:none!important;min-width:0!important;min-height:0!important;
 width:100%!important;height:auto!important;aspect-ratio:1;max-width:none!important;max-height:none!important;
 margin:0!important;padding:0!important;border:0!important;border-image:none!important;border-radius:16px!important;
 background:none!important;box-shadow:none!important;filter:none!important;transform:none!important;translate:none!important;
 cursor:pointer;pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent;
}
html body[data-home-navigation=v02] .home-nav-button:before,html body[data-home-navigation=v02] .home-nav-button:after{display:none!important}
html body[data-home-navigation=v02] .home-nav-dock .home-nav-button>.home-nav-art{
 display:none!important;position:absolute!important;inset:7.5%!important;width:85%!important;height:85%!important;
 max-width:none!important;max-height:none!important;object-fit:contain!important;image-rendering:auto!important;
 margin:0!important;transform:none!important;translate:none!important;filter:none!important;pointer-events:none;
}
html body[data-home-navigation=v02] .home-nav-dock .home-nav-button>.home-nav-pastel{display:block!important}
html body[data-home-navigation=v02] .home-nav-dock [data-home-nav=subscription]>.home-nav-art{inset:6% 4% 2%!important;width:92%!important;height:92%!important}
html body[data-home-navigation=v02] .home-nav-dock [data-home-nav=profile]>.home-nav-art{inset:0!important;width:100%!important;height:100%!important}
html[data-ui-theme=dark] body[data-home-navigation=v02] .home-nav-dock .home-nav-button>.home-nav-pastel{display:none!important}
html[data-ui-theme=dark] body[data-home-navigation=v02] .home-nav-dock .home-nav-button>.home-nav-rest{display:block!important}
html[data-ui-theme=dark] body[data-home-navigation=v02] .home-nav-dock .home-nav-button[aria-pressed=true]>.home-nav-rest{display:none!important}
html[data-ui-theme=dark] body[data-home-navigation=v02] .home-nav-dock .home-nav-button[aria-pressed=true]>.home-nav-selected{display:block!important}
html body[data-home-navigation=v02] .home-nav-indicator{position:absolute;left:0;top:0;background:var(--active);border-radius:16px;box-shadow:0 0 16px var(--selection-glow);pointer-events:none;z-index:0}
html body[data-home-navigation=v02] .home-nav-button:focus-visible{outline:3px solid #977ec1!important;outline-offset:3px}
html body[data-home-navigation=v02] .main-navigation-legacy{display:none!important}
/* Daily activity belongs to the Dex; keep the count-to-meter spacing intact. */
html body #vocabulary-dialog .dex-daily-summary{position:relative;display:grid;gap:10px;padding-right:62px;min-height:48px}
html body .dex-daily-entry{position:absolute!important;right:0!important;top:50%!important;left:auto!important;bottom:auto!important;transform:translateY(-50%)!important;width:48px!important;height:48px!important;min-width:48px!important;min-height:48px!important;max-width:none!important;max-height:none!important;padding:0!important;margin:0!important;border:0!important;border-image:none!important;border-radius:12px!important;background:none!important;box-shadow:none!important;cursor:pointer;touch-action:manipulation}
html body .dex-daily-entry:before,html body .dex-daily-entry:after{display:none!important}
html body .dex-daily-entry img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;image-rendering:auto;pointer-events:none}
html body .dex-daily-entry .dex-daily-dark{display:none}
html[data-ui-theme=dark] body .dex-daily-entry .dex-daily-pastel{display:none}
html[data-ui-theme=dark] body .dex-daily-entry .dex-daily-dark{display:block}
html body .dex-daily-entry:active{scale:.92}
html body .dex-daily-entry:focus-visible{outline:2px solid #977ec1;outline-offset:3px}
html body .dex-daily-entry.dex-daily-guided{pointer-events:auto;top:auto!important;bottom:calc(var(--main-height) + 8px)!important;right:20px!important;transform:none!important}
html body #review-dialog[data-dex-daily]{width:100%!important;max-width:none!important;height:100dvh!important;margin:0!important;border:0!important;border-radius:0!important;background-color:#f6edff!important}
html[data-ui-theme=dark] body #review-dialog[data-dex-daily]{background:#1b1d1f!important}
/* Subscription access uses the existing offers and purchasing controller. */
html body #offers[data-home-nav-page]{padding-top:var(--home-banner-space)!important;padding-bottom:calc(var(--main-height) + env(safe-area-inset-bottom,0px))!important}
html body #offers[data-home-nav-page]>.offers-topline,html body #offers[data-home-nav-page] .offers-footer{display:none!important}
html body #offers[data-home-nav-page]>.v2-offer-content{flex:1;min-height:0;box-sizing:border-box}
html body[data-home-navigation=v02][data-home=true] #home-settings-slot{display:none!important}
/* Preserve guided onboarding: the Dex appears alone until the tutorial unlocks the dock. */
html body[data-home-navigation=v02][data-onboarding-dock=dex] .home-nav-dock{width:90px!important;grid-template-columns:1fr}
html body[data-home-navigation=v02][data-onboarding-dock=dex] .home-nav-dock>:not(#vocabulary-test){display:none!important}
html body[data-home-navigation=v02] #vocabulary-test>.onboarding-dex-icon{display:none!important}
html body[data-home-navigation=v02][data-onboarding-dock=locked] .main-navigation{display:none!important}
html body #home-achievements{position:fixed;inset:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;border-radius:0;background:#fff9ee;color:#51445f;overflow:hidden}
html[data-ui-theme=dark] body #home-achievements{background:#202327;color:#efefec}
#home-achievements::backdrop{background:transparent}
#home-achievements header{position:relative;min-height:70px;padding:calc(18px + env(safe-area-inset-top,0px)) 70px 18px;text-align:center}
html body #home-achievements h2{margin:0;font-family:PixelUI,sans-serif;font-size:24px;font-weight:500;line-height:1.2;color:inherit;text-shadow:none!important;-webkit-text-stroke:0!important}
#home-achievements header button{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));left:14px}
#home-achievements .achievements-empty{position:absolute;inset:80px 24px calc(var(--main-height) + 20px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;text-align:center;font-family:PixelUI,sans-serif;font-size:20px}
#home-achievements .achievements-empty img{width:112px;height:112px;image-rendering:auto}
html body #home-achievements .achievements-empty p{margin:0;color:inherit}
@media(max-width:360px){html body[data-home-navigation=v02]{--main-height:94px}}
@media(orientation:landscape) and (max-height:600px){html body[data-home-navigation=v02]{--main-height:88px}html body[data-home-navigation=v02] .main-navigation .home-nav-dock{max-width:360px!important;padding:6px 10px!important;bottom:max(8px,env(safe-area-inset-bottom,0px))!important}}

/* The five home destinations are pages. Other game dialogs keep their motions. */
html body[data-home-navigation=v02] dialog[data-home-nav-page]:not([data-dex-sheet]){animation:none!important;transition:none!important;transform:none!important;translate:none!important;scale:none!important}
html body[data-home-navigation=v02] dialog[data-home-nav-page]::backdrop{background:transparent!important}
html body #settings-dialog[data-home-nav-page]>.dialog-heading>form,
html body[data-home-navigation=v02] #vocabulary-dialog#vocabulary-dialog[data-home-nav-page] #study-close,
html body[data-home-navigation=v02] #discovery-detail#discovery-detail[data-home-nav-page] #dex-close,
html body #review-dialog[data-home-nav-page] #review-close{display:none!important}
html body #settings-dialog[data-home-nav-page]{padding-bottom:calc(var(--main-height) + env(safe-area-inset-bottom,0px))!important}
html body #review-dialog[data-home-nav-page]{position:fixed!important;inset:0!important;width:100%!important;height:100dvh!important;max-width:none!important;max-height:none!important;margin:0!important;border:0!important;border-radius:0!important;box-sizing:border-box;padding-bottom:calc(var(--main-height) + env(safe-area-inset-bottom,0px))!important}
html body #review-dialog[data-home-nav-page]>.main-navigation{display:block!important;grid-area:auto;position:fixed}
/* Opaque on the very first frame, before the general theme adapter scans it. */
html body #review-dialog[data-home-nav-page]{background-color:var(--rm-bg,#f0e5fa)!important}
html[data-ui-theme=dark] body #review-dialog[data-home-nav-page]{background:#1b1d1f!important}
/* Shared page banner, based on the simple title of the achievements page. */
html body[data-home-navigation=v02]{--home-banner-height:70px;--home-banner-space:calc(var(--home-banner-height) + env(safe-area-inset-top,0px));--home-banner-bg:#fff9ee;--home-banner-ink:#51445f;--home-banner-edge:#dacee1}
html[data-ui-theme=dark] body[data-home-navigation=v02]{--home-banner-bg:#202327;--home-banner-ink:#efefec;--home-banner-edge:#41464b}
html body .home-page-banner{display:none}
/* The destination exists immediately; only its contents wait for data. The
   normal navigation is moved here while loading, so another tap can leave. */
.home-menu-pending{position:absolute;inset:0;overflow:hidden;background:var(--rm-bg,#f0e5fa);color:var(--home-banner-ink,#51445f)}
html[data-ui-theme=dark] .home-menu-pending{background:#1b1d1f}
.home-menu-pending[hidden]{display:none}
.home-menu-pending-title{height:var(--home-banner-space,70px);box-sizing:border-box;padding:var(--pixelingo-safe-area-top,env(safe-area-inset-top,0px)) 16px 0;display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--home-banner-edge,#dacee1);background:var(--home-banner-bg,#fff9ee)}
.home-menu-pending-title h2{font:500 24px/1.2 PixelUI,sans-serif;text-transform:uppercase;margin:0}
.home-menu-placeholders{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:520px;margin:28px auto;padding:0 20px}
.home-menu-placeholders span{aspect-ratio:1;border:2px solid currentColor;border-radius:8px;opacity:.12}
.home-menu-pending[data-section=subscription] .home-menu-placeholders{grid-template-columns:1fr;max-width:150px}
.home-menu-pending[data-section=subscription] .home-menu-placeholders span{height:100px;aspect-ratio:auto}
#succes-navigation>.main-navigation{z-index:100}
html body[data-home-navigation=v02] dialog[data-home-nav-page]>.home-page-banner,
html body[data-home-navigation=v02] #review-dialog#review-dialog[data-dex-daily]>.home-page-banner{
 display:flex!important;position:fixed!important;inset:0 0 auto!important;z-index:90;
 width:100%!important;max-width:none!important;height:var(--home-banner-space)!important;min-height:0!important;
 align-items:center!important;justify-content:center!important;box-sizing:border-box!important;
 padding:env(safe-area-inset-top,0px) max(16px,env(safe-area-inset-right,0px)) 0 max(16px,env(safe-area-inset-left,0px))!important;margin:0!important;
 border:0!important;border-bottom:1px solid var(--home-banner-edge)!important;border-radius:0!important;border-image:none!important;
 background:var(--home-banner-bg)!important;box-shadow:none!important;transform:none!important;translate:none!important;
}
html body[data-home-navigation=v02] dialog[data-home-nav-page]>.home-page-banner h2,
html body[data-home-navigation=v02] #review-dialog[data-dex-daily]>.home-page-banner h2{
 display:block!important;width:100%!important;margin:0!important;padding:0!important;text-align:center!important;
 font:500 24px/1.2 PixelUI,sans-serif!important;text-transform:uppercase!important;letter-spacing:.5px!important;
 color:var(--home-banner-ink)!important;-webkit-text-fill-color:var(--home-banner-ink)!important;-webkit-text-stroke:0!important;text-shadow:none!important;
 background:none!important;white-space:nowrap!important;
}
html body #home-achievements[data-home-nav-page]>header:not(.home-page-banner),
html body #settings-dialog[data-home-nav-page]>.dialog-heading,
html body[data-home-navigation=v02] #vocabulary-dialog#vocabulary-dialog[data-home-nav-page]>.study-header,
html body[data-home-navigation=v02] #discovery-detail#discovery-detail[data-home-nav-page] .dex-topbar,
html body[data-home-navigation=v02] #review-dialog[data-home-nav-page]>.dialog-top{display:none!important}
html body #home-achievements[data-home-nav-page] .achievements-empty{top:calc(var(--home-banner-space) + 16px)}
html body #settings-dialog[data-home-nav-page]{padding-top:calc(var(--home-banner-space) + 12px)!important}
html body[data-home-navigation=v02] #vocabulary-dialog#vocabulary-dialog[data-home-nav-page] .study-shell,
html body[data-home-navigation=v02] #discovery-detail#discovery-detail[data-home-nav-page] .dex-device{padding-top:calc(var(--home-banner-space) + 16px)!important}
html body #review-dialog[data-home-nav-page][data-daily-layout][data-state]{padding-top:calc(var(--home-banner-space) + 12px)!important}
html body #review-dialog#review-dialog[data-dex-daily] #review-close{display:grid!important;z-index:100}
html body #review-dialog#review-dialog[data-dex-daily]>.dialog-top{display:none!important}
html body #review-dialog#review-dialog[data-dex-daily][data-daily-layout][data-state]{padding-top:calc(var(--home-banner-space) + 12px)!important}
@media(orientation:portrait){
 html body #review-dialog[data-home-nav-page][data-daily-layout][data-state=review] #review-prompt{font-size:clamp(56px,calc(100dvh - var(--main-height) - var(--home-banner-space) - 560px),140px)}
}
@media(orientation:portrait) and (max-height:660px){
 html body[data-home-navigation=v02]{--home-banner-height:56px}
 html body #review-dialog[data-home-nav-page][data-daily-layout][data-state]{--daily-star-size:40px;--daily-keys:188px;padding-top:calc(var(--home-banner-space) + 8px)!important}
 html body #review-dialog[data-home-nav-page][data-daily-layout][data-state=review]:not([data-answered=true]){grid-template-rows:40px minmax(56px,1fr) 22px 44px auto auto auto var(--daily-keys)}
 html body #review-dialog[data-home-nav-page][data-daily-layout][data-state=review] #review-message{max-height:32px;padding-block:3px}
 html body #review-dialog[data-home-nav-page][data-state=reward] .daily-mystery-card{height:min(320px,calc(100dvh - var(--main-height) - 220px));width:min(224px,calc((100dvh - var(--main-height) - 220px)*.7))}
}
@media(orientation:landscape) and (max-height:600px){
 html body[data-home-navigation=v02]{--home-banner-height:42px}
 html body[data-home-navigation=v02] dialog[data-home-nav-page]>.home-page-banner h2{font-size:22px!important}
 html body #review-dialog[data-home-nav-page][data-daily-layout][data-state]{--daily-star-size:64px;padding-top:calc(var(--home-banner-space) + 8px)!important}
 html body #review-dialog[data-home-nav-page][data-daily-layout]:is([data-state=review],[data-state=loading],[data-state=complete],[data-state=reward]){grid-template-rows:26px 44px 26px minmax(0,1fr) 26px 24px 34px}
 html body #review-dialog[data-home-nav-page][data-daily-layout][data-state=review] #review-prompt{font-size:clamp(72px,26dvh,112px)}
}
