*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,"PingFang SC","Microsoft YaHei",sans-serif;background:#fff8e7;color:#333;line-height:1.6}
.top{background:linear-gradient(135deg,#ffcf4d,#ff8a5c);padding:24px 16px 12px;text-align:center;color:#3d2a00}
.logo{font-size:34px;font-weight:800}.tag{font-size:17px;margin:8px auto;max-width:720px}
.tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:14px}
.tab{border:0;background:rgba(255,255,255,.75);padding:10px 18px;border-radius:999px;font-size:17px;cursor:pointer}
.tab.active{background:#3d2a00;color:#fff}
main{max-width:860px;margin:0 auto;padding:16px}
.panel{display:none}.panel.active{display:block}
h2{font-size:24px}h3{font-size:19px}
.form{background:#fff;border:2px solid #ffd166;border-radius:20px;padding:18px}
label{display:block;margin:12px 0;font-weight:700}
input,select{width:100%;padding:12px;font-size:17px;border:2px solid #ddd;border-radius:12px;margin-top:6px}
.row{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
@media(max-width:600px){.row{grid-template-columns:1fr}}
.types{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.type{border:2px solid #ddd;background:#fff;padding:10px 14px;border-radius:14px;font-size:16px;cursor:pointer}
.type.active{border-color:#ff8a5c;background:#fff1e6}
.big{width:100%;padding:14px;font-size:20px;font-weight:800;border:0;border-radius:14px;background:#ff8a5c;color:#fff;cursor:pointer;margin-top:8px}
.hint{color:#777;font-size:15px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.cards{grid-template-columns:1fr}}
.card{background:#fff;border:2px solid #ffe08a;border-radius:18px;padding:16px}
.card h3{margin:0 0 6px}.card p{margin:4px 0;color:#555}
.btn{border:0;background:#ffd166;padding:10px 16px;border-radius:12px;font-size:16px;cursor:pointer;margin:4px 4px 0 0}
.btn.danger{background:#ffe1e1}.btn.primary{background:#ff8a5c;color:#fff}
.stage{background:#fff;border:2px solid #ffd166;border-radius:20px;padding:20px;margin-top:18px}
.scene{font-size:72px;text-align:center;animation:float 2.5s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}
@keyframes slide{0%{transform:translateX(-18px)}100%{transform:translateX(18px)}}
.anim-bounce{animation:bounce 1s infinite}.anim-slide{animation:slide 1.2s ease-in-out infinite alternate}
.booktext{font-size:20px;text-align:center}
.pager,.center{text-align:center}.pager button,.center button{margin:6px}
.tree-group{margin:16px 0}.tree-group h3{margin-bottom:6px}
.chip{display:inline-block;background:#fff;border:2px solid #ffd166;border-radius:999px;padding:8px 14px;margin:4px;cursor:pointer;font-size:16px}
.empty{text-align:center;color:#999;padding:30px;font-size:18px}
.parents{background:#f3f7ff;border-radius:18px;padding:16px;margin-top:24px}
footer{text-align:center;color:#999;padding:20px;font-size:14px}
.quiz-opt{display:block;width:100%;text-align:left;padding:12px;margin:8px 0;border:2px solid #ddd;border-radius:12px;background:#fff;font-size:17px;cursor:pointer}
.quiz-opt.correct{border-color:#2ea043;background:#e6ffed}.quiz-opt.wrong{border-color:#d33;background:#ffecec}
.score{font-size:20px;font-weight:800;text-align:center}
