/* Family-only illustrated navigation and earned counters. */
.fh-icon{width:44px;height:44px;flex:none;filter:drop-shadow(0 3px 2px #31664d15);transition:transform .25s cubic-bezier(.2,1.5,.4,1)}
.fn-side .sb-item{display:flex;align-items:center;gap:10px;padding:7px 10px;min-height:54px}
.fn-side .sb-item .fh-icon{width:38px;height:38px}
.fn-side .sb-item:hover .fh-icon,#fn-tabs button:hover .fh-icon{transform:translateY(-3px) rotate(-5deg)}
.fn-side .sb-item:active .fh-icon,#fn-tabs button:active .fh-icon{transform:scale(.9)}
.fn-side .sb-lb{font-size:14px}
body.fn-on.fmode-child:not(.fn-phone){--fn-rail:112px}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button svg.fh-icon{width:48px;height:48px;stroke:none}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button{min-height:99px;font-size:12px;padding:8px 2px}
#fh-wallet{display:flex;align-items:center;gap:7px;pointer-events:auto;white-space:nowrap}
#fh-wallet[hidden]{display:none!important}
#fh-wallet button{display:flex;align-items:center;gap:5px;background:#fffdf3ed;border:1px solid #e8dcc1;border-radius:25px;padding:3px 11px 3px 3px;color:#4c5644;cursor:pointer;min-height:38px;box-shadow:0 2px 0 #eadfc055}
#fh-wallet .fh-icon{width:30px;height:30px}
#fh-wallet .fh-icon>rect,#fh-wallet .fh-icon>circle:last-of-type,#fh-wallet .fh-icon>path:last-child{display:none}
#fh-wallet b{font-size:15px;font-variant-numeric:tabular-nums}
#fh-wallet small{font-size:10px;color:#7a826f}
.fh-wallet-owner{display:none}
body.fh-wallet-on.fn-on .tb-left>#tb-pct,body.fh-wallet-on.fn-on .tb-left>#tb-q{display:none!important}
body.fd-host #back::before{background-image:none!important}
body.fd-host #back{background:#eaf4eb!important}
body.fd-host #stage{padding-top:66px!important}
body.fd-host #fn-parent-trip{font-size:12px;padding:7px 12px;min-height:32px}
.fh-earned{animation:fhRewardPop .6s ease-out}
@keyframes fhRewardPop{40%{transform:translateY(-4px);filter:brightness(1.2)}100%{transform:none}}
@media(min-width:901px){body.fh-wallet-on.fmode-child .topbar .tb-left{padding-left:116px}}
@media(max-width:1100px) and (min-width:601px){#fh-wallet small{display:none}#fh-wallet button{padding-right:8px;gap:3px}#fh-wallet{gap:4px}}
@media(max-width:600px) and (orientation:portrait){
 #fh-wallet{position:fixed;top:58px;left:8px;right:8px;justify-content:center;padding:5px 6px;background:#f6fbf4f5;border:1px solid #deeadf;border-radius:17px;box-shadow:0 4px 12px #234a3210;z-index:35;gap:6px}
 #fh-wallet button{flex:1;justify-content:center;padding:2px 5px;min-height:36px;gap:4px;border-radius:12px}
 #fh-wallet .fh-icon{width:27px;height:27px}#fh-wallet b{font-size:14px}#fh-wallet small{display:none}#fh-wallet [data-wallet=ticket] small{display:block;font-size:9px}
 body.fh-wallet-on #stage,body.fh-wallet-on.fd-host.sb-on #stage{padding-top:120px!important}
 body.fn-on.fn-phone #fn-tabs{height:calc(82px + env(safe-area-inset-bottom))}
 body.fn-on.fn-phone #fn-tabs button svg.fh-icon{width:35px;height:35px;stroke:none}
 body.fn-on.fn-phone #fn-tabs button{font-size:10px;gap:2px}
 body.fd-host #back::before{opacity:.12}
}
@media(max-height:650px) and (min-width:601px){body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button{min-height:70px}body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button svg.fh-icon{width:35px;height:35px}}

@media(max-width:1100px){.fh-pass-long{display:none}}

.fh-daily-profile{width:100%;display:flex;align-items:center;gap:12px;background:#fffffff0;border:1px solid #e9dfe0;border-radius:19px;padding:8px 16px;margin-bottom:10px;text-align:left;color:#345346;cursor:pointer}
.fh-profile-photo{position:relative;display:block;width:47px;height:47px;flex:none;border:2px solid #e983aa;border-radius:50%;background:#fff0f6;font-size:22px;font-weight:800;color:#be547e}
.fh-profile-photo i{position:absolute;bottom:-3px;right:-3px;width:18px;height:18px;border-radius:50%;background:#df588d;color:white;font-style:normal;font-size:13px;display:grid;place-items:center;border:2px solid white}
.fh-daily-profile b{display:block;font-size:18px;line-height:1.4}.fh-daily-profile small{font-size:10px;color:#997584}.fh-profile-edit{margin-left:auto;font-size:11px;color:#977789}
.fh-icon.fh-joan{border-radius:16px;object-fit:contain;padding:1px;background:#fff4e9;box-shadow:0 3px 7px #73432118}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs .fh-icon.fh-joan{width:48px;height:48px}
body.fn-on.fn-phone #fn-tabs .fh-icon.fh-joan{width:35px;height:35px}

#fchat .fc-top b{display:flex;align-items:center;gap:10px}#fchat .fc-top b:before{content:'';display:block;width:38px;height:38px;flex:none;background:url('/fam/assets/joan-chat-sketch-260925.webp') center/contain no-repeat;border-radius:50%}

/* Dedicated family arcade; learning remains a separate destination. */
.fn-arcade-heading{margin:0 0 25px;color:#344651}.fn-arcade-heading>span{font-size:11px;letter-spacing:.14em;color:#9572b8;font-weight:800}.fn-arcade-heading h1{font-size:30px;margin:8px 0}.fn-arcade-heading p{font-size:15px;color:#78898a;margin:0}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs{overflow-y:auto}
body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button{min-height:86px;flex-shrink:0}
@media(max-height:720px) and (min-width:601px){body.fn-on.fmode-child:not(.fn-phone) #fn-tabs button{min-height:74px}}
@media(max-width:600px) and (orientation:portrait){body.fmode-child.fn-phone #fn-tabs button{min-width:0;padding-left:2px;padding-right:2px;font-size:9px;white-space:normal}}
