/* Shared by the game and preview. The host owns placement and fade-out. */
.mnl-loader {
  --mnl-gold: #cfb27a;
  --mnl-paper: #e8e0cd;
  --mnl-muted: #a3b9b0;
  --mnl-background: #061113;
  --mnl-size: 146px;
  --mnl-font: "Yu Mincho", "Hiragino Mincho ProN", serif;
  display: grid;
  justify-items: center;
  align-content: center;
  color: var(--mnl-gold);
  text-align: center;
}
.mnl-loader .mnl-art { width: var(--mnl-size); height: var(--mnl-size); }
.mnl-loader .mnl-art svg { display: block; width: 100%; height: 100%; overflow: visible; }
.mnl-loader .mnl-label { margin: 23px 0 8px; color: var(--mnl-paper); font-family: var(--mnl-font); font-size: 21px; font-weight: 400; line-height: 1.5; letter-spacing: .12em; }
.mnl-loader .mnl-label-text { color: inherit; font: inherit; letter-spacing: inherit; }
.mnl-loader .mnl-detail { color: var(--mnl-muted); font-family: "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif; font-size: 11px; line-height: 1.8; letter-spacing: .16em; }
.mnl-loader [hidden] { display: none !important; }
.mnl-loader .mnl-dots { display: inline-block; margin-left: 2px; font-weight: inherit; letter-spacing: .08em; }
.mnl-loader .mnl-dots i { display: inline; width: auto; height: auto; margin: 0; padding: 0; border: 0; background: none; font-style: normal; animation: mnl-dot 1.8s ease-in-out infinite; }
.mnl-loader .mnl-dots i:nth-child(2) { animation-delay: .2s; }
.mnl-loader .mnl-dots i:nth-child(3) { animation-delay: .4s; }
.mnl-loader .mnl-clock-minute { transform-origin: 100px 62px; animation: mnl-minute 16s linear infinite; }
.mnl-loader .mnl-pendulum { transform-origin: 100px 105px; animation: mnl-swing 2.8s ease-in-out infinite; }
.mnl-loader .mnl-door-light { animation: mnl-door 4.8s ease-in-out infinite; opacity: .07; }
.mnl-loader .mnl-door-light-1 { animation-delay: 1.2s; }
.mnl-loader .mnl-door-light-2 { animation-delay: 2.4s; }
.mnl-loader .mnl-door-light-3 { animation-delay: 3.6s; }
.mnl-loader .mnl-search-glass { animation: mnl-search 3.6s ease-in-out infinite; }
.mnl-loader .mnl-clue-glint { animation: mnl-glint 3.6s ease-in-out infinite; }
@keyframes mnl-minute { to { transform: rotate(360deg); } }
@keyframes mnl-swing { 0%,100% { transform: rotate(-13deg); } 50% { transform: rotate(13deg); } }
@keyframes mnl-door { 0%,28%,100% { opacity: .07; } 10%,18% { opacity: 1; } }
@keyframes mnl-search { 0%,100% { transform: translate(-10px, 6px) rotate(-5deg); } 45%,60% { transform: translate(6px, -5px) rotate(3deg); } }
@keyframes mnl-glint { 0%,20%,85%,100% { opacity: .16; } 48%,60% { opacity: 1; } }
@keyframes mnl-dot { 0%,100% { opacity: .3; } 45% { opacity: 1; } }
.mnl-loader[data-mnl-paused="true"] *, .mnl-loader[data-mnl-paused="true"] *::before, .mnl-loader[data-mnl-paused="true"] *::after { animation-play-state: paused !important; }
.mnl-loader[data-mnl-motion="reduced"] * { animation: none !important; }
.mnl-loader[data-mnl-motion="reduced"] .mnl-door-light { opacity: .55; }
.mnl-loader[data-mnl-motion="reduced"] .mnl-clue-glint { opacity: .7; }
@media (prefers-reduced-motion: reduce) {
  .mnl-loader * { animation: none !important; }
  .mnl-loader .mnl-door-light { opacity: .55; }
  .mnl-loader .mnl-clue-glint { opacity: .7; }
}