/* 少年探索版：保留各页面功能，统一明亮的童话学习氛围。 */
:root, body {
  color-scheme: light;
  --bg: #f5f7ff; --bg-elev: #fff; --bg-muted: #eef0ff;
  --text: #28264b; --muted: #626887; --line: #e5e3f8;
  --brand: #6756c8; --brand-strong: #5141a8; --brand-soft: #eeeaff;
  --on-brand: #fff; --focus: #6756c8; --accent: #6756c8;
  --header-bg: #fffdf9; --panel: #fff; --radius: 20px; --radius-sm: 13px;
  --logo-sheet: #ffe8b3; --logo-fold: #fff;
  --shadow: 0 8px 28px rgba(86, 73, 160, .09);
}
body { background: var(--bg); }
body.subject-physics { --brand:#b9682b; --brand-strong:#914b18; --brand-soft:#fff0df; --focus:#b9682b; }
body.subject-english { --brand:#486abf; --brand-strong:#36549b; --brand-soft:#e9efff; --focus:#486abf; }
body.subject-chinese { --brand:#b85079; --brand-strong:#963a60; --brand-soft:#fff0f6; --focus:#b85079; }
.site-header { background: #fffdf9; padding: 14px 30px; border-bottom: 1px solid #eee7f8; box-shadow: 0 4px 18px rgba(89,75,150,.05); }
.brand { gap: 12px; }
.logo { width: 48px; height: 48px; }
.brand-name { font-size: clamp(1.3rem, 2vw, 1.65rem); font-weight: 850; letter-spacing: -.03em; color: #34315d; }
.brand-kicker { color:#9b83b9; letter-spacing:.12em; font-size:.72rem; }
.subject-switch { background:#f2efff; padding:4px; }
.nav-link { font-weight: 700; }
.nav-link.subject-link.on { box-shadow:0 4px 10px rgba(101,81,194,.22); }
.home { width:min(1200px, 100%); padding: 28px 24px 64px; }
.hero { display:grid; grid-template-columns:minmax(0, 1.15fr) minmax(260px,.85fr); align-items:center; gap:12px; min-height:410px; padding:42px 28px 38px 48px; overflow:hidden; border:1px solid #ece6fb; border-radius:32px; background:linear-gradient(125deg,#fff9ed 0%,#f8f0ff 58%,#e7f5ff 100%); box-shadow:0 14px 45px rgba(112,91,177,.12); }
.hero-copy { position:relative; z-index:1; min-width:0; }
.eyebrow { display:inline-block; padding:7px 12px; border-radius:50px; background:#fff9; color:#7762ad; font-size:.8rem; letter-spacing:.02em; }
.hero h1 { color:#34305b; font-size:clamp(2rem, 4.2vw, 3.35rem); line-height:1.2; letter-spacing:-.04em; }
.lede { color:#67647e; line-height:1.8; font-size:1rem; }
.hero-actions { max-width:460px; }
.hero-actions .btn { min-height:52px; border-radius:16px; font-weight:800; box-shadow:0 6px 0 rgba(95,74,174,.09); }
.hero-art { display:flex; justify-content:center; align-items:center; min-width:0; }
.hero-art img { display:block; width:100%; max-width:450px; height:auto; filter:drop-shadow(0 16px 20px rgba(104,83,152,.14)); }
.section-title { margin:38px 0 16px; font-size:1.45rem; color:#36315e; }
.section-title::before { content:'✦'; color:#f3a941; margin-right:10px; }
.steps { gap:16px; }
.steps li,.stat-card,a.grade-card { border:1px solid #ebe6f6; box-shadow:0 7px 20px rgba(88,76,150,.06); border-radius:20px; }
.steps li { padding:20px 22px; }
.steps li:nth-child(1) { background:#fff9ed; } .steps li:nth-child(2) { background:#f1f6ff; } .steps li:nth-child(3) { background:#f9efff; }
.step-no { width:34px; height:34px; background:#fff; color:#8068c8; box-shadow:0 3px 8px #6e5eaa18; }
.steps h3 { font-size:1.1rem; } .steps p { line-height:1.7; }
.stat-card { padding:20px; } .stat-num { color:#6654b7; }
a.grade-card { border-top:4px solid #8acbbd; transition:transform .2s, box-shadow .2s; }
a.grade-card.is-junior { border-top-color:#91b7ef; } a.grade-card.is-senior { border-top-color:#c6a2ed; }
a.grade-card:hover { transform:translateY(-3px); box-shadow:0 12px 24px rgba(88,76,150,.13); }
.card, .side, .detail, .graph-toolbar { border-color:var(--line); }
button, input, select, textarea { border-radius:12px; }
@media (max-width:800px) {
 .site-header { padding:12px 16px; }
 .brand-name { font-size:1.25rem; }
 .home { padding:18px 14px 45px; }
 .hero { grid-template-columns:1fr; gap:0; padding:28px 23px 12px; }
 .hero h1 { font-size:2rem; }
 .hero-art img { width:min(75%,300px); }
 .steps { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion: reduce) { a.grade-card { transition:none; } }
/* 探索伙伴插画：独立占位，不覆盖题目与交互。 */
.brand-name { font-size: clamp(1.75rem, 2.4vw, 2.15rem); line-height:1.15; }
.steps li { position:relative; overflow:hidden; min-height:195px; padding-right:105px; }
.step-art { position:absolute; right:0; bottom:0; width:120px; height:120px; object-fit:contain; pointer-events:none; }
.adventure-banner { width:min(808px, calc(100% - 32px)); margin:24px auto 0; min-height:145px; display:flex; align-items:center; justify-content:space-between; gap:14px; overflow:hidden; padding:18px 24px; background:linear-gradient(120deg,#fff9ed,#f0ebff 65%,#e6f5ff); border:1px solid #e9e2f8; border-radius:24px; box-shadow:var(--shadow); }
.adventure-banner h2 { margin:3px 0 4px; color:#393260; font-size:1.35rem; line-height:1.3; }
.adventure-banner p { margin:0; color:#6b6586; font-size:.92rem; }
.adventure-kicker { color:#9175c4; font-weight:800; font-size:.8rem; }
.adventure-banner img { width:160px; height:120px; object-fit:contain; flex:none; }
.graph-art { width:min(205px,70%); max-height:160px; object-fit:contain; display:block; margin:0 auto 4px; }
.detail::before { content:''; display:block; width:100%; height:100px; margin-bottom:8px; background: url('learning-fox-map-v1.png') center / contain no-repeat; pointer-events:none; }
@media (max-width:800px) {
 .brand-name { font-size:clamp(1.48rem,5vw,1.85rem); }
 .adventure-banner { padding:14px 16px; min-height:110px; }
 .adventure-banner img { width:112px; height:90px; }
 .adventure-banner h2 { font-size:1.1rem; }
 .steps li { min-height:165px; }
 .detail::before { height:75px; }
}
@media print { .adventure-banner { display:none; } }
.language-switch { display:flex; align-items:center; gap:3px; padding:4px; border-radius:999px; background:#f2efff; color:#5141a8; font-size:.8rem; }
.language-switch > button { min-height:34px; padding:4px 9px; border:0; background:transparent; color:#55478e; border-radius:999px; font-weight:750; }
.language-switch > button[aria-pressed="true"] { background:#6756c8; color:white; }
.language-status { color:#615a7d; max-width:130px; font-size:.7rem; line-height:1.1; }
#google_translate_element { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
