html {
  overflow: hidden;
  background-color: #000;
}

body {
  background-color: rgb(173 170 207);
  width: 100vw;
  height: 100vh;
  bottom: 0;
  margin: 0;
  font-size: 0;
  line-height: 1;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans',
    'Droid Sans', 'Helvetica Neue', sans-serif;
  /* -webkit-font-smoothing: antialiased; */
  -moz-osx-font-smoothing: grayscale;
  overflow: hidden;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
}

*:focus {
  outline: none;
}

iframe {
  width: 100vw;
  height: 100vh;
  border: 0;
  position: absolute;
  top: 0;
  left: 0;
  background-color: #000;
}

/* loading */
#pc-root {
  background-color: rgb(31, 30, 46);
  width: 100vw;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
}

.loading-svg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}

.loading-svg img {
  width: 42px;
  animation: rotate 1s linear 0s infinite;
}

@keyframes rotate {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
/* loading */

/* status */
#status-warp {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

#status-warp.loading,
#status-warp.download,
#status-warp.failed,
#status-warp.loading .loading-svg,
#status-warp.download .progress-main,
#status-warp.failed .msg-text,
#status-warp.failed .try-again {
  display: block;
}

#status-warp.download .loading-svg,
#status-warp.download .try-again,
#status-warp.loading .msg-text,
#status-warp.failed .loading-svg,
#status-warp.failed .progress-main {
  display: none;
}

.cocos-canvas-wrapper {
  width: 100vw;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

/* progress */
.progress-main {
  position: relative;
  margin-top: 8px;
  width: 240px;
  height: 10px;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 5px;
  overflow: hidden;
  display: none;
}

.progress-main .progress-bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 10px;
  background-color: #1dc5ff;
  border-radius: 5px;
  transition: width 0.1s;
}

.progress-main .progress-bar .move {
  animation: move 1s linear infinite;
}

@keyframes move {
  from {
    transform: translateX(-100%);
  }
  to {
    transform: translateX(240px);
  }
}

/* progress */

/* try-again */
.msg-text {
  color: #fff;
  font-size: 14px;
  line-height: 1;
}

.try-again:active,
.audio-tips .tip-btn:active {
  background-color: #1585ab;
}

.try-again,
.audio-tips .tip-btn {
  width: 120px;
  margin: 10px auto 0;
  display: none;
  height: 36px;
  border-radius: 18px;
  text-align: center;
  line-height: 36px;
  background-color: #1dc5ff;
  font-size: 16px;
  color: #fff;
  cursor: pointer;
}
/* try-again */

/* pagination */
.pagination-prev,
.pagination-next,
.pagination-next-step,
.pagination-prev-step,
.catalog {
  cursor: pointer;
  line-height: 0;
  font-size: 22px;
  display: flex;
  width: 36px;
  height: 36px;
  /* margin: 0 5px; */
  align-items: center;
  justify-content: center;
}

.pagination-prev:active,
.pagination-next:active,
.pagination-next-step:active,
.pagination-prev-step:active,
.catalog:active {
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 4px;
}

.pagination-container {
  padding: 0 5px;
  user-select: none;
  position: fixed;
  bottom: 0;
  z-index: 5;
  left: 50%;
  right: 50%;
  transform: translate(-50%, -50%);
  width: max-content;
  height: 44px;
  display: none;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.5);
  border-radius: 8px;
}
.pagination-container.ultra {
  transform: translate(0, 0);
  left: 12px;
  right: auto;
  bottom: 10px;
  visibility: hidden;
}
.pagination-container.ultra .catalog-list {
  left: 0;
  right: auto;
  visibility: visible;
}
.pagination-middle {
  white-space: nowrap;
  color: #fff;
  text-align: center;
  font-size: 12px;
}

.pagination-not-allow {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

.catalog-list {
  position: absolute;
  z-index: 9999;
  bottom: 0;
  right: 100%;
  margin: 0;
  padding: 0;
  user-select: none;
  background-color: #1f1e2e;
  list-style: none;
  border-radius: 8px;
  max-height: 90vh;
  overflow: scroll;
}

.catalog-list::-webkit-scrollbar {
  width: 0;
}

.catalog-list li {
  margin: 10px 0;
  padding: 0 10px;
  border-radius: 3px;
  cursor: pointer;
  transition: all 0.3s;
}

.catalog-list li.selected {
  /* background-color: #fff; */
  /* margin-bottom: 10px; */
  background: #6b6b6b;
}

.catalog-list .title {
  display: block;
  word-wrap: break-word;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.65);
  font-size: 12px;
  /* line-height: 1.5715; */
  width: 160px;
  pointer-events: none;
}

.catalog-list img {
  background-color: rgb(31, 30, 46);
  width: 160px;
  height: 90px;
  border-radius: 3px;
  margin-top: 5px;
  pointer-events: none;
  object-fit: contain;
}

.page img {
  width: 22px;
  height: 22px;
}

