/*
Theme Name: 52M Thai Gaming News
Theme URI: https://52mth.com/
Author: 52M
Author URI: https://52mth.com/
Description: ธีมเว็บข้อมูลเกมคาสิโนออนไลน์ 52M ดีไซน์โทนดำ-ทอง-แดง สไตล์เว็บหลัก รองรับภาษาไทยเต็มรูปแบบ ปรับแต่งเพื่อ SEO
Version: 1.0.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: mth-news
*/

:root {
  --mth-bg: #150505;
  --mth-bg-2: #1e0808;
  --mth-card: #240b0b;
  --mth-card-2: #2d0e0e;
  --mth-gold: #d4af37;
  --mth-gold-light: #ffd76a;
  --mth-gold-deep: #b8912c;
  --mth-red: #c0392b;
  --mth-red-light: #e74c3c;
  --mth-text: #f3e7cf;
  --mth-text-dim: #c9b393;
  --mth-border: rgba(212, 175, 55, 0.28);
  --mth-border-strong: rgba(212, 175, 55, 0.55);
  --mth-radius: 14px;
  --mth-font: 'Prompt', 'Segoe UI', Tahoma, sans-serif;
}

* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--mth-font);
  background: var(--mth-bg);
  background-image:
    radial-gradient(ellipse 900px 420px at 50% -80px, rgba(94, 14, 14, 0.55), transparent),
    radial-gradient(ellipse 700px 500px at 100% 20%, rgba(63, 10, 10, 0.35), transparent);
  color: var(--mth-text);
  line-height: 1.75;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--mth-gold-light); text-decoration: none; transition: color .2s; }
