/* ==========================================================================
   download-second.css · 下载模板页 style_2 模板（second）
   对应源码：ptgame/app/src/download/comp/second.vue <style scoped>
   注：ion-toolbar/ion-content 的 --background CSS 变量转写为 background 直接属性
       （原生 div 等价物无 shadow var 机制）；scoped 规则以根元素 data-dw-scope="second" 为作用域
       （对应 Vue scoped 的 data-v 属性机制）；Tailwind 工具类为全局规则（与源码 Tailwind 全局一致）。
   ========================================================================== */

/* ---- 源码 scoped 规则（data-dw-scope 为 Vue data-v 等价钩子） ---- */
[data-dw-scope='second'] .ion-toolbar {
  background: #000;
  margin-top: .75rem;
  padding-bottom: .75rem;
  padding-left: .625rem;
  padding-right: .625rem;
}

.ion-content[data-dw-scope='second'] {
  background: #000;
}

[data-dw-scope='second'] .introduct {
  width: 16.875rem;
}

[data-dw-scope='second'] div.star {
  background: url('/dw/star.png') no-repeat center center / cover;
}

[data-dw-scope='second'] div.bell {
  background: url('/dw/bell.png') no-repeat center center / cover;
}

[data-dw-scope='second'] div.shiny {
  position: relative;
  overflow: hidden;
  border-radius: 8px;
}

[data-dw-scope='second'] div.shiny > div.btn {
  width: 100%;
  padding: 10px 8px;
  background: #01875f;
  color: white;
  cursor: pointer;
}

[data-dw-scope='second'] div.shiny::before {
  content: '';
  animation: shiny 6s ease-in-out infinite;
  background: white;
  display: inline-block;
  height: 100%;
  left: 0;
  position: absolute;
  top: -180px;
  width: 30px;
}

@keyframes shiny {
  0% {
    opacity: 0;
    transform: scale(0) rotate(45deg);
  }

  80% {
    opacity: 0.5;
    transform: scale(0) rotate(45deg);
  }

  81% {
    opacity: 1;
    transform: scale(4) rotate(45deg);
  }

  100% {
    opacity: 0;
    transform: scale(50) rotate(45deg);
  }
}

/* ---- Tailwind 工具类等价规则（全局，与源码 Tailwind 一致） ---- */
.h-10 { height: 2.5rem; }
.text-xs { font-size: .75rem; line-height: 1rem; }
.font-bold { font-weight: 700; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-\[\.5rem\] { font-size: .5rem; }
.text-gray-500 { color: #6b7280; }
.mt-3 { margin-top: .75rem; }
.px-2\.5 { padding-left: .625rem; padding-right: .625rem; }
.rounded-\[\.625rem\] { border-radius: .625rem; }
.overflow-hidden { overflow: hidden; }
.h-48 { height: 12rem; }
.object-fill { object-fit: fill; }
.flex { display: flex; }
.items-center { align-items: center; }
.bg-\[\#161D16\] { background-color: #161D16; }
.mt-6 { margin-top: 1.5rem; }
.pl-2\.5 { padding-left: .625rem; }
.py-1\.5 { padding-top: .375rem; padding-bottom: .375rem; }
.h-4 { height: 1rem; }
.w-4 { width: 1rem; }
.mr-2 { margin-right: .5rem; }
.flex-1 { flex: 1 1 0%; }
.justify-center { justify-content: center; }
.text-\[\#5A985A\] { color: #5A985A; }
.leading-none { line-height: 1; }
.py-7 { padding-top: 1.75rem; padding-bottom: 1.75rem; }
.text-sm { font-size: .875rem; line-height: 1.25rem; }
.flex-col { flex-direction: column; }
.mx-2 { margin-left: .5rem; margin-right: .5rem; }
.text-\[\.625rem\] { font-size: .625rem; }
.mx-2\.5 { margin-left: .625rem; margin-right: .625rem; }
.rounded-md { border-radius: .375rem; }
.p-2\.5 { padding: .625rem; }
.mt-1\.5 { margin-top: .375rem; }
.mr-2\.5 { margin-right: .625rem; }
.h-20 { height: 5rem; }
.my-1\.5 { margin-top: .375rem; margin-bottom: .375rem; }
.h-2\.5 { height: .625rem; }
.w-\[4\.25rem\] { width: 4.25rem; }
.text-\[\#FFCC4A\] { color: #FFCC4A; }
.text-base { font-size: 1rem; line-height: 1.5rem; }
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* 对应源码 global.less .ellipsis */
.w-\[16\.875rem\] { width: 16.875rem; }
.mt-4 { margin-top: 1rem; }
.h-\[9\.75rem\] { height: 9.75rem; }
.text-\[\#3F5F3F\] { color: #3F5F3F; }