.catalog img {
  width: 16px;
  height: 16px;
}

.transform180 {
  transform: rotate(180deg);
}

.marker {
  width: 100vw;
  height: 100vh;
  background-color: transparent;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
  user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
}
/* pagination */

.teaching-guide {
  padding: 0;
  margin: 0;
  width: 80%;
  height: 8px;
  position: absolute;
  left: 50%;
  top: 12px;
  transform: translateX(-50%);
  z-index: 9999;
  align-items: center;
  background-color: #cdc8cb;
  border-radius: 4px;
}

.teaching-guide::before {
  pointer-events: none;
  content: '';
  width: 100vw;
  height: 50px;
  position: absolute;
  top: -12px;
  left: -12.5%;
  background-image: linear-gradient(rgba(0, 0, 0, 0.4), transparent);
}
.sections-wrap {
  display: flex;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  overflow: hidden;
}
.teaching-guide .slide {
  height: 100%;
  background-color: #ff82c7;
}
.teaching-guide .slide:not(:first-child) {
  margin-left: 2px;
}

.teaching-guide .section {
  height: 8px;
  transition: all 0.3s;
  position: relative;
  border-radius: 6px;
  border-width: 2px;
  border-style: solid;
  margin-right: 2px;

  background-color: rgba(212, 212, 212, 0.7);
  border-color: rgba(255, 255, 255, 0.7);
}

.teaching-guide .section:nth-last-child(3) {
  margin-right: 0;
}

.teaching-guide .section.active {
  background-color: #ff82c7;
  border-color: #db64ad;
}

.teaching-guide .section:hover {
  cursor: pointer;
  background-color: #d4d4d4;
  border-color: #fff;
}

.teaching-guide .section:hover.active {
  background-color: #ff82c7;
  border-color: #ffe1f2;
}

.teaching-guide .section:hover::before,
.teaching-guide .time::before {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 10px;

  width: 32px;
  height: 8px;
  background-color: rgba(0, 0, 0, 0.85);
  clip-path: path(
    'M 6.343145750507619 8 A 4 4 0 0 0 9.17157287525381 6.82842712474619 L 14.585786437626904 1.414213562373095 A 2 2 0 0 1 17.414213562373096 1.414213562373095 L 22.82842712474619 6.82842712474619 A 4 4 0 0 0 25.65685424949238 8 Z'
  );
  content: '';
}

.teaching-guide .time,
.teaching-guide .section:hover::after {
  content: attr(name);
  width: max-content;
  padding: 6px 8px;
  color: #fff;
  font-size: 14px;
  text-align: start;
  text-decoration: none;
  word-wrap: break-word;
  background-color: rgba(0, 0, 0, 0.85);
  border-radius: 6px;
  box-shadow: 0 6px 16px 0 rgb(0 0 0 / 8%), 0 3px 6px -4px rgb(0 0 0 / 12%), 0 9px 28px 8px rgb(0 0 0 / 5%);

  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 18px;
}

.teaching-guide .time {
  display: none;
  top: 36px;
}
.teaching-guide .time::before {
  top: -8px;
}

.teaching-guide .range {
  height: 6px;
  width: 100%;
  border-radius: 8px;
  margin: 0;
  padding: 0;
  pointer-events: none;

  position: absolute;
  top: 2px;
  left: 0;
}

.teaching-guide .time-target:hover .time {
  display: block;
}

.teaching-guide .range {
  position: absolute;
  left: -12px;
  top: -9px;
  height: 30px;
  width: 25px;
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEsAAABaCAYAAADwxKvUAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA4RpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDYuMC1jMDA2IDc5LmRhYmFjYmIsIDIwMjEvMDQvMTQtMDA6Mzk6NDQgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6N2FkZWJhZmItNzc4My00OTJiLTkwNmUtOGEyZDMwNWFjNWNiIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjEwRDMwNDYwOEQ5RDExRUQ4NkZDQzhDRDI0NTUyMTU2IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjEwRDMwNDVGOEQ5RDExRUQ4NkZDQzhDRDI0NTUyMTU2IiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCAyMS4yIChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MWE1ZDhiMTAtOTVhYy00ODc0LWI3YWEtZDA0NWFhY2Q1YzE1IiBzdFJlZjpkb2N1bWVudElEPSJhZG9iZTpkb2NpZDpwaG90b3Nob3A6NjI5Mzk5NDktNGFhZi0xMjQwLThmOWQt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');
  background-size: contain;
  pointer-events: auto;
  background-repeat: no-repeat;
}

.teaching-guide .time-target {
  opacity: 0.72;
}

.toast {
  position: absolute;
  left: 50%;
  top: -100px;
  transform: translateX(-50%);
  padding: 9px 12px;
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 6px 16px 0 rgb(0 0 0 / 8%), 0 3px 6px -4px rgb(0 0 0 / 12%), 0 9px 28px 8px rgb(0 0 0 / 5%);
  pointer-events: all;
  transition: all 0.3s ease-in-out;
  opacity: 0;
  z-index: 9999;
  font-size: 14px;
}

