html #crm.active{width:100%!important;max-width:none!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
@media(min-width:601px){html #crm.active{position:fixed!important;inset:0!important;height:100dvh!important;max-height:none!important}}
@media(max-width:600px){html #crm.active{height:auto!important;min-height:100dvh!important}}
html #crm .uo-portal-nav{display:grid!important;grid-template-columns:minmax(0,1.5fr) minmax(0,1.5fr) 80px repeat(3,minmax(0,1fr));align-items:center;overflow:visible!important;padding:0 clamp(12px,6vw,110px)!important}
html #crm .uo-portal-nav button{min-width:0;padding-left:8px!important;padding-right:8px!important;height:50px}
html #crm .uo-portal-nav #uo-header-online{position:relative;display:block;align-self:start;justify-self:center;isolation:isolate;width:58px;height:76px;box-sizing:border-box;padding-top:29px;line-height:22px;margin:-8px 0 -18px!important;text-align:center;color:#f2dc9f!important;font-family:Georgia,serif;font-size:23px;font-weight:600;text-shadow:0 1px 3px #000;z-index:2;background:none;filter:drop-shadow(0 2px 3px #0007);text-decoration:none}
html #crm .uo-portal-nav #uo-header-online::before{content:'';position:absolute;inset:0;z-index:-1;background:url('/static/uo-online-crest-v1.webp') center/contain no-repeat;pointer-events:none}
html[data-uo-theme='night'] #crm #uo-header-online::before{filter:saturate(.45)}
html #crm #uo-header-online:focus-visible{outline:2px solid var(--g1);outline-offset:3px}
html #crm .sidebar .sb-nav .sb-item.active,html #crm .sidebar .sb-nav .sb-item.active:hover,html #crm .uo-portal-nav button.is-active,html #crm .uo-portal-nav button.is-active:hover{background:transparent!important;background-image:none!important;box-shadow:none!important;border-color:transparent!important;color:var(--text)!important}
html #crm .sidebar .sb-nav .sb-item.active::before,html #crm .sidebar .sb-nav .sb-item.active::after,html #crm .uo-portal-nav button.is-active::after{background:none!important;box-shadow:none!important;border-color:transparent!important}
html #crm .sidebar .sb-nav .sb-item.active .ic,html #crm .uo-portal-nav button.is-active .uo-sprite{filter:drop-shadow(0 0 5px #d5c29770)!important}
html[data-uo-theme='light'] #crm .sidebar .sb-nav .sb-item.active .ic{filter:drop-shadow(0 0 4px #82622265)!important}
@media(hover:hover) and (prefers-reduced-motion:no-preference){html #crm .sidebar .sb-nav .sb-item:hover .ic,html #crm .uo-portal-nav button:hover .uo-sprite{filter:drop-shadow(0 0 6px #d5c29770)!important;transform:scale(1.025)}}
@media(max-width:1000px){html #crm .uo-portal-nav{padding:0 8px!important;grid-template-columns:minmax(0,1.5fr) minmax(0,1.5fr) 66px repeat(3,minmax(0,1fr))}html #crm .uo-portal-nav button{font-size:12px}}
@media(max-width:600px){html #crm .uo-portal-nav{grid-template-columns:minmax(0,1.5fr) minmax(0,1.5fr) 48px repeat(3,minmax(0,1fr));padding:0 5px!important}html #crm .uo-portal-nav #uo-header-online{width:44px;height:62px;padding-top:23px;margin:-6px 0 -10px!important;font-size:19px;line-height:20px}html #crm .uo-portal-nav button{height:46px;font-size:0!important;padding:0!important}}
@media(max-width:600px){
html #crm .sidebar:not(.mini) .sb-nav .sb-item{flex-direction:row!important;justify-content:flex-start!important;align-items:center!important;gap:13px!important;min-height:54px!important;padding:7px 13px!important;text-align:left!important}
html #crm .sidebar:not(.mini) .sb-nav .sb-item .ic{width:36px!important;height:36px!important;flex:0 0 36px!important;margin:0!important}
html #crm .sidebar:not(.mini) .sb-nav .sb-item .uo-sprite{--uo-icon-size:36px!important;width:36px!important;height:36px!important}
html #crm .sidebar:not(.mini) .sb-nav .sb-item>span:not(.ic):not(.chat-unread-badge){font:14px/1.3 'Segoe UI',sans-serif!important;white-space:nowrap!important;text-align:left!important;max-width:none!important}
}

html #crm .uo-portal-nav button.is-active::before{filter:drop-shadow(0 0 5px #d5c29770)!important}
@media(max-width:600px){html #crm .uo-portal-nav button.is-active::before{filter:grayscale(1) drop-shadow(0 0 4px #d5c29770)!important}}
/* Restore the narrow, stationary surround; online belongs in the upper header. */
@media(min-width:601px){html #crm.active{inset:4px 20px!important;width:calc(100% - 40px)!important;height:calc(100dvh - 8px)!important;border:1px solid #526071!important;border-radius:3px!important}}
html #crm .uo-portal-nav{display:flex!important;justify-content:center!important;padding:0 14px!important;align-items:stretch!important}
html #crm .uo-portal-nav button{padding-left:clamp(12px,2vw,34px)!important;padding-right:clamp(12px,2vw,34px)!important}
html #crm #uo-online-slot{flex:1 1 auto;min-width:55px;display:flex;align-items:center;justify-content:center;height:100%;margin:0 8px}
@media(min-width:601px){html #crm #top-bar #tb-title{flex:0 0 150px;width:150px;max-width:150px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
html #crm #top-bar #uo-header-online{position:relative;display:block;isolation:isolate;width:47px;height:67px;box-sizing:border-box;padding-top:24px;line-height:22px;margin:0!important;text-align:center;color:#f2dc9f!important;font:600 23px/22px Georgia,serif;text-shadow:0 1px 3px #000;z-index:2;background:none;filter:drop-shadow(0 2px 3px #0007);text-decoration:none}
html #crm #top-bar #uo-header-online::before{content:'';position:absolute;inset:0;z-index:-1;background:url('/static/uo-online-crest-v1.webp') center/contain no-repeat;pointer-events:none}
@media(max-width:600px){html #crm .uo-portal-nav{padding:0 8px!important}html #crm .uo-portal-nav button{padding:0!important}html #crm #uo-online-slot{min-width:32px;flex:0 0 32px;margin:0 2px}html #crm #top-bar #uo-header-online{width:32px;height:47px;padding-top:16px;font-size:17px;line-height:19px}}
/* Keep the crest stationary; only its centered number scales with digit count. */
html #crm #top-bar #uo-header-online .uo-online-value{position:absolute;left:20%;right:20%;top:32%;height:34%;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-size:min(23px,calc(44px / var(--uo-online-digits,1)));line-height:1;font-variant-numeric:tabular-nums;letter-spacing:0}
@media(max-width:600px){html #crm #top-bar #uo-header-online .uo-online-value{font-size:min(17px,calc(30px / var(--uo-online-digits,1)))}}