/* The studio's own menu for the choices over a session's box (pot-menu.js), and the clear glass of the Desk / Yacht pill. The menu is dark
   glass with a thin gold edge and the meander along its top, as the medallions are ringed; the open choice is gold with a small mark. */
.detail .work-chip select { pointer-events: none; }

.pot-menu {
  position: fixed; z-index: 2147483000; display: flex; flex-direction: column; gap: 1px; padding: 14px 6px 6px; overflow-y: auto; scrollbar-width: none;
  border-radius: 18px; border: 1px solid rgba(227, 179, 87, 0.38);
  background: linear-gradient(180deg, rgba(34, 25, 18, 0.8) 0%, rgba(17, 12, 9, 0.86) 100%);
  -webkit-backdrop-filter: blur(16px) saturate(1.4); backdrop-filter: blur(16px) saturate(1.4);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.42), 0 2px 8px rgba(0, 0, 0, 0.3);
  transform-origin: 50% 100%; animation: pot-menu-in 150ms cubic-bezier(0.16, 1, 0.3, 1);
}
.pot-menu::-webkit-scrollbar { display: none; }
.pot-menu:not(.up) { transform-origin: 50% 0; }
.pot-menu::before {
  content: ''; position: absolute; left: 14px; right: 14px; top: 4px; height: 6px; opacity: 0.8; pointer-events: none;
  background: var(--pot-key) repeat-x center / 10px 6px;
}
.pot-menu-head { padding: 8px 12px 3px; font-size: 10.5px; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(239, 227, 205, 0.5); }
.pot-menu-item {
  display: flex; align-items: center; gap: 9px; width: 100%; min-height: 38px; padding: 6px 12px 6px 10px; border: 0; border-radius: 12px;
  background: transparent; color: var(--pot-papyrus, #efe3cd); font: inherit; font-size: 14px; text-align: left; cursor: pointer;
}
.pot-menu-item::before {
  content: ''; flex: none; width: 7px; height: 7px; border-radius: 50%; background: transparent; box-shadow: none;
}
.pot-menu-item[aria-selected="true"] { color: var(--pot-gold, #e3b357); font-weight: 600; }
.pot-menu-item[aria-selected="true"]::before { background: var(--pot-gold, #e3b357); box-shadow: 0 0 8px rgba(227, 179, 87, 0.7); }
.pot-menu-item:hover, .pot-menu-item:focus-visible { background: rgba(227, 179, 87, 0.14); outline: none; }
.pot-menu-item:active { background: rgba(227, 179, 87, 0.24); }
.pot-menu-item:disabled { opacity: 0.4; cursor: default; }
@keyframes pot-menu-in { from { opacity: 0; transform: translateY(6px) scale(0.96); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .pot-menu { animation: none; } }

/* Desk / Yacht on a phone: the same clear glass as the pills over the box (no cream, no white wash). The page shows through; the side that
   is open has the same rim as the pills, a little stronger, and a bolder word. Over the yacht the letters are light with a soft shade so they read on the water. */
@media (max-width: 999px) {
  .tabs {
    background: transparent; border: 1px solid rgba(255, 255, 255, 0.3);
    -webkit-backdrop-filter: blur(1.5px) saturate(1.4); backdrop-filter: blur(1.5px) saturate(1.4);
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
  }
  .tab { color: var(--text); text-shadow: 0 0 6px rgba(255, 255, 255, 0.35); }
  .tab[aria-pressed="true"] { background: transparent; border-color: rgba(255, 255, 255, 0.6); color: var(--text); font-weight: 700; box-shadow: none; }
  html.yacht3d body.in-room .tabs { background: transparent; border-color: rgba(255, 255, 255, 0.3); box-shadow: 0 1px 2px rgba(0, 0, 0, 0.12); }
  html.yacht3d body.in-room .tab { color: rgba(255, 255, 255, 0.85); text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55); }
  html.yacht3d body.in-room .tab[aria-pressed="true"] { color: #fff; border-color: rgba(255, 255, 255, 0.6); }
}