/* The two inscriptions occupy the same point at the centre of the Earth. */
body[data-member-live] .clock-planet-inscription {
  position:absolute;inset:0;z-index:3;pointer-events:none;
  display:grid;place-content:center;text-align:center;
  clip-path:circle(41% at 50% 50%);
}
body[data-member-live] .clock-planet-inscription[hidden] {display:none;}
.clock-planet-layer {
  grid-area:1/1;display:grid;justify-items:center;gap:4px;opacity:0;
  white-space:nowrap;text-shadow:0 1px 3px #030811,0 0 10px #03081199;
}
.clock-planet-amount {
  color:#f5faff;font:400 clamp(17px,3.5vmin,30px)/1.05 var(--pluritual-serif,Fraunces,Georgia,serif);
  font-variant-numeric:lining-nums tabular-nums;
}
.clock-planet-caption {
  color:#c5d9e6;font:500 clamp(9px,1.15vmin,11px)/1.2 var(--pluritual-sans,Arial,sans-serif);
  letter-spacing:.14em;text-transform:uppercase;
}
body[data-member-live] main.ritual-room.clock .clock-fallback-ready:not(.is-webgl-ready) .clock-earth-unavailable {
  display:block;inset:9.5%;border-radius:50%;overflow:hidden;text-indent:-999px;
  background:radial-gradient(circle at 28% 35%,transparent 12%,#03081565 47%,#02070cf2 100%),
    url("clock-earth-v003d.png") center / 108% 108% no-repeat;
  box-shadow:inset 2px 0 9px #a5dcfb66;
}

.wip-clock-share-dialog {
  position:fixed;inset:0;box-sizing:border-box;margin:auto;
  width:min(424px,calc(100% - 28px));max-height:calc(100% - 28px);
  padding:24px;border:1px solid #a9cde34d;border-radius:16px;
  background:#0a131d;color:#dfedf5;font:14px/1.4 Arial,sans-serif;
  box-shadow:0 18px 72px #000b;
}
.wip-clock-share-dialog::backdrop {background:#02060bb0;}
.wip-clock-share-dialog h2 {
  margin:0 36px 4px 0;color:#e6f3fb;font:400 28px/1.1 var(--pluritual-serif,Fraunces,Georgia,serif);
}
.wip-clock-share-dialog p {margin:0 0 15px;color:#b3cadb;}
.wip-clock-share-close {position:absolute;top:10px;right:10px;}
.wip-clock-share-dialog button {
  min-height:44px;border:1px solid #9cc7e24d;border-radius:8px;
  padding:7px 11px;background:#112231;color:#d7edf9;font:600 13px Arial,sans-serif;cursor:pointer;
}
.wip-clock-share-dialog button:is(:hover,:focus-visible) {border-color:#c0e6fc;}
.wip-clock-share-dialog button:focus-visible {outline:2px solid #c0e6fc;outline-offset:2px;}
.wip-clock-share-close button {width:44px;padding:0;border-color:transparent;background:transparent;font-size:22px;}
.wip-clock-share-copy {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px;}
.wip-clock-share-copy input {
  box-sizing:border-box;width:100%;min-height:44px;padding:8px;border:1px solid #9cc7e24d;
  border-radius:8px;background:#070e16;color:#d7edf9;font:13px Arial,sans-serif;
}
.wip-clock-share-dialog .wip-clock-share-copy button {background:#c6e9fa;color:#102130;}
.wip-clock-share-dialog .wip-clock-share-feedback {margin:6px 0 11px;min-height:1.4em;font-size:12px;}
.wip-clock-share-dialog fieldset {margin:0;padding:10px 0 0;border:0;border-top:1px solid #9cc7e233;min-width:0;}
.wip-clock-share-dialog legend {padding:0 6px 0 0;color:#9fb9ca;font-size:11px;}
.wip-clock-share-options {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;}
.wip-clock-share-options button {display:grid;justify-items:center;gap:5px;min-width:0;}
.wip-clock-share-options button[aria-pressed="true"] {border-color:#a7d7f4;background:#203e54;color:#f2fbff;}
.wip-clock-share-options svg {width:21px;height:21px;}
body[data-member-live] main.ritual-room.clock .clock-finale-buttons button.clock-save-imprint {
  width:min(100%,330px);min-height:58px;padding:10px 16px;gap:10px;border-radius:999px;
  background:#c8ebfc;border-color:#d8f3ff;color:#081622;
  font:800 15px/1.15 Arial,sans-serif;letter-spacing:.045em;box-shadow:0 0 24px #83d0f837;
}
body[data-member-live] main.ritual-room.clock .clock-finale-buttons button.clock-save-imprint:is(:hover,:focus-visible) {
  background:#e0f5ff;box-shadow:0 0 28px #83d0f86b;
}
body[data-member-live] main.ritual-room.clock .clock-finale .clock-save-imprint-seal {width:22px;height:22px;}

/* Confirmation sits over the bottom of the stage; it never resizes the globe. */
body[data-member-live] main.ritual-room.clock .clock-ritual-action:has(.wip-clock-warning) {
  position:static;z-index:auto;
}
.wip-clock-warning ~ .clock-give-time, .clock-ritual-action:has(.wip-clock-warning) > .clock-give-time {visibility:hidden;}
.wip-clock-warning {
  position:absolute;z-index:12;inset:auto auto 12px 50%;transform:translateX(-50%);
  box-sizing:border-box;width:min(390px,calc(100% - 12px));padding:15px 17px 14px;
  border:1px solid #a4cee953;border-radius:16px;background:linear-gradient(155deg,#122436,#070e18 62%);
  color:#d4e7f5;text-align:center;box-shadow:0 10px 38px #000a;pointer-events:auto;
  animation:wipClockReminder .22s ease-out both;
}
@keyframes wipClockReminder {from{opacity:0;translate:0 7px;}to{opacity:1;translate:0;}}
.wip-clock-warning h2 {
  margin:0 30px 3px;color:#e4f5ff;
  font:500 25px/1.1 var(--pluritual-serif,Fraunces,Georgia,serif);
}
.wip-clock-warning p {margin:0;color:#b9d0e0;font:12px/1.4 Arial,sans-serif;}
.wip-clock-warning-missing {display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:5px 7px;margin:11px 0;}
.wip-clock-warning-missing > span {color:#a8c4d9;font:10px/1.25 Arial,sans-serif;}
.wip-clock-warning ul {margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:4px;}
.wip-clock-warning li {
  border:1px solid #a4c8e327;border-radius:999px;padding:3px 7px;color:#c1d9e8;
  background:#90c9f10c;font:11px/1.1 Arial,sans-serif;text-transform:capitalize;
}
.wip-clock-warning-actions {display:grid;grid-template-columns:1fr 1fr;gap:7px;}
.wip-clock-warning-actions button,.wip-clock-warning-close {
  border:1px solid #a5d4f158;border-radius:8px;background:#a0d3f009;color:#d4eafb;
  cursor:pointer;font:700 12px/1.2 Arial,sans-serif;
}
.wip-clock-warning-actions button {min-height:44px;padding:5px;}
.wip-clock-warning-actions button:first-child {background:#c0e1f3;color:#102130;}
.wip-clock-warning-actions button:hover {filter:brightness(1.18);}
.wip-clock-warning button:focus-visible {outline:2px solid #b4e3fa;outline-offset:2px;}
.wip-clock-warning-close {position:absolute;right:9px;top:7px;width:36px;height:36px;font-size:20px;font-weight:400;border-color:transparent;}
@media(max-width:600px){
  .wip-clock-warning {bottom:8px;padding:12px 10px 10px;}
  .wip-clock-warning h2 {font-size:22px;}
}
@media(max-height:540px) and (min-width:601px){
  .wip-clock-warning {inset:auto 4px 6px auto;transform:none;width:min(345px,52%);}
}

/* Speech bubbles follow the stars in whichever direction has room. */
body[data-member-live] main.ritual-room.clock .clock-support-star {
  display:grid;place-items:center;box-sizing:border-box;
}
body[data-member-live] main.ritual-room.clock .clock-support-star .clock-star-tooltip {
  --clock-note-fill:#0a10176b;
  --clock-note-border:#c3e4f333;
  --clock-note-tail-x:50%;
  --clock-note-tail-y:100%;
  --clock-note-tail-angle:45deg;
  --clock-note-notch-position:center bottom;
  --clock-note-notch-size:16px 1px;
  box-sizing:border-box;width:var(--clock-note-width,150px);min-width:0;max-width:none;
  bottom:calc(50% + var(--clock-note-gap,24px));gap:6px;
  isolation:isolate;background:transparent;border-color:transparent;
}
body[data-member-live] main.ritual-room.clock .clock-star-tooltip .clock-star-message {
  color:#e3f1f9;font:400 14px/1.35 var(--pluritual-sans,Arial,sans-serif);
  overflow-wrap:anywhere;
}
body[data-member-live] main.ritual-room.clock .clock-star-tooltip .clock-star-heading {
  justify-content:flex-end;text-align:right;
}
/* Open the border at the base of the tail so the translucent fills meet. */
body[data-member-live] main.ritual-room.clock .clock-support-star .clock-star-tooltip::before,
body[data-member-live] main.ritual-room.clock .clock-support-star .clock-star-tooltip::after {
  content:'';position:absolute;z-index:-1;box-sizing:border-box;
  border:1px solid var(--clock-note-border);background:var(--clock-note-fill);
}
body[data-member-live] main.ritual-room.clock .clock-support-star .clock-star-tooltip::before {
  inset:-1px;border-radius:inherit;
  mask:linear-gradient(#000 0 0),
    linear-gradient(#000 0 0) var(--clock-note-notch-position)/var(--clock-note-notch-size) no-repeat;
  mask-composite:exclude;
}
body[data-member-live] main.ritual-room.clock .clock-support-star .clock-star-tooltip::after {
  inset:var(--clock-note-tail-y) auto auto var(--clock-note-tail-x);width:12px;height:12px;
  clip-path:polygon(100% 0,100% 100%,0 100%);
  transform:translate(-50%,-50%) rotate(var(--clock-note-tail-angle));
}
body[data-member-live] main.ritual-room.clock .clock-support-star.star-popup-below .clock-star-tooltip {
  top:calc(50% + var(--clock-note-gap,24px));bottom:auto;
  --clock-note-tail-y:0%;--clock-note-tail-angle:225deg;
  --clock-note-notch-position:center top;
}
body[data-member-live] main.ritual-room.clock .clock-support-star:is(.clock-note-left,.clock-note-right) .clock-star-tooltip {
  top:var(--clock-note-top);bottom:auto;transform:none;
  --clock-note-tail-y:calc(var(--clock-note-edge) - 1px);
  --clock-note-notch-size:1px 16px;
}
body[data-member-live] main.ritual-room.clock .clock-support-star.clock-note-left .clock-star-tooltip {
  left:auto;right:calc(50% + var(--clock-note-side-gap));
  --clock-note-tail-x:100%;--clock-note-tail-angle:-45deg;
  --clock-note-notch-position:right calc(var(--clock-note-edge) - 8px);
}
body[data-member-live] main.ritual-room.clock .clock-support-star.clock-note-right .clock-star-tooltip {
  left:calc(50% + var(--clock-note-side-gap));right:auto;
  --clock-note-tail-x:0%;--clock-note-tail-angle:135deg;
  --clock-note-notch-position:left calc(var(--clock-note-edge) - 8px);
}
body[data-member-live] main.ritual-room.clock .clock-support-star:is(:hover,:focus-visible) {z-index:8;}
body[data-member-live] main.ritual-room.clock .clock-ritual-panel:has(.wip-clock-warning) .clock-star-tooltip {visibility:hidden;opacity:0;}
@media(prefers-reduced-motion:reduce){
  .wip-clock-warning {animation:none;}
  body[data-member-live] button.wip-clock-share {transition:none;}
}