a:hover { color: #fff; }

img { max-width: 100%; height: auto; display: block; }

.container { max-width: 1200px; margin: 0 auto; padding: 0 20px; }

/* ---------- 顶部公告条 ---------- */
.mth-ticker {
  background: linear-gradient(90deg, #4a0808, #6b0f0f 50%, #4a0808);
  border-bottom: 1px solid var(--mth-border);
  font-size: 13.5px;
  color: var(--mth-gold-light);
  overflow: hidden;
  white-space: nowrap;
}
.mth-ticker__inner { display: inline-block; padding: 7px 0; animation: mth-marquee 26s linear infinite; }
.mth-ticker__inner b { color: #ffe9a8; }
@keyframes mth-marquee { 0% { transform: translateX(100vw); } 100% { transform: translateX(-100%); } }

/* ---------- 头部导航 ---------- */
.mth-header {
  background: rgba(21, 5, 5, 0.96);
  border-bottom: 2px solid var(--mth-border-strong);
  position: sticky; top: 0; z-index: 100;
  backdrop-filter: blur(8px);
}
.mth-header__row { display: flex; align-items: center; gap: 28px; min-height: 72px; }
.mth-logo img { height: 42px; width: auto; }
.mth-nav { margin-left: auto; }
.mth-nav ul { list-style: none; display: flex; gap: 6px; align-items: center; }
.mth-nav a {
  color: var(--mth-text); font-weight: 500; font-size: 15.5px;
  padding: 10px 14px; border-radius: 10px; display: block;
  border: 1px solid transparent;
}
.mth-nav a:hover { color: var(--mth-gold-light); border-color: var(--mth-border); background: rgba(212,175,55,.07); }
.mth-nav .current-menu-item > a,
.mth-nav .current_page_item > a {
  color: var(--mth-gold-light); border-color: var(--mth-border-strong); background: rgba(212,175,55,.1);
}
.mth-cta {
  background: linear-gradient(180deg, #ffd76a, #f0a92a);
  color: #3d1500 !important; font-weight: 700; font-size: 15px;
  padding: 11px 26px; border-radius: 999px; display: inline-flex; align-items: center; gap: 8px;
  box-shadow: 0 4px 16px rgba(240, 169, 42, .35), inset 0 1px 0 rgba(255,255,255,.5);
  border: none; cursor: pointer; white-space: nowrap;
}
.mth-cta:hover { filter: brightness(1.07); color: #2a0d00 !important; }
.mth-burger { display: none; margin-left: auto; background: none; border: 1px solid var(--mth-border); border-radius: 10px; padding: 9px 12px; color: var(--mth-gold-light); font-size: 18px; cursor: pointer; }

/* ---------- Hero 轮播 ---------- */
.mth-hero { padding: 26px 0 8px; }
.mth-slider { position: relative; border-radius: var(--mth-radius); overflow: hidden; border: 1px solid var(--mth-border-strong); box-shadow: 0 18px 46px rgba(0,0,0,.5); background: #2a0a0a; }
.mth-slider__track { position: relative; aspect-ratio: 686 / 210; }
.mth-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .7s ease; }
.mth-slide.is-active { opacity: 1; }
.mth-slide a { display: block; width: 100%; height: 100%; }
.mth-slide img { width: 100%; height: 100%; object-fit: cover; }
.mth-slider__dots { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 9px; z-index: 5; }
.mth-slider__dot { width: 11px; height: 11px; border-radius: 50%; background: rgba(255,255,255,.4); border: 1px solid rgba(0,0,0,.3); cursor: pointer; transition: all .25s; padding: 0; }
.mth-slider__dot.is-active { background: var(--mth-gold-light); transform: scale(1.25); box-shadow: 0 0 10px rgba(255,215,106,.8); }
.mth-slider__arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 5;
  background: rgba(20,4,4,.55); color: var(--mth-gold-light); border: 1px solid var(--mth-border);
  width: 42px; height: 42px; border-radius: 50%; font-size: 18px; cursor: pointer; line-height: 1;
}
.mth-slider__arrow:hover { background: rgba(212,175,55,.25); }
.mth-slider__arrow--prev { left: 14px; }
.mth-slider__arrow--next { right: 14px; }

/* ---------- 分类图标导航 ---------- */
.mth-cats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 16px; padding: 22px 0 8px; }
.mth-cat {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  background: linear-gradient(180deg, var(--mth-card-2), var(--mth-card));
  border: 1px solid var(--mth-border); border-radius: var(--mth-radius);
  padding: 16px 10px 13px; text-align: center; position: relative; overflow: hidden;
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.mth-cat::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(circle at 50% 0%, rgba(212,175,55,.16), transparent 70%);
  opacity: 0; transition: opacity .3s;
}
.mth-cat:hover { transform: translateY(-5px); border-color: var(--mth-border-strong); box-shadow: 0 12px 30px rgba(0,0,0,.45); }
.mth-cat:hover::before { opacity: 1; }
.mth-cat img { width: 64px; height: auto; position: relative; }
.mth-cat span { font-weight: 600; font-size: 15px; color: var(--mth-text); position: relative; }
.mth-cat small { color: var(--mth-text-dim); font-size: 12px; position: relative; }

/* ---------- 通用区块 ---------- */
.mth-section { padding: 30px 0 8px; }
.mth-section__head { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.mth-section__title { font-size: 24px; font-weight: 700; color: #ffe9b0; display: flex; align-items: center; gap: 12px; line-height: 1.3; }
.mth-section__title::before {
  content: ''; width: 6px; height: 26px; border-radius: 4px;
  background: linear-gradient(180deg, var(--mth-gold-light), var(--mth-red));
  box-shadow: 0 0 12px rgba(212,175,55,.5);
}
.mth-section__more { margin-left: auto; font-size: 14px; color: var(--mth-text-dim); }
.mth-section__more:hover { color: var(--mth-gold-light); }

/* ---------- 文章卡片 ---------- */
.mth-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.mth-grid--4 { grid-template-columns: repeat(4, 1fr); }
.mth-card {
  background: linear-gradient(180deg, var(--mth-card-2), var(--mth-card));
  border: 1px solid var(--mth-border); border-radius: var(--mth-radius);
  overflow: hidden; display: flex; flex-direction: column;
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.mth-card:hover { transform: translateY(-5px); border-color: var(--mth-border-strong); box-shadow: 0 14px 34px rgba(0,0,0,.5); }
.mth-card__thumb { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: #2a0a0a; }
.mth-card__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.mth-card:hover .mth-card__thumb img { transform: scale(1.06); }
.mth-card__cat {
  position: absolute; top: 12px; left: 12px; z-index: 2;
  background: linear-gradient(180deg, #a93226, #7b241c);
  color: #ffe9c9; font-size: 12.5px; font-weight: 600;
  padding: 4px 12px; border-radius: 999px; border: 1px solid rgba(255,190,120,.4);
}
.mth-card__body { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 9px; flex: 1; }
.mth-card__title { font-size: 17.5px; font-weight: 600; line-height: 1.5; color: #fdf3dd; }
.mth-card__title a { color: inherit; }
.mth-card__title a:hover { color: var(--mth-gold-light); }
.mth-card__excerpt { font-size: 14px; color: var(--mth-text-dim); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.mth-card__meta { margin-top: auto; font-size: 12.5px; color: #9c8465; display: flex; gap: 14px; }

/* ---------- 游戏卡片区 ---------- */
.mth-games { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.mth-game {
  border-radius: var(--mth-radius); overflow: hidden; position: relative;
  border: 1px solid var(--mth-border); background: var(--mth-card);
  transition: transform .25s, border-color .25s, box-shadow .25s;
}
.mth-game:hover { transform: translateY(-5px) scale(1.02); border-color: var(--mth-gold-light); box-shadow: 0 0 24px rgba(212,175,55,.3); }
.mth-game img { width: 100%; aspect-ratio: 211 / 260; object-fit: cover; }
.mth-game__tag {
  position: absolute; top: 10px; left: 10px;
  background: linear-gradient(180deg, #ffd76a, #f0a92a); color: #3d1500;
  font-size: 11.5px; font-weight: 700; padding: 3px 10px; border-radius: 999px;
}

/* ---------- 促销横幅 ---------- */
.mth-promos { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.mth-promo { border-radius: var(--mth-radius); overflow: hidden; border: 1px solid var(--mth-border); position: relative; transition: border-color .25s, box-shadow .25s; }
.mth-promo:hover { border-color: var(--mth-gold-light); box-shadow: 0 10px 30px rgba(0,0,0,.45); }
.mth-promo img { width: 100%; object-fit: cover; }

/* ---------- 首页 SEO 简介区 ---------- */
.mth-intro {
  margin: 34px 0 10px; padding: 28px 30px;
  background: linear-gradient(180deg, var(--mth-card-2), var(--mth-card));
  border: 1px solid var(--mth-border); border-radius: var(--mth-radius);
}
.mth-intro h2 { color: #ffe9b0; font-size: 21px; margin-bottom: 12px; }
.mth-intro p { color: var(--mth-text-dim); font-size: 15px; margin-bottom: 10px; }
.mth-intro ul { margin: 10px 0 4px 22px; color: var(--mth-text-dim); font-size: 15px; }
.mth-intro li { margin-bottom: 6px; }

/* ---------- 面包屑 ---------- */
.mth-breadcrumb { font-size: 13.5px; color: var(--mth-text-dim); padding: 18px 0 4px; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.mth-breadcrumb a { color: var(--mth-gold-light); }
.mth-breadcrumb__sep { color: #7a6448; }

/* ---------- 归档页 ---------- */
.mth-archive-head {
  background: linear-gradient(180deg, #331010, #1e0808);
  border: 1px solid var(--mth-border-strong); border-radius: var(--mth-radius);
  padding: 30px 32px; margin-bottom: 26px;
}
.mth-archive-head h1 { color: #ffe9b0; font-size: 30px; line-height: 1.35; margin-bottom: 8px; }
.mth-archive-head .mth-archive-count { color: #9c8465; font-size: 14px; margin-bottom: 16px; }
.mth-archive-desc { color: var(--mth-text-dim); font-size: 15.5px; }
.mth-archive-desc p { margin-bottom: 14px; }
.mth-archive-desc h2, .mth-archive-desc h3 { color: #ffe0a0; margin: 20px 0 10px; }
.mth-archive-desc ul, .mth-archive-desc ol { margin: 0 0 14px 22px; }

/* ---------- 文章页 ---------- */
.mth-single { display: grid; grid-template-columns: 1fr 320px; gap: 30px; padding: 10px 0 40px; }
.mth-article {
  background: linear-gradient(180deg, var(--mth-card-2), var(--mth-card));
  border: 1px solid var(--mth-border); border-radius: var(--mth-radius);
  padding: 34px 38px;
}
.mth-article__head h1 { color: #fdf3dd; font-size: 29px; line-height: 1.45; margin-bottom: 14px; }
.mth-article__meta { display: flex; flex-wrap: wrap; gap: 18px; font-size: 13.5px; color: #9c8465; padding-bottom: 18px; border-bottom: 1px solid var(--mth-border); margin-bottom: 22px; }
.mth-article__meta a { color: var(--mth-gold-light); }
.mth-article__thumb { border-radius: 12px; overflow: hidden; margin-bottom: 24px; border: 1px solid var(--mth-border); }
.mth-article__content { font-size: 16.5px; color: #ecd9b8; }
.mth-article__content p { margin-bottom: 18px; }
.mth-article__content h2 { color: #ffe9b0; font-size: 23px; margin: 30px 0 12px; padding-left: 14px; border-left: 5px solid var(--mth-gold); line-height: 1.4; }
.mth-article__content h3 { color: #ffe0a0; font-size: 19px; margin: 24px 0 10px; }
.mth-article__content ul, .mth-article__content ol { margin: 0 0 18px 24px; }
.mth-article__content li { margin-bottom: 8px; }
.mth-article__content blockquote {
  border-left: 4px solid var(--mth-gold); background: rgba(212,175,55,.07);
  padding: 16px 20px; border-radius: 0 12px 12px 0; margin: 20px 0; color: var(--mth-text);
}
.mth-article__content a { border-bottom: 1px dashed rgba(255,215,106,.5); }
.mth-article__content img { border-radius: 12px; margin: 10px auto 18px; border: 1px solid var(--mth-border); }
.mth-article__content table { width: 100%; border-collapse: collapse; margin: 18px 0; font-size: 15px; }
.mth-article__content th { background: rgba(212,175,55,.14); color: #ffe9b0; }
.mth-article__content th, .mth-article__content td { border: 1px solid var(--mth-border); padding: 10px 14px; text-align: left; }

.mth-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--mth-border); }
.mth-tags a {
  font-size: 13px; color: var(--mth-text-dim); border: 1px solid var(--mth-border);
  padding: 5px 14px; border-radius: 999px;
}
.mth-tags a:hover { color: var(--mth-gold-light); border-color: var(--mth-gold-light); }

/* ---------- 侧边栏 ---------- */
.mth-sidebar { display: flex; flex-direction: column; gap: 22px; }
.mth-widget {
  background: linear-gradient(180deg, var(--mth-card-2), var(--mth-card));
  border: 1px solid var(--mth-border); border-radius: var(--mth-radius); padding: 22px;
}
.mth-widget h2, .mth-widget .widget-title { color: #ffe9b0; font-size: 18px; margin-bottom: 14px; padding-bottom: 10px; border-bottom: 1px solid var(--mth-border); }
.mth-widget ul { list-style: none; }
.mth-widget li { padding: 9px 0; border-bottom: 1px dashed rgba(212,175,55,.15); font-size: 14.5px; }
.mth-widget li:last-child { border-bottom: none; }
.mth-widget a { color: var(--mth-text); }
.mth-widget a:hover { color: var(--mth-gold-light); }

/* ---------- 相关文章 ---------- */
.mth-related { margin-top: 30px; padding-top: 24px; border-top: 1px solid var(--mth-border); }
.mth-related__title { color: #ffe9b0; font-size: 20px; margin-bottom: 16px; }
.mth-related .mth-grid { grid-template-columns: repeat(3, 1fr); }

/* ---------- 页脚 ---------- */
.mth-footer { margin-top: 50px; background: #0e0303; border-top: 2px solid var(--mth-border-strong); }
.mth-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 34px; padding: 42px 0 30px; }
.mth-footer h3 { color: var(--mth-gold-light); font-size: 16.5px; margin-bottom: 15px; }
.mth-footer p { color: #a98f6e; font-size: 14px; margin-bottom: 10px; }
.mth-footer ul { list-style: none; }
.mth-footer li { margin-bottom: 9px; font-size: 14px; }
.mth-footer a { color: #c9b393; }
.mth-footer a:hover { color: var(--mth-gold-light); }
.mth-footer__logo img { height: 38px; margin-bottom: 14px; }
.mth-footer__bottom { border-top: 1px solid rgba(212,175,55,.15); padding: 18px 0; text-align: center; color: #7a6448; font-size: 13px; }

/* ---------- 404 ---------- */
.mth-404 { text-align: center; padding: 70px 20px 90px; }
.mth-404__code {
  font-size: 110px; font-weight: 800; line-height: 1;
  background: linear-gradient(180deg, #ffe9a8, #d4af37 55%, #8a6a1c);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  text-shadow: 0 18px 50px rgba(212,175,55,.25);
}
.mth-404 h1 { color: #ffe9b0; font-size: 26px; margin: 12px 0 10px; }
.mth-404 p { color: var(--mth-text-dim); margin-bottom: 26px; }
.mth-404__actions { display: flex; gap: 16px; justify-content: center; margin-bottom: 40px; flex-wrap: wrap; }

/* ---------- 分页 ---------- */
.mth-pagination { display: flex; gap: 10px; justify-content: center; padding: 34px 0 10px; flex-wrap: wrap; }
.mth-pagination .page-numbers {
  min-width: 42px; height: 42px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--mth-border); border-radius: 10px; color: var(--mth-text); font-size: 15px; padding: 0 12px;
}
.mth-pagination .page-numbers.current { background: linear-gradient(180deg, #ffd76a, #f0a92a); color: #3d1500; font-weight: 700; border-color: transparent; }
.mth-pagination .page-numbers:hover:not(.current) { border-color: var(--mth-gold-light); color: var(--mth-gold-light); }

/* ---------- 通用页面 ---------- */
.mth-page-hero { padding: 26px 0 6px; }
.mth-page-hero h1 { color: #ffe9b0; font-size: 32px; line-height: 1.4; }
.mth-page-content { font-size: 16.5px; color: #ecd9b8; }
.mth-page-content p { margin-bottom: 16px; }
.mth-page-content h2 { color: #ffe9b0; font-size: 22px; margin: 26px 0 12px; }

/* ---------- 搜索表单 ---------- */
.mth-searchform { display: flex; gap: 10px; }
.mth-searchform input[type="search"] {
  flex: 1; background: rgba(0,0,0,.3); border: 1px solid var(--mth-border); border-radius: 10px;
  color: var(--mth-text); padding: 11px 16px; font-family: inherit; font-size: 15px;
}
.mth-searchform input[type="search"]:focus { outline: none; border-color: var(--mth-gold-light); }
.mth-searchform button {
  background: linear-gradient(180deg, #ffd76a, #f0a92a); color: #3d1500; font-weight: 700;
  border: none; border-radius: 10px; padding: 0 22px; cursor: pointer; font-family: inherit; font-size: 15px;
}

/* ---------- 屏幕阅读器 ---------- */
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(1px,1px,1px,1px); }

/* ---------- 响应式 ---------- */
@media (max-width: 1080px) {
  .mth-games { grid-template-columns: repeat(4, 1fr); }
  .mth-grid--4 { grid-template-columns: repeat(2, 1fr); }
  .mth-single { grid-template-columns: 1fr; }
  .mth-footer__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 860px) {
  .mth-burger { display: block; }
  .mth-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #170606; border-bottom: 2px solid var(--mth-border-strong); padding: 14px 20px 20px; }
  .mth-nav.is-open { display: block; }
  .mth-nav ul { flex-direction: column; align-items: stretch; gap: 4px; }
  .mth-nav .mth-cta-wrap { margin-top: 10px; }
  .mth-header__row .mth-cta { display: none; }
  .mth-grid { grid-template-columns: repeat(2, 1fr); }
  .mth-cats { grid-template-columns: repeat(3, 1fr); }
  .mth-promos { grid-template-columns: 1fr; }
  .mth-related .mth-grid, .mth-grid--4 { grid-template-columns: 1fr 1fr; }
  .mth-article { padding: 24px 20px; }
  .mth-article__head h1 { font-size: 23px; }
}

@media (max-width: 560px) {
  .mth-grid, .mth-related .mth-grid, .mth-grid--4 { grid-template-columns: 1fr; }
  .mth-games { grid-template-columns: repeat(2, 1fr); }
  .mth-cats { grid-template-columns: repeat(2, 1fr); }
  .mth-footer__grid { grid-template-columns: 1fr; gap: 24px; }
  .mth-slider__track { aspect-ratio: 343 / 210; }
}

/* ===== 1.0.3: mobile header — smaller logo, prominent bonus CTA ===== */
@media (max-width: 860px) {
  .mth-header__row { gap: 10px; }
  .mth-logo img { height: 30px; }
  .mth-burger { margin-left: 0; order: 3; }
  .mth-header__row .mth-cta {
    display: inline-flex !important;
    order: 2;
    margin-left: auto;
    padding: 10px 20px;
    font-size: 14.5px;
  }
}
@keyframes mth-header-pulse {
  0%, 100% { box-shadow: 0 4px 16px rgba(240, 169, 42, .35), inset 0 1px 0 rgba(255, 255, 255, .5); }
  50% { box-shadow: 0 4px 26px rgba(255, 199, 44, .8), inset 0 1px 0 rgba(255, 255, 255, .5); }
}

/* ===== 1.0.4: bonus CTA blinking effects (glow burst + shine sweep + sparkle) ===== */
.mth-cta {
  position: relative;
  overflow: hidden;
  animation: mth-glow-blink 2s ease-in-out infinite;
}
.mth-cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: -80%;
  width: 55%;
  height: 100%;
  background: linear-gradient(105deg, transparent, rgba(255, 255, 255, 0.8), transparent);
  transform: skewX(-20deg);
  animation: mth-shine 2.6s ease-in-out infinite;
  pointer-events: none;
}
.mth-cta::after {
  content: '\2728';
  position: absolute;
  top: 1px;
  right: 3px;
  font-size: 12px;
  animation: mth-sparkle 1.4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes mth-glow-blink {
  0%, 100% { box-shadow: 0 4px 16px rgba(240, 169, 42, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.5); }
  50% { box-shadow: 0 0 32px rgba(255, 215, 106, 0.95), 0 0 14px rgba(255, 199, 44, 0.9), inset 0 1px 0 rgba(255, 255, 255, 0.5); }
}
@keyframes mth-shine {
  0%, 55% { left: -80%; }
  100% { left: 135%; }
}
@keyframes mth-sparkle {
  0%, 100% { transform: scale(0.55) rotate(0deg); opacity: 0.5; }
  50% { transform: scale(1.2) rotate(25deg); opacity: 1; }
}