/* Panda Arcade 3.10: Panda-first layout. The Panda, not the toolbars, is the hero. */
#screenHome{padding-top:8px!important}
#screenHome .p310-care-bar{
 margin:5px 12px 11px!important;padding:12px 12px 9px!important;
 background:linear-gradient(135deg,#ecf8ed,#f8fcf5)!important;
 border:1px solid #c8e2cc;border-radius:23px;box-shadow:0 10px 24px #1a513116;
 min-width:0;overflow:hidden
}
#screenHome .p310-bar-head{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:0 2px 8px}
#screenHome .p310-bar-head strong{font-size:15px;line-height:1.1;color:#204c37;letter-spacing:-.2px}
#screenHome .p310-bar-head small{font-size:10px;font-weight:700;color:#5a816e;text-align:right;line-height:1.2}
#screenHome #p310CareBar .quick-actions{
 display:flex!important;flex-wrap:nowrap!important;gap:9px!important;
 grid-template-columns:none!important;
 width:100%!important;max-width:100%!important;
 margin:0!important;padding:0 8px 5px 0!important;
 overflow-x:auto!important;overflow-y:hidden!important;
 scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;
 scroll-padding-left:1px;touch-action:pan-x!important;scrollbar-width:thin;
 scrollbar-color:#b4d0b9 transparent
}
#screenHome #p310CareBar .quick-actions .action-btn{
 display:flex!important;flex:0 0 77px!important;min-width:77px!important;max-width:77px!important;
 width:77px!important;height:77px!important;min-height:77px!important;
 flex-direction:column;justify-content:center;gap:4px!important;
 grid-column:auto!important;padding:5px 3px!important;
 border-radius:16px!important;scroll-snap-align:start;white-space:normal!important
}
#screenHome #p310CareBar .action-btn .icon{height:35px;display:flex;justify-content:center;align-items:center}
#screenHome #p310CareBar .action-btn .icon img{width:33px;height:33px;object-fit:contain}
#screenHome #p310CareBar .action-btn .label{font-size:11px!important;line-height:1.1!important;font-weight:850}
#screenHome #p310CareBar #p39-care-footer{
 margin:5px 0 0!important;padding:0!important;
 width:100%;max-width:none!important;min-height:0;
 display:flex!important;flex-direction:row!important;align-items:center!important;
 justify-content:space-between!important;gap:8px!important
}
#screenHome #p310CareBar #p39-chat{
 min-height:30px!important;padding:4px 10px!important;font-size:11px!important;
 white-space:nowrap;flex:0 0 auto;border-radius:999px
}
#screenHome #p310CareBar #p39-care-result{
 text-align:right;font-size:10px!important;line-height:1.3!important;
 margin:0!important;padding:0!important;min-width:0;flex:1;max-width:100%
}
#screenHome #petCard{
 margin:0 12px 12px!important;
 border-radius:27px!important;min-height:425px!important;
 padding:12px 13px 8px!important;overflow:hidden!important
}
#screenHome #petCard .room-top{position:relative;z-index:9;gap:8px}
#screenHome #petCard .level-pill,#screenHome #petCard .mood-pill{font-size:11px!important;padding:8px 10px!important}
#screenHome #petCard .panda-stage{
 min-height:365px!important;height:365px!important;
 padding:0!important;margin:0!important;display:grid!important;place-items:center!important
}
#screenHome #petCard #panda{
 width:min(290px,77vw)!important;height:325px!important;
 max-width:100%!important;max-height:325px!important
}
#screenHome #petCard #speech{
 position:absolute!important;z-index:13!important;
 top:62px!important;right:11px!important;left:auto!important;bottom:auto!important;
 width:auto!important;max-width:min(46%,215px)!important;
 margin:0!important;padding:9px 11px!important;
 font-size:11.5px!important;line-height:1.35!important;
 font-weight:650!important;text-align:left!important;
 border-radius:15px 15px 4px 15px!important;
 background:#154a38ee!important;color:#fffdf3!important;
 box-shadow:0 6px 19px #0d342342!important;
 pointer-events:none!important
}
#screenHome #petCard #speech::after{
 top:100%!important;bottom:auto!important;left:auto!important;right:20px!important;
 border-width:8px 8px 0!important;
 border-color:#154a38 transparent transparent!important
}
#screenHome .p310-shared{
 margin:0 12px 12px!important;min-width:0;
 border:1px solid #cce3d0;border-radius:20px;
 background:linear-gradient(160deg,#f4faf2,#eaf5eb);
 box-shadow:0 9px 22px #153a2310;overflow:hidden
}
#screenHome .p310-shared>summary{
 list-style:none;cursor:pointer;
 display:flex;align-items:center;gap:8px;justify-content:space-between;
 padding:13px 15px;min-height:61px;touch-action:manipulation
}
#screenHome .p310-shared>summary::-webkit-details-marker{display:none}
#screenHome .p310-shared>summary>span:first-child{display:flex;flex-direction:column;gap:3px;min-width:0}
#screenHome .p310-shared>summary b{font-size:14px;color:#234f3b}
#screenHome .p310-shared>summary small{font-size:11px;color:#65806f}
#screenHome .p310-shared-count{font-size:13px;font-weight:900;color:#2b644d;background:#e0eddf;padding:6px 12px;border-radius:999px}
#screenHome .p310-chevron{font-size:21px;color:#4d8064;transition:transform .2s}
#screenHome .p310-shared[open] .p310-chevron{transform:rotate(180deg)}
#screenHome #p310Shared #p124CarePanel{
 position:static!important;z-index:auto!important;display:block!important;
 margin:0!important;border-radius:0!important;
 border:0!important;border-top:1px solid #d0e4d6!important;
 box-shadow:none!important;background:transparent!important;
 padding:10px 13px 13px!important;overflow:visible!important
}
#screenHome #p310Shared .p124-care-top{
 padding:0!important;margin:0 0 8px!important
}
#screenHome #p310Shared .p124-care-top strong{font-size:12px!important}
#screenHome #p310Shared .p124-care-top [data-left]{font-size:10px!important;line-height:1.2!important}
#screenHome #p310Shared .p124-care-actions{
 display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
 gap:9px!important;overflow:visible!important;max-width:100%!important
}
#screenHome #p310Shared .p124-care-actions>button{
 min-width:0!important;max-width:100%!important;width:100%!important;
 min-height:89px!important;flex:1!important;font-size:11px!important
}
#screenHome #p310Shared .p124-room-collectibles{margin-top:8px!important}
#screenHome #p310Shared .p124-care-feedback{font-size:11px!important;line-height:1.35!important;margin-top:7px!important}
#screenHome #p310Shared .p126-hint,#screenHome #p310Shared .p39-quality-label{display:none!important}
#screenHome .pet-card + .p310-shared{margin-top:0!important}
@media(max-width:360px){
 #screenHome #p310CareBar .quick-actions{display:flex!important;grid-template-columns:none!important}
 #screenHome #p310CareBar .quick-actions .action-btn{grid-column:auto!important;flex:0 0 73px!important;min-width:73px!important;max-width:73px!important}
 #screenHome #petCard #panda{width:min(258px,79vw)!important;height:303px!important}
 #screenHome #petCard .panda-stage{height:343px!important;min-height:343px!important}
 #screenHome #petCard{min-height:395px!important}
 #screenHome #petCard #speech{font-size:10.8px!important;top:61px!important;max-width:45%!important;padding:8px!important}
 #screenHome .p310-bar-head small{font-size:9px!important}
}
@media(prefers-reduced-motion:reduce){#screenHome .p310-shared .p310-chevron{transition:none}}

/* Never cover the Panda's face with the speech bubble. Keep it near her feet. */
#screenHome #petCard #speech{
 top:auto!important;bottom:13px!important;
 left:50%!important;right:auto!important;
 width:calc(100% - 26px)!important;max-width:calc(100% - 26px)!important;
 padding:9px 12px!important;line-height:1.35!important;
 border-radius:17px!important;
 transform:translateX(-50%)!important;text-align:center!important;
 font-size:11px!important;max-height:82px;overflow:auto;
 background:rgba(22,74,54,.96)!important
}
#screenHome #petCard #speech::after{display:none!important}
#screenHome #petCard #speech.speech-hidden{transform:translateX(-50%) translateY(-6px)!important}
@media(max-width:360px){
 #backBtn{display:flex!important;align-items:center!important;justify-content:center!important;
  font-size:20px!important;line-height:1!important;color:#fff!important;
  width:42px!important;min-width:42px!important;max-width:42px!important;
  padding:0!important;overflow:hidden!important;white-space:nowrap!important}
 #backBtn::before{content:none!important;display:none!important}
 #screenHome #petCard #speech{font-size:10.8px!important;max-height:81px!important}
}
/* Keep short speech visible ABOVE the bottom navigation, below Panda's face. */
#screenHome #petCard #speech{bottom:111px!important}
@media(max-width:360px){#screenHome #petCard #speech{bottom:117px!important}}
/* Old room-caption repeats the live speech bubble and peeks out under the bottom navigation. */
#screenHome #p124RoomCaption{display:none!important}
