/* Floating mobile navigation, matching the reference's pill and menu grid. */
@media(max-width:760px){
 body.authenticated{padding-bottom:calc(104px + env(safe-area-inset-bottom,0px))}
 .mobile-nav{display:flex;align-items:center;justify-content:space-around;gap:4px;left:max(14px,env(safe-area-inset-left,0px));right:max(14px,env(safe-area-inset-right,0px));bottom:calc(12px + env(safe-area-inset-bottom,0px));width:auto;max-width:540px;margin:0 auto;padding:8px 10px;min-height:68px;border:1px solid #e2ebf1;border-radius:999px;background:rgba(255,255,255,.97);box-shadow:0 8px 28px #315e7914;overflow:visible;backdrop-filter:blur(18px)}
 .mobile-nav button,.mobile-nav button.mobile-compose{display:flex;flex:1 1 0;flex-direction:row;align-items:center;justify-content:center;gap:8px;min-width:44px;width:auto;min-height:50px;padding:10px 8px;margin:0;border:0;border-radius:999px;background:transparent;color:#8396a3;box-shadow:none;font-size:12px;font-weight:500;white-space:nowrap}
 .mobile-nav button.active,.mobile-nav button.mobile-compose.active{flex:1.75 1 0;color:#227dab;background:#e4f3fc;font-weight:500}
 .mobile-nav button.mobile-menu-toggle:not(.active){flex:1.45 1 0}
 .mobile-nav svg{width:23px;height:23px;flex:0 0 23px;padding:0;stroke-width:1.65}
 .mobile-nav button.active svg{background:transparent;border-radius:0}
 .mobile-nav button span{display:none;font-size:12px;line-height:1.4;letter-spacing:-.2px}
 .mobile-nav button.active span,.mobile-nav button.mobile-menu-toggle span{display:inline}
 .mobile-nav button:hover{background:#f1f8fc}
 .mobile-nav button.active:hover{background:#ddf0fc}
 .mobile-nav button:focus-visible{outline:3px solid #67b8e7;outline-offset:2px}
 #toast{bottom:calc(100px + env(safe-area-inset-bottom,0px))}
 dialog.mobile-menu-dialog{position:fixed;inset:0;width:calc(100% - 28px);max-width:520px;height:fit-content;max-height:calc(100dvh - 48px - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px));margin:auto;padding:25px 22px 22px;border-radius:26px;border:1px solid #e4edf3;box-shadow:0 24px 70px #25435830}
 .mobile-menu-dialog::backdrop{background:#26424c66;backdrop-filter:blur(4px)}
 .mobile-menu-dialog h2{font-size:21px;font-weight:600;line-height:1.4;margin:2px 38px 12px 0;color:#243f53;letter-spacing:-.5px}
 .mobile-menu-dialog .close{width:40px;height:40px;min-width:40px;min-height:40px;border-radius:12px;background:#f5f9fc;margin:-5px -4px 0 0;color:#8295a2}
 .mobile-menu-intro{font-size:13px;color:#8196a5;line-height:1.7;margin:0 0 16px}
 .mobile-menu-dialog .mobile-menu-profile{padding:0 0 16px;margin:0;border-bottom:1px solid #edf2f6;gap:10px}
 .mobile-menu-dialog .mobile-menu-profile .avatar{width:34px;height:34px;border-radius:12px;font-size:12px}
 .mobile-menu-dialog .mobile-menu-profile strong{font-size:13px;font-weight:500}
 .mobile-menu-dialog .mobile-menu-profile small{font-size:10px}
 .mobile-menu-dialog .mobile-menu-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:17px}
 .mobile-menu-dialog .mobile-menu-links button{display:flex;align-items:center;justify-content:flex-start;gap:11px;padding:16px 13px;min-width:0;min-height:75px;border:0;border-radius:17px;background:#f4f8fb;color:#627e90;font-size:12px;font-weight:400;line-height:1.65;text-align:left}
 .mobile-menu-dialog .mobile-menu-links button svg{width:23px;height:23px;flex:0 0 23px;stroke-width:1.6}
 .mobile-menu-dialog .mobile-menu-links button span{color:inherit;overflow-wrap:anywhere}
 .mobile-menu-dialog .mobile-menu-links button.current{background:#e2f2fc;color:#237fab;font-weight:600}
 .mobile-menu-dialog .mobile-menu-links button:hover{background:#eaf4fa}
 .mobile-menu-dialog .mobile-menu-links .mobile-logout{grid-column:1/-1;justify-content:space-between;min-height:48px;margin-top:7px;background:#fff6f1;color:#a17157;padding:12px 16px}
}
@media(max-width:360px){
 .mobile-nav{left:10px;right:10px;padding:7px;gap:2px}
 .mobile-nav button,.mobile-nav button.mobile-compose{gap:5px;padding:10px 5px}
 .mobile-nav button span{font-size:10px}
 .mobile-nav svg{width:21px;height:21px;flex-basis:21px}
 dialog.mobile-menu-dialog{padding:23px 17px 18px}
 .mobile-menu-dialog .mobile-menu-links button{font-size:11px;padding:13px 10px;gap:8px}
}