.toast.show {
  opacity: 1;
  top: 15px;
}

.switch-scene {
  position: absolute;
  top: 58px;
  z-index: 99999;
  width: max-content;
  height: max-content;
  font-size: 14px;
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;
}

.switch-scene-btn {
  border-radius: 50%;
  width: 26px;
  height: 26px;
  line-height: 26px;
  background: rgba(0, 0, 0, 0.6);
  text-align: center;
  margin-bottom: 10px;
  color: rgba(255, 255, 255, 0.9);
  font-weight: bold;
}

.switch-scene {
  left: 0;
  transition: all 0.3s;
  width: 26px;
  height: 26px;
  overflow: hidden;
}

.switch-scene:hover {
  left: 2px;
  width: 125px;
  height: auto;
  background: rgba(0, 0, 0, 0.6);
}

.switch-scene-list span {
  width: 120px;
  display: block;
  margin: 6px 4px;
  color: rgba(255, 255, 255, 0.8);
  cursor: pointer;
}

.switch-scene-list span::before {
  content: attr(data-name);
}

#Cocos2dGameContainer {
  position: relative;
  z-index: 1;
}

#Cocos2dGameContainer canvas {
  overflow: hidden;
  cursor: url('cursor/finger.cur'), auto;
}

/* #Cocos2dGameContainer.default canvas {
  cursor: url('cursor/finger.cur'), auto;
} */

#Cocos2dGameContainer.move canvas {
  cursor: url('cursor/move.cur') 12 2, auto;
}

.cursor {
  position: absolute;
  top: -15px;
  left: -15px;
  width: 38px;
  height: 38px;
  pointer-events: none;
  z-index: 9999;
  transition: transform 0.3s;
  background-image: url('icon/cursor.svg');
  background-size: contain;
  background-repeat: no-repeat;
  display: none;
  transform: translateX(-100px) translateY(-100px);
}

.cursor[data-name]::before {
  content: attr(data-name);
  background: rgba(0, 0, 0, 0.65);
  border: 1px solid #4de37f;
  box-shadow: 0px 2px 4px 0px;
  white-space: nowrap; /*文本不换行*/
  position: absolute;
  bottom: 0px;
  left: 38px;
  border-radius: 4px;
  max-width: 83px;
  padding: 0 10px 0 10px;
  height: 22px;
  text-align: center;
  font-size: 12px;
  color: #4de37f;
  text-overflow: ellipsis;
  line-height: 22px;
  overflow: hidden;
}

.cursor.default {
  background-image: url('icon/cursor.svg');
}

.cursor.move {
  background-image: url('icon/move.svg');
  top: -8px;
  left: -22px;
}
.pagination-book-container {
  display: none;
  /* align-items: end; */
  user-select: none;
  position: absolute;
  bottom: 0;
  z-index: 5;
  justify-content: space-between;
  width: 100%;
  padding: 10px;
  box-sizing: border-box;
}
.pagination-book-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: #7f6bff;
  border-radius: 8px;
  padding: 8px;
  box-sizing: border-box;
  cursor: pointer;
}
.pagination-book-btn.pagination-not-allow {
  visibility: hidden;
}
.pagination-book-img {
  width: 100% !important;
  height: 100% !important;
}
.pagination-book-container .pagination-book-middle {
  color: #000;
  text-align: center;
  border-radius: 3px;
  position: absolute;
  bottom: 15px;
  left: 50%;
  transform: translate(-50%, 0);
}

.boot {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 20px;
  z-index: 999;
  font-size: 12px;
  color: #6b6b6b;
}
.boot .boot-msg-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

#teaching-tips {
  position: absolute;
  left: 0;
  top: 20px;
  z-index: 999;
  padding: 30px 6px 0 6px;
}
.time-tips-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.tips-content {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  padding-bottom: 10px;
}
.teaching-tips-arrow {
  width: 60px;
  height: 40px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
}
.teaching-tips-arrow.fast {
  background-image: url('icon/arrow_fast.png');
}
.teaching-tips-arrow.slow {
  background-image: url('icon/arrow_slow.png');
}
.teaching-tips-text {
  padding-left: 6px;
  font-size: 16px;
}
.teaching-tips-close {
  position: absolute;
  right: 4px;
  bottom: 4px;
  width: 20px;
  height: 20px;
  background-image: url('icon/error.png');
  background-size: contain;
  background-repeat: no-repeat;
  cursor: pointer;
  transition: all 0.3s;
}

.teaching-tips-close:hover {
  transform: scale(1.2);
}
.audio-tips {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 999;
  padding: 30px 6px 0 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  width: 100vw;
  height: 100vh;
  background-color: rgb(31, 30, 46);
}

.audio-tips .tip-text {
  padding-bottom: 20px;
  color: #fff;
  font-size: 14px;
  line-height: 1.2;
}

.audio-tips .tip-btn {
  display: block;
}