/* The header's round buttons as one row (Chris, 5 Nov: "the header buttons misalignment"). They had three sizes (36, 38 by 40, 40) and
   tops from 8 to 16 px, so the camera stood higher than the rest. Here every one is 40 by 40, centred on one line, with no margin of its own:
   full screen (Yacht only), reload, the meeting, Plan my time, his sessions. Loaded last, so it outranks the older rules in reload.css,
   front.css, desk-more.css, head-phone.css and bars.css. */
.top .yacht-full, .top .reload-top, .top .meet-btn, .top .plan-open, .top .mine-open, .top .mine-open.pinned, .top .mine-open.pinned.unplaced {
  box-sizing: border-box; flex: none; width: 40px; height: 40px; min-height: 0; margin-top: 0; margin-bottom: 0; align-self: center;
}
.top .reload-top, .top .meet-btn { display: grid; place-items: center; padding: 0; }
html.yacht3d body.in-room .top { align-items: center; }
html.yacht3d body.in-room .top .yacht-full, html.yacht3d body.in-room .top .reload-top, html.yacht3d body.in-room .top .meet-btn,
html.yacht3d body.in-room .top .plan-open, html.yacht3d body.in-room .top .mine-open,
html.yacht3d body.in-room .top .mine-open.pinned, html.yacht3d body.in-room .top .mine-open.pinned.unplaced { margin-top: 0; align-self: center; }
/* Over the Yacht the three glass buttons are one glass: the same ring, ground and blur. */
html.yacht3d body.in-room .top .reload-top, html.yacht3d body.in-room .top .meet-btn, html.yacht3d body.in-room .top .yacht-full {
  border: 1px solid rgba(255, 255, 255, 0.14); background: rgba(20, 18, 16, 0.42); color: rgba(239, 227, 205, 0.86); box-shadow: 0 4px 18px rgba(0, 0, 0, 0.32);
  -webkit-backdrop-filter: blur(12px) saturate(1.3); backdrop-filter: blur(12px) saturate(1.3);
}
html.yacht3d body.in-room .top .meet-btn.on { color: #1b1714; background: var(--gold); border-color: var(--gold); }
html.yacht3d body.in-room .top .yacht-full { justify-content: center; padding: 0; border-radius: 50%; }
/* Where the full-screen button shows its words (a wider screen), it is a pill of the same height. */
@media (min-width: 521px) { html.yacht3d body.in-room .top .yacht-full { width: auto; padding: 0 14px; border-radius: 999px; } }
