/* 主题模板：家长选模板，孩子端自动换肤（与卢洋/卢永泽那两套同源的设计语言） */
/* 默认 :root 已是“动漫手绘·温暖”风格；这里覆盖另外三套 + 装饰横幅。 */

/* 太空探险 · 卡通玩具（亮蓝紫、星球火箭感，鲜艳不刺眼） */
body[data-theme="space"] {
  --bg: #eaf2ff;
  --bg2: #e3ecff;
  --primary: #5b8cff;
  --primary-deep: #3f6fe0;
  --accent: #ffd23f;
  --accent2: #8a6bff;
  --ok: #36c98d;
  --line: #d6e2ff;
  --shadow: 0 8px 24px rgba(70, 110, 220, 0.18);
}
body[data-theme="space"] .topbar { border-bottom-color: var(--primary); }
body[data-theme="space"] .brand .logo {
  background: radial-gradient(circle at 30% 30%, #fff, #5b8cff);
  box-shadow: 0 0 0 4px #e3ecff;
}

/* 恐龙世界（暖绿+泥土棕，远古可爱） */
body[data-theme="dino"] {
  --bg: #f3f7ec;
  --bg2: #eaf3df;
  --primary: #6fae5a;
  --primary-deep: #4f8c3d;
  --accent: #e8a33d;
  --accent2: #c98a5a;
  --ok: #4fae6b;
  --line: #dcebd0;
  --shadow: 0 8px 24px rgba(90, 130, 70, 0.16);
}
body[data-theme="dino"] .topbar { border-bottom-color: var(--primary); }
body[data-theme="dino"] .brand .logo {
  background: radial-gradient(circle at 30% 30%, #fff, #6fae5a);
  box-shadow: 0 0 0 4px #eaf3df;
}

/* 森林动物（自然绿、安静舒服） */
body[data-theme="forest"] {
  --bg: #eef6ef;
  --bg2: #e4f1e6;
  --primary: #4fa97e;
  --primary-deep: #3a8a66;
  --accent: #f2b84b;
  --accent2: #7bbf8c;
  --ok: #46b07e;
  --line: #d3e8d8;
  --shadow: 0 8px 24px rgba(70, 150, 110, 0.16);
}
body[data-theme="forest"] .topbar { border-bottom-color: var(--primary); }
body[data-theme="forest"] .brand .logo {
  background: radial-gradient(circle at 30% 30%, #fff, #4fa97e);
  box-shadow: 0 0 0 4px #e4f1e6;
}

/* 主题横幅（孩子端顶部装饰，无文字、无版权形象，纯 CSS 图形） */
.theme-hero {
  border-radius: var(--radius);
  padding: 22px 20px;
  margin-bottom: 16px;
  color: #fff;
  position: relative;
  overflow: hidden;
  min-height: 88px;
  display: flex;
  align-items: center;
}
.theme-hero h2 { margin: 0; font-size: 20px; position: relative; z-index: 2; }
.theme-hero .sub { opacity: .92; font-size: 13px; margin-top: 4px; position: relative; z-index: 2; }
body[data-theme="anime"] .theme-hero {
  background: linear-gradient(135deg, #ffb3bd, #ff9aa2);
}
body[data-theme="space"] .theme-hero {
  background: linear-gradient(135deg, #6f9bff, #8a6bff);
}
body[data-theme="space"] .theme-hero::after {
  content: ""; position: absolute; right: -10px; top: -10px; width: 120px; height: 120px;
  background:
    radial-gradient(circle at 20% 20%, #fff 0 3px, transparent 4px),
    radial-gradient(circle at 60% 50%, #fff 0 2px, transparent 3px),
    radial-gradient(circle at 40% 80%, #fff 0 2px, transparent 3px),
    radial-gradient(circle at 85% 30%, #fff 0 3px, transparent 4px);
  opacity: .8;
}
body[data-theme="dino"] .theme-hero {
  background: linear-gradient(135deg, #8cc06f, #6fae5a);
}
body[data-theme="dino"] .theme-hero::after {
  content: ""; position: absolute; right: 14px; top: 14px; width: 46px; height: 46px;
  border-radius: 50% 50% 50% 8px; background: rgba(255,255,255,.25);
  box-shadow: -34px 14px 0 -6px rgba(255,255,255,.18);
}
body[data-theme="forest"] .theme-hero {
  background: linear-gradient(135deg, #5fb98a, #4fa97e);
}
body[data-theme="forest"] .theme-hero::after {
  content: ""; position: absolute; right: 18px; bottom: -6px; width: 40px; height: 40px;
  background: rgba(255,255,255,.22); border-radius: 50% 50% 6px 50%;
  box-shadow: -30px 6px 0 -10px rgba(255,255,255,.16), 26px 0 0 -14px rgba(255,255,255,.14);
}

@media (prefers-reduced-motion: reduce) {
  * { animation: none !important; transition: none !important; }
}