.app-home{display:none}
@media(max-width:650px){
body:not([data-screen=game]) .club-header{padding:12px 20px;min-height:72px;flex-wrap:nowrap;gap:12px}
body:not([data-screen=game]) .club-header .brand{font-size:27px;letter-spacing:-1px;gap:8px}
body:not([data-screen=game]) .club-header .user-pill{padding:3px;border:0;background:none;box-shadow:none}
body:not([data-screen=game]) .club-header .user-pill>span:not(:first-child){display:none}
body:not([data-screen=game]) #header-avatar>.avatar{width:40px;height:40px}
body:not([data-screen=game]) .club-header .header-settings{width:44px;height:44px;margin-left:auto;border-radius:50%;font-size:23px}
body:not([data-screen=game]) .hub{padding:20px 20px 24px;min-height:calc(100dvh - 72px);max-width:650px}
body[data-screen=home] .hub{padding-top:16px}
.app-home{display:block;max-width:460px;margin:0 auto}
.app-welcome{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:0 0 18px}.app-welcome p{font-size:15px;color:var(--sub);margin:0 0 5px;line-height:1.5}.app-home .app-welcome h1{font-family:Manrope,sans-serif;font-size:32px;font-weight:700;line-height:1.2;letter-spacing:-1px;margin:0;color:var(--text)}.app-level{font-size:13px;white-space:nowrap;color:var(--text);background:var(--surface);border:1px solid var(--club-line);border-radius:20px;padding:11px 13px;min-height:44px}.app-level>span{color:var(--orange);font-size:18px;margin-right:3px}
.app-play-card{position:relative;isolation:isolate;overflow:hidden;border-radius:26px;background:radial-gradient(ellipse at 50% 18%,color-mix(in srgb,var(--mint) 18%,transparent),transparent 75%),var(--surface);border:1px solid color-mix(in srgb,var(--mint) 25%,var(--club-line));padding:8px 18px 18px;margin-bottom:14px;text-align:center}.app-play-art{position:relative;height:125px;display:flex;align-items:center;justify-content:center}.app-play-art>img{height:145px;width:180px;object-fit:contain;filter:drop-shadow(0 8px 9px #0001);transform:translateY(5px)}.app-yarn{position:absolute;right:19%;top:25px;color:var(--orange);font-size:28px;transform:rotate(15deg)}.app-play-label{display:block;color:var(--sub);font-size:13px;line-height:1.5;margin:4px 0 12px}.app-play-button{display:flex;align-items:center;justify-content:center;gap:16px;width:100%;min-height:58px;padding:16px 13px;border-radius:17px;background:var(--mint);color:#142d29;font-size:17px;font-weight:700;line-height:1.4;box-shadow:0 5px 0 color-mix(in srgb,var(--mint) 45%,var(--surface))}.app-play-button>span{font-size:23px;flex:none}
.app-choice{display:flex;align-items:center;gap:15px;width:100%;min-height:87px;padding:16px 18px;background:var(--surface);border:1px solid var(--club-line);border-radius:21px;margin-bottom:12px;text-align:left;color:var(--text)}.app-choice-icon{display:grid;place-items:center;width:49px;height:49px;border-radius:16px;background:color-mix(in srgb,var(--mint) 10%,var(--club-bg));color:var(--mint);font-size:29px;flex:none}.app-choice>span:nth-child(2){flex:1;min-width:0}.app-choice b{display:block;font-size:18px;font-weight:700;line-height:1.4}.app-choice small{display:block;color:var(--sub);font-size:13px;line-height:1.5;margin-top:4px}.app-choice>span:last-child{font-size:23px;color:var(--sub);flex:none}.app-daily{background:linear-gradient(115deg,color-mix(in srgb,var(--orange) 8%,var(--surface)),var(--surface));border-color:color-mix(in srgb,var(--orange) 25%,var(--club-line))}.app-daily .app-choice-icon{color:var(--orange);background:color-mix(in srgb,var(--orange) 13%,var(--surface))}
.app-disclosure{margin:12px 0;background:var(--surface);border:1px solid var(--club-line);border-radius:18px;overflow:hidden}.app-disclosure>summary{display:flex;align-items:center;gap:12px;padding:17px;min-height:62px;cursor:pointer;list-style:none;color:var(--text)}.app-disclosure>summary::-webkit-details-marker{display:none}.app-disclosure>summary>span{font-size:22px;color:var(--mint);width:25px;text-align:center;flex:none}.app-disclosure>summary>b{font-size:15px;font-weight:600;line-height:1.5;flex:1}.app-disclosure>summary>em{font-size:14px;font-style:normal;color:var(--sub)}.app-disclosure>summary>i{font-size:20px;font-style:normal;color:var(--sub);transition:transform .2s}.app-disclosure[open]>summary>i{transform:rotate(180deg)}.app-disclosure[open]>summary{border-bottom:1px solid var(--club-line)}.app-disclosure>.panel,.app-disclosure>.settings-card,.app-disclosure>.profile-editor{border:0;box-shadow:none;margin:0;border-radius:0;background:transparent;padding:18px}.app-goals .daily-goals{margin:0;padding:18px}.app-goals .goals-heading{display:none}.app-goals .goals-list{margin-top:0;gap:10px;grid-template-columns:1fr}.app-goals .goal b{font-size:14px}.app-goals .goal small{font-size:12px}.app-goals .goals-bottom{font-size:13px;gap:12px;align-items:flex-start}.app-goals .goals-bottom button{font-size:12px;line-height:1.6}.app-goals .goals-note{font-size:12px}.app-sync-ready{display:flex;justify-content:center;align-items:center;gap:7px;color:var(--sub);font-size:12px;margin:16px 0 0}.app-sync-ready>span{color:var(--mint)}.app-sync>summary>b{font-size:14px}.app-sync>summary>span{color:var(--orange)}.app-disclosure>.sync-card{border:0;border-radius:0;margin:0;padding:18px;box-shadow:none}.app-sync .sync-card b{font-size:14px}.app-sync .sync-card p{font-size:13px;margin-left:0}.app-sync .sync-actions button,.app-sync .sync-card details button{font-size:14px;min-height:48px}.app-sync .sync-card details summary{font-size:13px}
body:not([data-screen=game]) .mobile-dock{padding:8px 9px calc(8px + env(safe-area-inset-bottom));gap:4px}body:not([data-screen=game]) .mobile-dock button{min-height:52px;font-size:11px;gap:5px;border-radius:15px}body:not([data-screen=game]) .mobile-dock button>span{font-size:24px}
body:is([data-screen=settings],[data-screen=profile]) .hub-title{margin-bottom:22px}body:is([data-screen=settings],[data-screen=profile]) .hub-title .eyebrow,body:is([data-screen=settings],[data-screen=profile]) .hub-title p{display:none}body:is([data-screen=settings],[data-screen=profile]) .hub-title h1{font-size:29px;margin:0;font-weight:700}body[data-screen=settings] .settings-card>h3{display:none}body[data-screen=settings] .settings-card>p{font-size:14px;line-height:1.8}body[data-screen=settings] .settings-card>p:first-of-type{margin-top:0}body[data-screen=settings] .setting-switch{gap:15px;min-height:70px}body[data-screen=settings] .setting-switch b{font-size:15px;line-height:1.5}body[data-screen=settings] .setting-switch small{font-size:12px;line-height:1.7;margin-top:5px}body[data-screen=settings] .theme-picker strong{font-size:14px}body[data-screen=settings] .theme-picker small{font-size:12px}body[data-screen=settings] .settings-links{display:grid;grid-template-columns:1fr;gap:0;border:1px solid var(--club-line);border-radius:18px;overflow:hidden;background:var(--surface)}body[data-screen=settings] .settings-links>button{min-height:56px;text-align:left;padding:15px 19px;font-size:15px;border:0;border-bottom:1px solid var(--club-line);border-radius:0;margin:0}body[data-screen=settings] .settings-links>button:last-child{border-bottom:0}body[data-screen=settings] #settings-resume{font-size:16px;min-height:54px;width:100%;justify-content:center;margin:16px 0 22px}#settings-resume[hidden]{display:none}body[data-screen=settings] .sync-card b{font-size:14px}body[data-screen=settings] .sync-card p,body[data-screen=settings] .sync-card summary{font-size:12px}body[data-screen=settings] .sync-actions button{font-size:14px}
body[data-screen=profile] .profile-layout{display:flex;flex-direction:column;gap:0}body[data-screen=profile] .profile-preview{padding:23px;margin-bottom:8px}body[data-screen=profile] .profile-preview .avatar-portrait{width:80px;height:80px;margin-bottom:12px}body[data-screen=profile] .profile-preview .rank-badge{font-size:12px}body[data-screen=profile] .profile-preview .xp-caption{font-size:12px}body[data-screen=profile] .profile-numbers small{font-size:12px}body[data-screen=profile] .profile-preview h2{font-size:25px}body[data-screen=profile] .profile-editor>label,body[data-screen=profile] .profile-editor h3{font-size:15px}body[data-screen=profile] .profile-editor>input{font-size:16px;min-height:50px}body[data-screen=profile] .field-note{font-size:12px}body[data-screen=profile] .frame-picker b{font-size:14px}body[data-screen=profile] .frame-picker small{font-size:12px}body[data-screen=profile] .profile-editor .primary{font-size:15px;min-height:52px}body[data-screen=profile] .exp-companions>p,body[data-screen=profile] .collection-panel>p{font-size:13px;line-height:1.8}body[data-screen=profile] .exp-companion-grid{grid-template-columns:repeat(2,minmax(0,1fr))}body[data-screen=profile] .exp-companion>b{font-size:15px}body[data-screen=profile] .exp-companion>small,body[data-screen=profile] .exp-companion>span{font-size:12px}body[data-screen=profile] .badge-grid{grid-template-columns:1fr 1fr}body[data-screen=profile] .collection-badge>b{font-size:14px}body[data-screen=profile] .collection-badge>small{font-size:12px}body[data-screen=profile] .collection-badge>em{font-size:12px}
html:is([data-theme=light],[data-theme=pastel]) .app-play-button{background:#327f78;color:#fff;box-shadow:0 5px 0 #245c57}
}
@media(max-width:650px){
 .app-home .app-play-card{margin-bottom:8px}
 .app-home .app-learn-entry{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:44px;padding:10px 3px;font-size:12px;text-align:left;margin:0 0 16px}
 .app-home .app-mode-choices{display:grid;gap:12px}
 .app-home .app-choice{margin:0;min-height:88px}
 .app-home .app-choice b,.app-home .app-free-short b{font-size:17px}
 .app-home .app-choice small{font-size:12px}
 .app-home .app-choice:disabled{opacity:.6}
 .app-home .app-play-button:disabled{opacity:.65;box-shadow:none;cursor:wait}
 .app-home .app-play-label{text-transform:none;font-weight:600}
 .app-home .app-disclosure>summary{min-height:64px}
 body:not([data-screen=game]) .mobile-dock button{min-width:0;min-height:54px;padding:8px 2px;line-height:1.2;font-size:10px}
 body:not([data-screen=game]) .mobile-dock .nav-cat-icon{display:block;width:25px;height:25px}
 .app-home :is(button,summary):focus-visible{outline:3px solid var(--mint);outline-offset:3px}
}
@media(max-width:360px){.app-home .app-choice{gap:11px;padding:15px 14px}.app-home .app-choice b,.app-home .app-free-short b{font-size:15px}.app-home .app-choice-icon{width:44px;height:44px}.app-home .app-play-card{padding:8px 14px 16px}.app-home .app-play-button{font-size:15px}.app-home .app-welcome h1{font-size:29px}}
