/* Shared brand emblem and geometrically centred circular controls. */
.brand .mark{display:block!important;position:relative!important;flex:0 0 32px!important;width:32px!important;height:32px!important;min-width:32px!important;aspect-ratio:1!important;align-self:center;transform:none!important;border:0!important;border-radius:4px!important;background:transparent url('classic/assets/ui/round-flower-indigo-v1.webp') center/contain no-repeat!important;box-shadow:0 2px 3px #10262c77;font-size:0!important;line-height:0!important;letter-spacing:0!important;text-shadow:none!important}
/* Use strokes, not font glyph metrics, to centre every modal close cross. */
button:is(.close,.pbClose,.dialogClose){display:grid!important;place-items:center!important;box-sizing:border-box;aspect-ratio:1;flex-shrink:0;padding:0!important;line-height:0!important;font-size:0!important;letter-spacing:0!important;text-indent:0!important}
button:is(.close,.pbClose,.dialogClose)::before,button:is(.close,.pbClose,.dialogClose)::after{content:'';position:absolute;left:50%;top:50%;width:43%;height:2px;margin:0;background:currentColor;border-radius:2px;transform:translate(-50%,-50%) rotate(45deg);pointer-events:none}
button:is(.close,.pbClose,.dialogClose)::after{transform:translate(-50%,-50%) rotate(-45deg)}
button:is(.roundBtn,.gearBtn,.sound),.ringControls button,.turnControls button{display:grid;place-items:center;box-sizing:border-box;padding:0;line-height:1;aspect-ratio:1;flex-shrink:0}
@media(max-width:370px){.brand .mark{flex-basis:27px!important;width:27px!important;height:27px!important;min-width:27px!important}}

button.pbClose{position:relative}
