/* Keep wheel, touch and keyboard scrolling without native gray scrollbar chrome. */
html:has(:is(body[data-pluritual-wip="true"], body[data-member-live])), :is(body[data-pluritual-wip="true"], body[data-member-live]), :is(body[data-pluritual-wip="true"], body[data-member-live]) * { scrollbar-width: none; }
html:has(:is(body[data-pluritual-wip="true"], body[data-member-live]))::-webkit-scrollbar, :is(body[data-pluritual-wip="true"], body[data-member-live])::-webkit-scrollbar, :is(body[data-pluritual-wip="true"], body[data-member-live]) *::-webkit-scrollbar { display: none; width: 0; height: 0; }

/* Soft touch is shared in site/source/assets/pluritual-home-field-v024.css. */

/* Logo1: private Movie/Melody keep their colours and use the approved light-ink mask. */
:is(body[data-pluritual-wip="true"], body[data-member-live]) :is(main.ritual-room.movie, main.ritual-room.melody) .pluritual-header .account-seal {
  mask-image: url("pluritual-symbol-round-white-v024.svg?build=20261022-v024-logo1");
  -webkit-mask-image: url("pluritual-symbol-round-white-v024.svg?build=20261022-v024-logo1");
}

/* Live when available, Share, then My Imprint. */
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room.has-module-navigation > header.wip-module-header {
  grid-template-columns: minmax(0, 1fr) var(--account-height) var(--account-width);
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room.has-module-navigation > header.wip-module-header:has(> .live-site-utilities .live-work-access:not([hidden])) {
  grid-template-columns: minmax(0, 1fr) var(--account-height) var(--account-height) var(--account-width);
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main > header.pluritual-header > .wip-module-share {
  grid-column: -3;
  grid-row: 1;
  display: grid;
  place-items: center;
  box-sizing: border-box;
  width: var(--account-height);
  height: var(--account-height);
  margin: var(--account-offset) 0 0;
  padding: 0;
  border: 1px solid color-mix(in srgb, currentColor 28%, transparent);
  border-radius: 8px;
  background: color-mix(in srgb, currentColor 6%, transparent);
  color: var(--module-accent, inherit);
  cursor: pointer;
  pointer-events: auto;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) .pluritual-header > .wip-module-share:is(:hover, :focus-visible) {
  border-color: currentColor;
  background: color-mix(in srgb, currentColor 14%, transparent);
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) .pluritual-header > .wip-module-share:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}
.pluritual-header > .wip-module-share > svg {
  width: 20px;
  height: 20px;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room.has-module-navigation > header.pluritual-header.wip-module-header > .account-button {
  grid-column: -2;
  padding: 0;
  align-items: center;
  justify-content: center;
  flex-direction: row;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room > header.wip-module-header > .live-site-utilities {
  grid-column: 2;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room > header.wip-module-header > .live-site-utilities:has(.live-work-access[hidden]) {
  display: none;
}
/* The module help follows the title on the brand line. */
:is(body[data-pluritual-wip="true"], body[data-member-live]) .wip-module-header .wip-module-help {
  --help-target-size: 44px;
  --help-circle-size: 24px;
  position: relative;
  align-self: start;
  flex: 0 0 auto;
  margin: calc(var(--header-separator-top) + (var(--header-separator-height) - var(--help-target-size)) / 2) 0 0 -8px;
  color: inherit;
  pointer-events: auto;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room > header.wip-module-header .wip-module-help > .module-how-trigger {
  position: relative;
  width: var(--help-target-size);
  height: var(--help-target-size);
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: inherit;
  box-shadow: none;
  backdrop-filter: none;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room > header.wip-module-header .wip-module-help > .module-how-trigger::before {
  content: "";
  position: absolute;
  inset: 0;
  width: var(--help-circle-size);
  height: var(--help-circle-size);
  box-sizing: border-box;
  margin: auto;
  border: 1px solid color-mix(in srgb, currentColor 38%, transparent);
  border-radius: 50%;
  pointer-events: none;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room > header.wip-module-header .wip-module-help > .module-how-trigger:is(:hover, [aria-expanded="true"])::before {
  border-color: currentColor;
  background: color-mix(in srgb, currentColor 9%, transparent);
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room > header.wip-module-header .wip-module-help > .module-how-trigger > svg.help-question-icon {
  position: relative;
  width: 14px;
  height: 14px;
}
@media (max-width: 420px) {
  /* Keep help alongside the countdown when the three controls fill the top row. */
  :is(body[data-pluritual-wip="true"], body[data-member-live]) .wip-module-header:has(.live-work-access:not([hidden])) .wip-module-help {
    --help-target-size: 40px;
    position: absolute;
    top: 10px;
    left: max(12px, calc(94px - var(--brand-width)));
    margin: 0;
  }
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room > header.wip-module-header .wip-module-help.is-title-typing > .module-how-trigger {
  visibility: hidden;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) .wip-module-help-panel {
  --help-fill: var(--wip-help-surface, #172125);
  --help-edge: color-mix(in srgb, currentColor 28%, var(--help-fill));
  position: absolute;
  z-index: 2;
  top: 100%;
  box-sizing: border-box;
  width: min(17rem, calc(100vw - 24px));
  border: 1px solid var(--help-edge);
  border-radius: 12px;
  background: var(--help-fill);
  box-shadow: 0 5px 16px #0003;
  font: 400 .875rem/1.45 var(--pluritual-sans, Arial, sans-serif);
  letter-spacing: normal;
  white-space: normal;
  text-align: center;
  user-select: text;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) .wip-module-help-panel[hidden] { display: none; }
:is(body[data-pluritual-wip="true"], body[data-member-live]) .wip-module-help-panel::before {
  content: "";
  position: absolute;
  top: -1px;
  left: calc(var(--help-tip-x, 50%) - 1px);
  width: 9px;
  height: 9px;
  box-sizing: border-box;
  transform: translate(-50%, -50%) rotate(45deg);
  border-top: 1px solid var(--help-edge);
  border-left: 1px solid var(--help-edge);
  background: var(--help-fill);
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) .wip-module-help-content {
  display: grid;
  gap: .4rem;
  max-height: calc(100dvh - 75px);
  overflow-y: auto;
  padding: .85rem 1rem;
  box-sizing: border-box;
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) .wip-module-help-content > strong {
  font: 400 1.125rem/1.15 var(--pluritual-serif, Georgia, serif);
}
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room:is(.canvas, .journey) { --wip-help-surface: #f8efe0; }
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room.melody { --wip-help-surface: #2c2030; }
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room.movie { --wip-help-surface: #29231e; }
:is(body[data-pluritual-wip="true"], body[data-member-live]) main.ritual-room.clock { --wip-help-surface: #101c25; }

