/* ============================================================
 * 动图模型提分大师 · 全站设计系统 V4.0「深空科技」
 * 2026-09-02 全面界面改版：深空底色 + 极光渐变 + 玻璃拟态 + 霓虹光效
 * 单文件覆盖全站全部组件（含旧 app.css/home.css/page-common.css 全部类）
 * ============================================================ */

:root{
  --bg:#070b17;
  --bg2:#0a1122;
  --card:rgba(255,255,255,.045);
  --card-hover:rgba(255,255,255,.075);
  --line:rgba(148,163,184,.18);
  --ink:#e8eefb;
  --gray:#94a3b8;
  --primary:#3b82f6;
  --primary-dark:#2563eb;
  --cyan:#22d3ee;
  --purple:#a78bfa;
  --accent:#fbbf24;
  --green:#34d399;
  --red:#f87171;
  --pink:#f472b6;
  --glow-blue:0 0 24px rgba(59,130,246,.35);
  --glow-cyan:0 0 22px rgba(34,211,238,.30);
  --grad-main:linear-gradient(135deg,#22d3ee 0%,#3b82f6 50%,#a78bfa 100%);
  --grad-warm:linear-gradient(135deg,#fbbf24,#f97316);
  --r-lg:18px;
  --r-md:12px;
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{font-size:16px;scroll-behavior:smooth}
body{
  font-family:"PingFang SC","Microsoft YaHei","HarmonyOS Sans SC","Helvetica Neue",sans-serif;
  background:
    radial-gradient(1100px 560px at 85% -8%, rgba(124,58,237,.16), transparent 62%),
    radial-gradient(950px 520px at 8% 0%, rgba(34,211,238,.11), transparent 58%),
    radial-gradient(900px 620px at 50% 112%, rgba(59,130,246,.10), transparent 62%),
    var(--bg);
  background-attachment:fixed;
  color:var(--ink);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
a{color:var(--cyan);text-decoration:none;transition:color .15s}
a:hover{color:#7dd3fc}
img{max-width:100%}
button{font-family:inherit}
::selection{background:rgba(59,130,246,.4);color:#fff}

/* ---------- 顶部导航 ---------- */
.topnav{
  position:sticky;top:0;z-index:50;
  background:rgba(7,11,23,.82);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  box-shadow:0 4px 30px rgba(0,0,0,.35);
}
.topnav .in{max-width:1180px;margin:0 auto;display:flex;align-items:center;gap:10px;padding:10px 16px;flex-wrap:wrap}
.topnav .logo{font-weight:800;font-size:16px;color:#fff;letter-spacing:.5px;display:flex;align-items:center;gap:8px;margin-right:auto}
.topnav .logo .dot{
  width:26px;height:26px;border-radius:8px;flex-shrink:0;
  background:var(--grad-main);
  display:inline-flex;align-items:center;justify-content:center;
  color:#fff;font-size:13px;font-weight:900;
  box-shadow:var(--glow-cyan);
}
.nav-links{display:flex;gap:4px;align-items:center;overflow-x:auto;max-width:100%;scrollbar-width:none}
.nav-links::-webkit-scrollbar{display:none}
.topnav a.nav{font-size:13.5px;padding:7px 13px;border-radius:9px;color:var(--gray);font-weight:600;white-space:nowrap;transition:.15s}
.topnav a.nav.on{background:rgba(34,211,238,.14);color:var(--cyan);box-shadow:inset 0 0 0 1px rgba(34,211,238,.35)}
.topnav a.nav:hover{background:rgba(148,163,184,.12);color:var(--ink)}
.topnav .cta{
  background:var(--grad-main);color:#fff;border-radius:10px;padding:8px 16px;font-size:13px;font-weight:700;
  box-shadow:var(--glow-blue);transition:.2s;white-space:nowrap;
}
.topnav .cta:hover{transform:translateY(-1px);filter:brightness(1.12)}

/* 导航右侧操作区 */
.nav-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.btn-matrix{
  font-size:12.5px;font-weight:700;color:#fff;padding:7px 13px;border-radius:999px;
  background:linear-gradient(135deg,#1d4ed8,#0891b2);box-shadow:0 2px 10px rgba(29,78,216,.4);
  white-space:nowrap;transition:.2s;
}
.btn-matrix:hover{transform:translateY(-1px);filter:brightness(1.15)}
.abtn{
  font-size:12.5px;font-weight:700;padding:7px 13px;border-radius:999px;cursor:pointer;
  border:1px solid var(--line);background:rgba(255,255,255,.05);color:var(--gray);
  transition:.2s;white-space:nowrap;
}
.abtn:hover{color:var(--ink);border-color:rgba(148,163,184,.45);background:rgba(255,255,255,.09)}
.abtn.save{color:#a7f3d0;border-color:rgba(52,211,153,.4)}
.abtn.save:hover{background:rgba(52,211,153,.12);border-color:var(--green);color:#6ee7b7}
.abtn.exit{color:#fda4af;border-color:rgba(248,113,113,.4)}
.abtn.exit:hover{background:rgba(248,113,113,.12);border-color:var(--red);color:#fca5a5}

/* 用户胶囊 */
.u-chip{display:inline-flex;align-items:center;gap:7px;padding:4px 12px 4px 4px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid var(--line)}
.u-av{width:24px;height:24px;border-radius:50%;background:var(--grad-main);display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:12px;font-weight:800;box-shadow:var(--glow-cyan)}
.u-name{font-size:12.5px;font-weight:700;color:var(--ink);white-space:nowrap}
.u-role{font-style:normal;font-size:10.5px;font-weight:800;color:var(--accent);background:rgba(251,191,36,.12);border:1px solid rgba(251,191,36,.35);padding:1px 8px;border-radius:999px}

/* ---------- Hero ---------- */
.hero{
  position:relative;overflow:hidden;text-align:center;color:#fff;
  background:linear-gradient(160deg,#0b1c46 0%,#152a63 38%,#3b2a7a 72%,#5b2d8f 100%);
  border-radius:0 0 30px 30px;
  padding:52px 18px 44px;
}
.hero::before,.hero::after{
  content:"";position:absolute;border-radius:50%;filter:blur(90px);opacity:.5;pointer-events:none;
  animation:heroFloat 12s ease-in-out infinite alternate;
}
.hero::before{width:420px;height:420px;background:rgba(34,211,238,.35);top:-160px;left:-120px}
.hero::after{width:460px;height:460px;background:rgba(167,139,250,.32);bottom:-200px;right:-140px;animation-delay:-6s}
@keyframes heroFloat{from{transform:translate(0,0) scale(1)}to{transform:translate(60px,40px) scale(1.15)}}
.hero .kick{
  position:relative;display:inline-block;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);
  color:#a5f3fc;font-size:12px;font-weight:700;padding:6px 16px;border-radius:999px;margin-bottom:18px;letter-spacing:1.5px;
  backdrop-filter:blur(4px);
}
.hero h1{position:relative;font-size:31px;line-height:1.35;font-weight:900;margin-bottom:14px;text-shadow:0 2px 18px rgba(0,0,0,.35)}
.hero h1 em{font-style:normal;background:linear-gradient(90deg,#fde047,#22d3ee,#a78bfa);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .sub{position:relative;font-size:15px;color:rgba(255,255,255,.82);max-width:600px;margin:0 auto 24px}
.hero .demo{
  position:relative;width:min(580px,92vw);margin:0 auto;border-radius:18px;overflow:hidden;
  box-shadow:0 24px 70px rgba(0,0,0,.5);border:2px solid rgba(255,255,255,.22);
}
.hero .demo canvas{display:block;width:100%;aspect-ratio:16/9;background:#0b1220}
.hero .demo .cap{position:absolute;left:12px;bottom:12px;background:rgba(7,11,23,.78);color:#a5f3fc;font-size:12px;padding:5px 12px;border-radius:999px;backdrop-filter:blur(4px);border:1px solid rgba(34,211,238,.3)}
.hero .cta-row{position:relative;display:flex;gap:12px;justify-content:center;margin-top:26px;flex-wrap:wrap}
.hero .btn{font-size:15px;padding:13px 30px;border-radius:13px}
.trust{position:relative;display:flex;justify-content:center;gap:26px;flex-wrap:wrap;margin-top:22px;font-size:12.5px;color:rgba(255,255,255,.8)}
.trust b{display:block;font-size:19px;color:#fff;text-shadow:0 0 18px rgba(34,211,238,.6)}

/* ---------- 标题 / 卡片 ---------- */
.section-title{
  font-size:21px;font-weight:800;margin:30px 0 6px;letter-spacing:.5px;
  background:linear-gradient(90deg,#e8eefb,#a5b4fc);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.section-title::before{content:"";display:inline-block;width:5px;height:18px;border-radius:3px;background:var(--grad-main);margin-right:10px;vertical-align:-3px;box-shadow:var(--glow-cyan)}
.section-sub{font-size:13px;color:var(--gray);margin-bottom:16px}
.card{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:22px;margin-bottom:16px;
  backdrop-filter:blur(6px);transition:border-color .2s, background .2s;
}
.card:hover{border-color:rgba(148,163,184,.32)}
.card h2{font-size:17px;color:#fff;margin-bottom:8px}
.card h3{font-size:15px;margin:12px 0 6px;color:#dbeafe}
.card .desc{font-size:13px;color:var(--gray)}

/* ---------- 徽章 / 难度 ---------- */
.badge{display:inline-block;padding:2px 9px;border-radius:999px;font-size:11px;font-weight:700;white-space:nowrap}
.b-star{background:rgba(251,191,36,.14);color:#fcd34d;border:1px solid rgba(251,191,36,.3)}
.b-geo{background:rgba(59,130,246,.14);color:#93c5fd;border:1px solid rgba(59,130,246,.3)}
.b-ai{background:rgba(167,139,250,.14);color:#c4b5fd;border:1px solid rgba(167,139,250,.32)}
.b-done{background:rgba(52,211,153,.14);color:#6ee7b7;border:1px solid rgba(52,211,153,.3)}
.b-comp{background:rgba(244,114,182,.14);color:#f9a8d4;border:1px solid rgba(244,114,182,.32)}
.b-new{background:linear-gradient(135deg,#dc2626,#f59e0b);color:#fff}
.b-video{background:rgba(14,165,233,.14);color:#7dd3fc;border:1px solid rgba(14,165,233,.3)}
.lv{font-size:11px;padding:2px 8px;border-radius:999px;font-weight:800}
.lv1{background:rgba(52,211,153,.14);color:#6ee7b7}
.lv2{background:rgba(251,191,36,.14);color:#fcd34d}
.lv3{background:rgba(248,113,113,.14);color:#fca5a5}
.notice{display:inline-block;font-size:11px;font-weight:700;padding:2px 9px;border-radius:999px}
.n-green{background:rgba(52,211,153,.14);color:#6ee7b7}
.n-amber{background:rgba(251,191,36,.14);color:#fcd34d}

/* ---------- 按钮 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  background:var(--grad-main);color:#fff;border:none;border-radius:11px;
  padding:10px 22px;font-size:14px;font-weight:700;cursor:pointer;text-align:center;transition:.2s;
  box-shadow:var(--glow-blue);
}
.btn:hover{transform:translateY(-1px);filter:brightness(1.12)}
.btn:active{transform:translateY(0)}
.btn-block{display:flex;width:100%}
.btn-ghost{background:rgba(255,255,255,.05);color:#a5f3fc;border:1.5px solid rgba(34,211,238,.5);box-shadow:none}
.btn-ghost:hover{background:rgba(34,211,238,.1)}
.btn-orange{background:var(--grad-warm);box-shadow:0 0 22px rgba(249,115,22,.35)}
.btn-orange:hover{background:linear-gradient(135deg,#fbbf24,#f97316)}

/* ---------- 网格 ---------- */
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
@media(max-width:640px){.grid4{grid-template-columns:repeat(3,1fr)}.grid3{grid-template-columns:repeat(2,1fr)}}

/* ---------- 表格 ---------- */
table{width:100%;border-collapse:collapse;font-size:13px}
th{background:rgba(148,163,184,.08);text-align:left;padding:10px;border-bottom:2px solid var(--line);color:#cbd5e1;font-weight:700}
td{padding:10px;border-bottom:1px solid rgba(148,163,184,.1);vertical-align:middle;color:var(--ink)}
tr:hover td{background:rgba(59,130,246,.06)}
.nowrap{white-space:nowrap}

/* ---------- 首页组件 ---------- */
.feat{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin:26px 0 10px}
.feat .card{padding:20px;position:relative;overflow:hidden}
.feat .card::after{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad-main);opacity:0;transition:.25s}
.feat .card:hover::after{opacity:1}
.feat .ico{
  width:48px;height:48px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-size:24px;margin-bottom:12px;background:rgba(59,130,246,.12);border:1px solid rgba(59,130,246,.28);
  box-shadow:inset 0 0 18px rgba(59,130,246,.12);
}
.feat h3{font-size:15.5px;margin-bottom:6px;color:#fff}
.feat p{font-size:13px;color:var(--gray)}
.how{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin:8px 0}
.how .step{background:var(--card);border:1px solid var(--line);border-radius:15px;padding:18px;text-align:center;backdrop-filter:blur(6px)}
.how .num{
  width:34px;height:34px;margin:0 auto 10px;border-radius:50%;background:var(--grad-main);color:#fff;font-weight:900;
  display:flex;align-items:center;justify-content:center;box-shadow:var(--glow-blue);font-size:15px;
}
.how b{font-size:14.5px;display:block;margin-bottom:4px;color:#fff}
.how small{font-size:12px;color:var(--gray)}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:13px 17px;margin-bottom:9px;backdrop-filter:blur(6px)}
.faq summary{font-weight:700;font-size:14px;cursor:pointer;color:#dbeafe;list-style-position:inside}
.faq summary::marker{color:var(--cyan)}
.faq details[open]{border-color:rgba(34,211,238,.4)}
.faq details p{font-size:13px;color:var(--gray);margin-top:8px}
.parents{border:1.5px solid rgba(251,191,36,.4);background:linear-gradient(180deg,rgba(251,191,36,.06),rgba(251,146,60,.04))}
.parents .btn{margin-top:10px}
.price{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.price .now{font-size:44px;font-weight:900;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}
.price .now small{font-size:22px}
.price .was{font-size:18px;color:var(--gray);text-decoration:line-through}
.price .save{background:rgba(248,113,113,.14);color:#fca5a5;font-size:12px;font-weight:700;padding:3px 11px;border-radius:999px;border:1px solid rgba(248,113,113,.3)}
.compliance{background:rgba(52,211,153,.05);border:1px dashed rgba(52,211,153,.4);border-radius:13px;padding:13px 15px;font-size:12px;color:#a7f3d0;margin:16px 0;line-height:1.9}
.compliance b{display:block;margin-bottom:5px;color:var(--green)}

/* ---------- 统计卡 / 分类页签 ---------- */
.stat-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:11px;margin-bottom:16px}
.stat-card{
  background:var(--card);border:1px solid var(--line);border-radius:14px;padding:15px;text-align:center;transition:.2s;
  backdrop-filter:blur(6px);
}
.stat-card:hover{border-color:rgba(34,211,238,.45);box-shadow:var(--glow-cyan);transform:translateY(-2px)}
.stat-card .num{font-size:27px;font-weight:900;color:var(--cyan);text-shadow:0 0 22px rgba(34,211,238,.45)}
.stat-card .lab{font-size:12px;color:var(--gray);margin-top:3px}
.cat-tabs,.admin-tabs,.child-switch{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
.cat-tabs button,.admin-tabs button,.child-switch button{
  font-size:13px;padding:8px 16px;border-radius:999px;border:1.5px solid var(--line);
  background:var(--card);color:var(--gray);font-weight:600;cursor:pointer;transition:.18s;
}
.cat-tabs button:hover:not(.on),.admin-tabs button:hover:not(.on){border-color:rgba(34,211,238,.5);color:var(--cyan)}
.cat-tabs button.on,.admin-tabs button.on{
  background:var(--grad-main);border-color:transparent;color:#fff;font-weight:700;box-shadow:var(--glow-blue);
}
.child-switch button.on{background:linear-gradient(135deg,#10b981,#34d399);border-color:transparent;color:#fff;box-shadow:0 0 18px rgba(52,211,153,.35)}
.child-switch button:hover:not(.on){border-color:rgba(52,211,153,.5);color:#6ee7b7}
.panel{display:none}
.panel.on{display:block;animation:fadeUp .3s ease}

/* ---------- AI 搜索 ---------- */
.ai-search{display:flex;gap:10px;margin:16px 0}
.ai-search input{
  flex:1;border:1.5px solid var(--line);border-radius:13px;padding:13px 18px;font-size:14px;outline:none;
  background:rgba(255,255,255,.05);color:var(--ink);transition:.18s;
}
.ai-search input::placeholder{color:#64748b}
.ai-search input:focus{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(34,211,238,.14)}
.ai-search button{
  border:none;border-radius:13px;padding:0 26px;background:var(--grad-main);color:#fff;font-weight:700;font-size:14px;
  cursor:pointer;transition:.2s;box-shadow:var(--glow-blue);white-space:nowrap;
}
.ai-search button:hover{transform:translateY(-1px);filter:brightness(1.12)}
.search-badge{display:inline-block;background:rgba(167,139,250,.14);color:#c4b5fd;font-size:11px;font-weight:700;padding:3px 11px;border-radius:999px;margin-bottom:8px;border:1px solid rgba(167,139,250,.3)}
.ai-hint{font-size:12px;color:var(--gray);margin:6px 0 12px}
.ai-hint b{color:var(--cyan)}
.legend{font-size:12px;color:var(--gray);display:flex;gap:14px;flex-wrap:wrap;margin-bottom:8px}
.legend span{display:inline-flex;align-items:center;gap:4px}

/* ---------- 模型墙 ---------- */
.wall,.wall-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(164px,1fr));gap:11px}
.model-cell{
  position:relative;background:var(--card);border:1px solid var(--line);border-radius:15px;padding:13px;
  transition:.2s;cursor:pointer;backdrop-filter:blur(6px);overflow:hidden;
}
.model-cell::before{
  content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad-main);
  opacity:0;transition:.25s;
}
.model-cell:hover{
  transform:translateY(-3px);border-color:rgba(34,211,238,.55);box-shadow:0 10px 30px rgba(34,211,238,.18);
}
.model-cell:hover::before{opacity:1}
.model-cell.comp{border-color:rgba(244,114,182,.4);background:linear-gradient(180deg,rgba(244,114,182,.07),var(--card))}
.model-cell.comp:hover{box-shadow:0 10px 30px rgba(244,114,182,.2)}
.model-cell.done{border-color:rgba(52,211,153,.4)}
.model-tag{position:absolute;top:9px;right:9px;font-size:10px;font-weight:700;padding:2px 7px;border-radius:999px}
.model-tag.comp{background:rgba(244,114,182,.16);color:#f9a8d4}
.model-tag.done{background:rgba(52,211,153,.16);color:#6ee7b7}
.mc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.mc-no{font-size:11px;color:var(--gray);font-weight:700}
.mc-name{font-size:14px;font-weight:700;line-height:1.4;margin-bottom:9px;min-height:40px;color:#eef2ff}
.mc-meta{display:flex;gap:4px;flex-wrap:wrap}
.wall-more{text-align:center;margin-top:20px}

/* ---------- 播放器 ---------- */
.player-wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;margin-top:16px}
@media(max-width:860px){.player-wrap{grid-template-columns:1fr}}
.stage{
  background:#05080f;border-radius:var(--r-lg);overflow:hidden;position:relative;
  border:1px solid rgba(59,130,246,.35);min-height:360px;
  box-shadow:0 0 40px rgba(59,130,246,.14), inset 0 0 80px rgba(3,7,18,.6);
}
.stage canvas{display:block;width:100%;height:auto;aspect-ratio:16/10;background:#05080f}
.stage-cap{position:absolute;left:12px;top:12px;background:rgba(7,11,23,.8);color:#a5f3fc;font-size:12px;padding:5px 13px;border-radius:999px;backdrop-filter:blur(4px);border:1px solid rgba(34,211,238,.3)}
.interact-tip{position:absolute;right:12px;top:12px;background:rgba(167,139,250,.18);color:#ddd6fe;font-size:11px;font-weight:700;padding:4px 11px;border-radius:999px;border:1px solid rgba(167,139,250,.35);cursor:pointer;user-select:none;transition:.18s;z-index:5}
.interact-tip:hover{background:rgba(167,139,250,.34);box-shadow:0 0 14px rgba(167,139,250,.35)}
.interact-tip.playing{background:rgba(34,211,238,.2);color:#a5f3fc;border-color:rgba(34,211,238,.5)}
.interact-tip.playing:hover{background:rgba(34,211,238,.32)}
.stage canvas{cursor:pointer}
.stage-ctl{position:absolute;right:12px;bottom:12px;display:flex;gap:8px}
.stage-ctl button{
  font-size:12.5px;font-weight:700;padding:7px 15px;border-radius:999px;
  background:rgba(34,211,238,.16);color:#a5f3fc;border:1px solid rgba(34,211,238,.45);cursor:pointer;transition:.18s;
  backdrop-filter:blur(4px);
}
.stage-ctl button:hover{background:rgba(34,211,238,.3);box-shadow:var(--glow-cyan)}
.side{display:flex;flex-direction:column;gap:16px}
.lecture-list{max-height:220px;overflow:auto;border:1px solid var(--line);border-radius:13px;padding:8px;background:rgba(255,255,255,.03)}
.chap{display:flex;align-items:center;gap:10px;padding:8px 9px;border-bottom:1px solid rgba(148,163,184,.1);cursor:pointer;border-radius:9px;transition:.15s}
.chap:last-child{border-bottom:0}
.chap:hover,.chap.on{background:rgba(34,211,238,.1)}
.chap .idx{width:24px;height:24px;border-radius:50%;background:rgba(34,211,238,.14);color:var(--cyan);font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.chap.on .idx{background:var(--grad-main);color:#fff}
.chap .t{flex:1;font-size:12.5px;color:var(--ink)}
.chap .m{font-size:11px;color:var(--gray)}
.video-wrap{border-radius:13px;overflow:hidden;background:#000;margin-top:9px;border:1px solid var(--line)}
.video-wrap video{width:100%;display:block;aspect-ratio:16/9}
.sub-box{margin-top:9px;padding:11px 13px;background:rgba(255,255,255,.04);border:1px solid var(--line);border-radius:11px;font-size:12.5px;min-height:42px;color:#cbd5e1}
.ai-q{display:flex;gap:9px;align-items:flex-start;margin-bottom:11px}
.ai-q span{width:23px;height:23px;border-radius:50%;background:rgba(251,191,36,.15);color:#fcd34d;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid rgba(251,191,36,.35)}
.ai-options{display:grid;gap:8px;margin:8px 0 0 31px}
.ai-options label{display:flex;align-items:center;gap:9px;padding:10px 13px;border:1.5px solid var(--line);border-radius:11px;cursor:pointer;font-size:13px;transition:.15s;color:#dbeafe}
.ai-options label:hover{border-color:var(--cyan);background:rgba(34,211,238,.07)}
.radar-wrap{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
#aiReport{font-size:12.5px;color:var(--gray);line-height:1.75}
.reco-list{margin-top:11px}
.reco-item{padding:10px 13px;border:1px solid var(--line);border-radius:11px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center;background:rgba(255,255,255,.03);transition:.15s}
.reco-item:hover{border-color:rgba(34,211,238,.4)}
.explain-text{white-space:pre-wrap;background:rgba(255,255,255,.04);border:1px solid var(--line);padding:13px;border-radius:11px;font-size:13px;line-height:1.75;margin-top:9px;max-height:240px;overflow:auto;color:#cbd5e1}
.explain-ctrl{display:flex;gap:8px;margin-top:9px;flex-wrap:wrap}
.explain-ctrl button{font-size:12px;padding:7px 15px}

/* ---------- 家长端 ---------- */
.parent-hero{
  background:linear-gradient(150deg,#0b2b46 0%,#155e75 60%,#3b82f6 130%);
  color:#fff;padding:38px 18px 32px;text-align:center;border-radius:0 0 26px 26px;
}
.parent-hero h1{font-size:26px;font-weight:900;margin-bottom:8px}
.parent-hero p{font-size:14px;color:rgba(255,255,255,.82)}
.kpi,.kpi2{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:11px;margin:18px 0}
.kpi .card,.kpi2 .card{text-align:center;padding:17px;position:relative;overflow:hidden}
.kpi .card::after,.kpi2 .card::after{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad-main)}
.kpi2 .card::after{background:linear-gradient(90deg,#34d399,#22d3ee)}
.kpi .num,.kpi2 .num{font-size:26px;font-weight:900;color:var(--cyan);text-shadow:0 0 20px rgba(34,211,238,.4)}
.kpi2 .num{color:#6ee7b7;text-shadow:0 0 20px rgba(52,211,153,.4)}
.kpi .lab,.kpi2 .lab{font-size:12px;color:var(--gray);margin-top:3px}
.mastery{position:relative;background:rgba(148,163,184,.15);border-radius:999px;height:10px;overflow:hidden;width:104px;display:inline-block;vertical-align:middle;border:1px solid rgba(148,163,184,.2)}
.mastery i{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:linear-gradient(90deg,#10b981,#34d399);box-shadow:0 0 10px rgba(52,211,153,.5)}
.weak-tag{font-size:11px;background:rgba(248,113,113,.14);color:#fca5a5;padding:2px 9px;border-radius:999px;font-weight:700;border:1px solid rgba(248,113,113,.3)}
.report-row{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px dashed rgba(148,163,184,.18)}
.report-row:last-child{border-bottom:none}
.date-chip{font-size:11px;background:rgba(148,163,184,.12);color:var(--gray);padding:3px 9px;border-radius:7px;white-space:nowrap}

/* ---------- 管理后台 ---------- */
.form-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:11px;margin-bottom:11px}
.form-row label{font-size:12px;color:var(--gray);display:block;margin-bottom:5px}
.form-row input,.form-row select,.form-row textarea{
  width:100%;padding:10px 12px;border:1.5px solid var(--line);border-radius:11px;font-size:13px;
  background:rgba(255,255,255,.05);color:var(--ink);outline:none;transition:.15s;
}
.form-row textarea{font-family:Consolas,monospace}
.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--cyan)}
.order-status{display:inline-block;font-size:11px;font-weight:700;padding:2px 10px;border-radius:999px}
.os-paid{background:rgba(52,211,153,.14);color:#6ee7b7}
.os-pending{background:rgba(251,191,36,.14);color:#fcd34d}
.os-refund{background:rgba(248,113,113,.14);color:#fca5a5}
.log-line{font-family:Consolas,"Courier New",monospace;font-size:12px;color:var(--gray);padding:6px 0;border-bottom:1px dashed rgba(148,163,184,.15)}
.log-line .ok{color:#6ee7b7}
.log-line .err{color:#fca5a5}
.code{font-family:Consolas,monospace;font-size:12px;background:rgba(148,163,184,.12);padding:2px 7px;border-radius:5px;color:#a5f3fc}

/* ---------- 登录页 ---------- */
.login-wrap{
  min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px 16px;position:relative;overflow:hidden;
}
.login-wrap::before,.login-wrap::after{content:"";position:absolute;border-radius:50%;filter:blur(100px);opacity:.4;pointer-events:none}
.login-wrap::before{width:480px;height:480px;background:rgba(59,130,246,.3);top:-160px;left:-140px}
.login-wrap::after{width:520px;height:520px;background:rgba(167,139,250,.25);bottom:-200px;right:-160px}
.login-card{
  position:relative;width:min(420px,94vw);background:rgba(10,17,34,.78);border:1px solid rgba(148,163,184,.24);
  border-radius:22px;padding:38px 32px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  box-shadow:0 30px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.06);
}
.login-logo{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:26px;text-align:center}
.login-logo .big-dot{
  width:56px;height:56px;border-radius:16px;background:var(--grad-main);display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:26px;font-weight:900;box-shadow:0 0 34px rgba(34,211,238,.5);
}
.login-logo h1{font-size:21px;font-weight:900;color:#fff;letter-spacing:1px}
.login-logo p{font-size:12.5px;color:var(--gray)}
.login-form .field{margin-bottom:16px}
.login-form label{display:block;font-size:12.5px;font-weight:700;color:#cbd5e1;margin-bottom:7px;letter-spacing:.5px}
.login-form input{
  width:100%;padding:13px 16px;font-size:14.5px;border-radius:12px;outline:none;transition:.18s;
  border:1.5px solid rgba(148,163,184,.3);background:rgba(255,255,255,.06);color:var(--ink);
}
.login-form input::placeholder{color:#52627a}
.login-form input:focus{border-color:var(--cyan);box-shadow:0 0 0 4px rgba(34,211,238,.13)}
.login-btn{
  width:100%;padding:14px;font-size:15.5px;font-weight:800;border:none;border-radius:13px;cursor:pointer;
  background:var(--grad-main);color:#fff;letter-spacing:6px;transition:.2s;box-shadow:var(--glow-blue);margin-top:4px;
}
.login-btn:hover{transform:translateY(-2px);filter:brightness(1.12);box-shadow:0 0 34px rgba(59,130,246,.5)}
.login-btn:disabled{opacity:.55;cursor:wait;transform:none}
.login-err{
  display:none;margin-top:14px;padding:10px 14px;border-radius:11px;font-size:13px;
  background:rgba(248,113,113,.12);border:1px solid rgba(248,113,113,.4);color:#fca5a5;
}
.login-err.show{display:block;animation:shake .4s}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.login-hint{margin-top:20px;padding:12px 14px;border-radius:11px;background:rgba(34,211,238,.07);border:1px dashed rgba(34,211,238,.35);font-size:12px;color:#94b8d8;line-height:1.9}
.login-links{display:flex;justify-content:space-between;margin-top:18px;font-size:12.5px}
.login-links a{color:var(--gray)}
.login-links a:hover{color:var(--cyan)}

/* ---------- Toast ---------- */
.tf-toast{
  position:fixed;left:50%;bottom:34px;transform:translate(-50%,20px);z-index:9999;
  background:rgba(10,17,34,.94);border:1px solid rgba(52,211,153,.5);color:#a7f3d0;
  font-size:13.5px;font-weight:700;padding:11px 22px;border-radius:999px;
  box-shadow:0 10px 40px rgba(0,0,0,.5), 0 0 22px rgba(52,211,153,.2);
  opacity:0;transition:.3s;pointer-events:none;backdrop-filter:blur(8px);max-width:88vw;
}
.tf-toast.show{opacity:1;transform:translate(-50%,0)}
.tf-toast.err{border-color:rgba(248,113,113,.5);color:#fca5a5}

/* ---------- 布局工具类（CSP 严格模式：禁止内联 style，全部走类） ---------- */
main.wrap{margin:0 auto;padding:16px 14px 60px}
.wrap-1000{max-width:1000px}
.wrap-1100{max-width:1100px}
.wrap-1200{max-width:1200px}
.u-center{text-align:center}
.u-mt8{margin-top:8px}
.u-mt10{margin-top:10px}
.u-mt12{margin-top:12px}
.u-mt14{margin-top:14px}
.u-fs12{font-size:12px}
.price-center{justify-content:center}
.price-desc{margin:10px 0 16px}
.buy-cta{max-width:420px;margin:0 auto;font-size:16px;padding:14px}
/* player 雷达区（初始隐藏，player.js 经 CSSOM 置 display:flex 显示） */
.radar-box{display:none;margin-top:14px}
.radar-wrap canvas{width:180px;height:180px}
#aiReport{flex:1;min-width:220px}
/* parent AI 报告区 */
.parent-ai-card{border-top:3px solid #a78bfa;margin-bottom:14px}
.radar-flex{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.radar-flex canvas{width:170px;height:170px}
.radar-flex-main{flex:1;min-width:230px}
#aiReportText{font-size:13px;color:#cbd5e1;line-height:1.7}
.advice-line{margin-top:8px;font-size:12.5px;color:#7dd3fc}
#weakList{margin-top:8px}
#verifyResult{margin-top:12px}
#subBox{margin-top:9px}

/* ---------- 页脚 / 动画 / 响应式 ---------- */
.foot{text-align:center;color:var(--gray);font-size:12px;padding:26px 14px 46px;border-top:1px solid rgba(148,163,184,.08);margin-top:30px}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}
main>*, .hero>*{animation:fadeUp .45s ease both}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
@media(max-width:768px){
  .hero h1{font-size:24px}
  .section-title{font-size:18px}
  .wall,.wall-preview{grid-template-columns:repeat(2,1fr)}
  .stat-cards,.kpi,.kpi2{grid-template-columns:repeat(2,1fr)}
  .topnav .in{gap:6px}
  .nav-right{width:100%;justify-content:flex-end}
  .ai-search{flex-direction:column}
  .ai-search button{padding:12px}
}