/** 资源墙：多页轮播顶栏倒计时条（与翻页 interval 同周期） */
@keyframes pisell-resource-wall-page-countdown {
  0% {
    transform: scaleX(0);
  }
  100% {
    transform: scaleX(1);
  }
}

.pisell-resource-wall-page-countdown-bar {
  transform-origin: left center;
  animation-name: pisell-resource-wall-page-countdown;
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}

/**
 * 资源墙伪全屏：不调用 Fullscreen API。
 * 通过给 `body` 打标记，选择器固定 `.pisell-shell-frame-body` 铺满视口（width/height 均为 100%）。
 */
body.pisell-resource-wall-fixed-viewport {
  overflow: hidden !important;
}

body.pisell-resource-wall-fixed-viewport .pisell-shell-frame-body {
  position: fixed;
  inset: 0;
  z-index: 2000;
  padding: 0;
  margin: 0;
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  overflow: hidden;
}

/* 与视口根内联色一致，便于主题扩展时集中覆写（当前主色仍由 JS 注入） */
.pisell-resource-wall-shell {
  --pisell-rw-page-bg-light: #f5f7fb;
  --pisell-rw-page-bg-dark: #0f172a;
  --pisell-rw-header-bg-light: #ffffff;
  --pisell-rw-header-bg-dark: #1e293b;
}

/** 资源墙视口顶栏：桌面单行；窄屏允许日期与操作区分行 */
.pisell-resource-wall-viewport-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 24px;

  &__clock {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: -0.02em;
    min-width: 0;
  }

  &__actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    min-width: 0;
  }

  @media (max-width: 768px) {
    flex-wrap: wrap;
    align-items: flex-start;
    padding: 12px 16px;
    gap: 10px;

    &__clock {
      flex: 1 1 100%;
      width: 100%;
    }

    &__actions {
      flex: 1 1 100%;
      width: 100%;
      flex-wrap: wrap;
      justify-content: flex-start;
    }
  }
}