/* 国家地理分级阅读 · Academoo 皮肤覆盖层
 * 加载在页面自带样式之后，把 Level 目录 / 课程入口页统一为 s-class-theme 的卡通粗描边风格。
 * 依赖 styles/s-class-theme.css（由 site-nav.js 注入，或页面直接引用）。 */

html.sc-theme body {
    background: linear-gradient(180deg, var(--sc-sky-100, #e0f2fe) 0%, #fff 55%) !important;
    color: var(--sc-gray-900, #111827) !important;
    font-family: var(--sc-font-body) !important;
}
html.sc-theme .bg { background: none !important; }
html.sc-theme .bg-photo, html.sc-theme .bg-frost { display: none !important; }
html.sc-theme .bg::before, html.sc-theme .bg::after { content: none !important; }

/* 漂浮糖果色块背景 */
html.sc-theme .bg { overflow: hidden; }
html.sc-theme .bg .sc-blob { position: absolute; border-radius: 50%; opacity: .55; filter: blur(2px); animation: sc-float-slow 9s ease-in-out infinite; }

/* ---------- Level 目录页（index / level-2 / level-3） ---------- */
html.sc-theme .page { max-width: 72rem; }
html.sc-theme .logo-row { gap: .75rem; }
html.sc-theme .logo-mark { border: 3px solid #000 !important; border-radius: 1rem !important; background: var(--sc-yellow) !important; box-shadow: 3px 3px 0 #000 !important; padding: 4px; }
html.sc-theme .logo-text { color: var(--sc-gray-700) !important; font-family: var(--sc-font-display) !important; font-weight: 700 !important; letter-spacing: .04em !important; text-transform: none !important; font-size: .95rem !important; }
html.sc-theme header h1, html.sc-theme .page > header h1 {
    font-family: var(--sc-font-display) !important; font-weight: 700 !important; color: var(--sc-gray-900) !important;
    letter-spacing: -.01em !important; text-shadow: none !important;
    background: none !important; -webkit-text-fill-color: var(--sc-gray-900) !important; -webkit-background-clip: border-box !important; background-clip: border-box !important;
}
html.sc-theme .subtitle { color: var(--sc-gray-600) !important; font-weight: 600 !important; }
html.sc-theme .level-nav { gap: .6rem; }
html.sc-theme .level-pill {
    background: #fff !important; color: var(--sc-gray-900) !important; border: 3px solid #000 !important; border-radius: 999px !important;
    box-shadow: 3px 3px 0 #000 !important; font-family: var(--sc-font-display) !important; font-weight: 700 !important;
    transition: transform .15s, box-shadow .15s !important; backdrop-filter: none !important;
}
html.sc-theme .level-pill small { color: var(--sc-gray-600) !important; font-weight: 700 !important; }
html.sc-theme .level-pill:hover { transform: translate(-2px, -2px); box-shadow: 5px 5px 0 #000 !important; }
html.sc-theme .level-pill.is-active { background: var(--sc-yellow) !important; }

html.sc-theme .grid { gap: 1.25rem; }
html.sc-theme a.card {
    background: #fff !important; border: 4px solid #000 !important; border-radius: 1.5rem !important;
    box-shadow: 5px 5px 0 #000 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
    color: var(--sc-gray-900) !important; overflow: visible !important;
    transition: transform .18s, box-shadow .18s !important;
}
html.sc-theme a.card::before { height: 10px !important; background: var(--accent, var(--sc-blue)) !important; opacity: 1 !important; border-radius: 1.1rem 1.1rem 0 0; border-bottom: 4px solid #000; top: 0; left: 0; right: 0; }
html.sc-theme a.card::after { display: none !important; }
html.sc-theme a.card:hover { transform: translate(-3px, -3px) !important; box-shadow: 8px 8px 0 #000 !important; border-color: #000 !important; }
html.sc-theme a.card:active { transform: translate(2px, 2px) !important; box-shadow: 2px 2px 0 #000 !important; }
html.sc-theme .card-top { margin-top: .4rem; }
html.sc-theme .card-icon {
    background: var(--accent, var(--sc-blue)) !important; border: 3px solid #000 !important; border-radius: 1rem !important;
    box-shadow: 3px 3px 0 #000 !important; display: flex; align-items: center; justify-content: center; font-size: 1.9rem;
    width: 60px !important; height: 60px !important;
}
html.sc-theme .card-arrow { border: 3px solid #000 !important; background: var(--sc-yellow) !important; color: #000 !important; font-weight: 900; box-shadow: 2px 2px 0 #000 !important; }
html.sc-theme a.card:hover .card-arrow { background: var(--sc-orange) !important; border-color: #000 !important; }
html.sc-theme .card-title { font-family: var(--sc-font-display) !important; font-weight: 700 !important; color: var(--sc-gray-900) !important; font-size: 1.45rem !important; }
html.sc-theme .card-tag { color: var(--sc-gray-700) !important; font-family: var(--sc-font-display) !important; font-weight: 700 !important; letter-spacing: .02em !important; text-transform: none !important; font-size: 1rem !important; }
html.sc-theme .tag { background: var(--sc-sky-50) !important; color: var(--sc-gray-800) !important; border: 2px solid #000 !important; border-radius: 999px !important; font-weight: 700 !important; }
html.sc-theme .card-tags .tag:nth-child(1) { background: var(--sc-green) !important; }
html.sc-theme .card-tags .tag:nth-child(2) { background: var(--sc-pink) !important; }
html.sc-theme .card-tags .tag:nth-child(3) { background: var(--sc-yellow) !important; }
html.sc-theme .card-tags .tag:nth-child(4) { background: var(--sc-blue) !important; }
html.sc-theme .card-tags .tag:nth-child(5) { background: var(--sc-purple) !important; }
html.sc-theme .page footer, html.sc-theme .page > footer {
    border-top: 3px dashed #000 !important; color: var(--sc-gray-600) !important; font-weight: 700 !important;
}
html.sc-theme .page footer strong { color: var(--sc-gray-900) !important; }
html.sc-theme .plan-banner, html.sc-theme a.syllabus-banner {
    background: var(--sc-yellow) !important; border: 4px solid #000 !important; border-radius: 1.25rem !important;
    box-shadow: 5px 5px 0 #000 !important; color: var(--sc-gray-900) !important; backdrop-filter: none !important;
}
html.sc-theme .plan-banner strong, html.sc-theme .plan-banner span, html.sc-theme a.syllabus-banner * { color: var(--sc-gray-900) !important; }

/* 阅读闯关横幅（Level 页 & 课程页） */
html.sc-theme .ngr-banner {
    display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.25rem; margin: 0 0 1.5rem;
    padding: 1.1rem 1.35rem; background: var(--sc-purple); border: 4px solid #000; border-radius: 1.5rem; box-shadow: 5px 5px 0 #000;
    text-decoration: none; color: var(--sc-gray-900); transition: transform .18s, box-shadow .18s;
}
html.sc-theme .ngr-banner:hover { transform: translate(-3px, -3px); box-shadow: 8px 8px 0 #000; }
html.sc-theme .ngr-banner .ic { width: 64px; height: 64px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; font-size: 2.2rem; background: #fff; border: 3px solid #000; border-radius: 1rem; box-shadow: 3px 3px 0 #000; }
html.sc-theme .ngr-banner .tx { flex: 1; min-width: 14rem; }
html.sc-theme .ngr-banner .tx b { display: block; font-family: var(--sc-font-display); font-size: 1.3rem; font-weight: 700; }
html.sc-theme .ngr-banner .tx span { font-weight: 700; color: var(--sc-gray-800); font-size: .92rem; }
html.sc-theme .ngr-banner .chips { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .45rem; }
html.sc-theme .ngr-banner .chips i { font-style: normal; font-size: .75rem; font-weight: 800; padding: .1rem .55rem; border: 2px solid #000; border-radius: 999px; background: #fff; }
html.sc-theme .ngr-banner .go { font-family: var(--sc-font-display); font-weight: 700; padding: .65rem 1.2rem; background: var(--sc-yellow); border: 3px solid #000; border-radius: 999px; box-shadow: 3px 3px 0 #000; white-space: nowrap; }

/* ---------- Level 1 课程入口页（Play Kitty 等 9 本） ---------- */
html.sc-theme .back {
    color: var(--sc-gray-900) !important; background: #fff !important; border: 3px solid #000 !important; border-radius: 999px !important;
    box-shadow: 3px 3px 0 #000 !important; font-weight: 700 !important; font-family: var(--sc-font-display) !important;
}
html.sc-theme .back:hover { transform: translate(-1px, -1px); box-shadow: 4px 4px 0 #000 !important; color: #000 !important; }
html.sc-theme .back img { opacity: 1 !important; filter: invert(1); }
html.sc-theme .hero {
    background: #fff !important; border: 4px solid #000 !important; border-radius: 1.5rem !important; box-shadow: 6px 6px 0 #000 !important;
}
html.sc-theme .hero-icon { border: 3px solid #000 !important; border-radius: 1rem !important; box-shadow: 3px 3px 0 #000 !important; background: var(--accent, var(--sc-blue)); }
html.sc-theme .hero-tag { color: var(--accent-dim, var(--sc-gray-700)) !important; font-family: var(--sc-font-display) !important; text-transform: none !important; letter-spacing: .02em !important; font-size: 1rem !important; }
html.sc-theme .hero h1 { font-family: var(--sc-font-display) !important; color: var(--sc-gray-900) !important; font-weight: 700 !important; }
html.sc-theme .hero p { color: var(--sc-gray-600) !important; font-weight: 600 !important; }
html.sc-theme .page h2 { color: var(--sc-gray-700) !important; font-family: var(--sc-font-display) !important; font-size: .95rem !important; letter-spacing: .06em !important; }
html.sc-theme a.card .card-body .card-label { color: var(--sc-gray-900) !important; font-family: var(--sc-font-display) !important; font-weight: 700 !important; font-size: 1.1rem !important; }
html.sc-theme a.card .card-body .card-desc { color: var(--sc-gray-600) !important; font-weight: 600 !important; }
html.sc-theme a.card .card-icon img { filter: none; }
html.sc-tpl-course .page .grid a.card { flex-direction: row !important; min-height: 0 !important; padding: 1rem 1.1rem !important; border-radius: 1.25rem !important; box-shadow: 4px 4px 0 #000 !important; }
html.sc-tpl-course .page .grid a.card::before { display: none !important; }
html.sc-tpl-course .page .grid a.card .card-icon { width: 52px !important; height: 52px !important; background: var(--sc-sky-50) !important; }
html.sc-tpl-course .page .grid a.card.is-quest { background: var(--sc-purple) !important; }
html.sc-tpl-course .page .grid a.card.is-quest .card-icon { background: #fff !important; font-size: 1.7rem; }
html.sc-tpl-course .page .grid a.card.is-quest .card-desc { color: var(--sc-gray-800) !important; }
html.sc-tpl-course .page .grid a.card:hover { transform: translate(-2px, -2px) !important; box-shadow: 6px 6px 0 #000 !important; }
html.sc-tpl-course .page { max-width: 64rem !important; }
html.sc-tpl-course .page .grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 1rem !important; }
html.sc-tpl-course .page .grid a.card .card-arrow img { display: none; }
html.sc-tpl-course .page .grid a.card .card-arrow::after { content: "→"; font-family: var(--sc-font-display); font-size: 1.1rem; line-height: 1; }
@media (max-width: 700px) { html.sc-tpl-course .page .grid { grid-template-columns: 1fr !important; } }
html.sc-theme a.hw {
    background: #fff !important; color: var(--sc-gray-900) !important; border: 3px solid #000 !important; border-radius: 1rem !important;
    box-shadow: 3px 3px 0 #000 !important; font-weight: 700 !important; transition: transform .15s, box-shadow .15s !important;
}
html.sc-theme a.hw:hover { transform: translate(-2px, -2px) !important; box-shadow: 5px 5px 0 #000 !important; border-color: #000 !important; }
html.sc-theme a.hw img { border: 2px solid #000 !important; background: var(--sc-yellow); }

/* ---------- Level 2/3 科学考察营入口页（Moon / Reptiles / Deserts） ---------- */
html.sc-tpl-camp body { display: block !important; padding: 0 !important; }
html.sc-theme .camp {
    width: min(100% - 2rem, 72rem) !important; max-width: 72rem !important; height: auto !important; max-height: none !important; aspect-ratio: auto !important;
    margin: 1rem auto 3rem !important; overflow: visible !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
    background: transparent !important; color: var(--sc-gray-900) !important;
}
html.sc-theme .topbar { position: static !important; background: transparent !important; color: var(--sc-gray-900) !important; padding: .25rem 0 1rem !important; }
html.sc-theme .topbar .back { background: #fff !important; color: var(--sc-gray-900) !important; }
html.sc-theme .topbar-tag { background: var(--sc-yellow) !important; color: #000 !important; border: 2px solid #000 !important; border-radius: 999px !important; font-weight: 800 !important; padding: .3rem .8rem !important; box-shadow: 2px 2px 0 #000; }
html.sc-theme .camp .hero { background: #fff !important; border: 4px solid #000 !important; border-radius: 1.75rem !important; box-shadow: 6px 6px 0 #000 !important; color: var(--sc-gray-900) !important; overflow: hidden !important; }
html.sc-theme .camp .hero::before, html.sc-theme .camp .hero::after, html.sc-theme .hero-image::after { display: none !important; }
html.sc-theme .hero-copy { background: var(--sc-blue) !important; border-right: 4px solid #000; }
html.sc-theme .hero-image { background: #fff; padding: 1rem; }
html.sc-theme .hero-image img { height: 100% !important; max-height: 360px; object-fit: cover !important; background: #fff !important; }
html.sc-theme .camp-body > .section-head + .mission-grid { margin-top: .5rem; }
html.sc-theme .kicker { color: var(--sc-accent) !important; font-family: var(--sc-font-display) !important; font-weight: 700 !important; letter-spacing: .1em !important; }
html.sc-theme .camp .hero h1 { font-family: var(--sc-font-display) !important; color: var(--sc-gray-900) !important; font-weight: 700 !important; }
html.sc-theme .camp .hero h2 { color: var(--sc-purple) !important; -webkit-text-stroke: 1px #000; font-family: var(--sc-font-display) !important; font-weight: 700 !important; }
html.sc-theme .camp .hero p { color: var(--sc-gray-700) !important; font-weight: 600 !important; }
html.sc-theme .cta {
    background: var(--sc-orange) !important; color: #000 !important; border: 3px solid #000 !important; border-radius: 999px !important;
    box-shadow: 3px 3px 0 #000 !important; font-family: var(--sc-font-display) !important; font-weight: 700 !important; transition: transform .15s, box-shadow .15s !important;
}
html.sc-theme .cta.secondary { background: #fff !important; }
html.sc-theme .cta:hover { transform: translate(-2px, -2px) !important; box-shadow: 5px 5px 0 #000 !important; }
html.sc-theme .hero-image img { border: 4px solid #000 !important; border-radius: 1.25rem !important; box-shadow: 5px 5px 0 #000 !important; }
html.sc-theme .field-label { background: var(--sc-yellow) !important; color: #000 !important; border: 3px solid #000 !important; border-radius: .75rem !important; font-weight: 800 !important; box-shadow: 3px 3px 0 #000 !important; }
html.sc-theme .camp-body { background: transparent !important; }
html.sc-theme .section-head span { color: var(--sc-accent) !important; font-weight: 800 !important; }
html.sc-theme .section-head h2, html.sc-theme .section-head p, html.sc-theme .print-intro h2, html.sc-theme .print-intro p { color: var(--sc-gray-900) !important; }
html.sc-theme .section-head h2, html.sc-theme .print-intro h2 { font-family: var(--sc-font-display) !important; font-weight: 700 !important; }
html.sc-theme .mission {
    background: #fff !important; border: 4px solid #000 !important; border-radius: 1.5rem !important; box-shadow: 5px 5px 0 #000 !important;
    color: var(--sc-gray-900) !important; transition: transform .18s, box-shadow .18s !important;
}
html.sc-theme .mission:hover { transform: translate(-3px, -3px) !important; box-shadow: 8px 8px 0 #000 !important; }
html.sc-theme .mission.large { background: var(--sc-blue) !important; }
html.sc-theme .mission.medium { background: var(--sc-green) !important; }
html.sc-theme .mission.third:nth-of-type(3) { background: var(--sc-pink) !important; }
html.sc-theme .mission.third:nth-of-type(4) { background: var(--sc-yellow) !important; }
html.sc-theme .mission.third:nth-of-type(5) { background: var(--sc-orange) !important; }
html.sc-theme .mission.is-quest.is-quest { background: var(--sc-purple) !important; }
html.sc-theme .mission.is-quest.is-quest:last-child { grid-column: 1 / -1 !important; min-height: 0 !important; }
html.sc-theme .mission.is-quest.is-quest:last-child .mission-content { width: 100% !important; flex-direction: row !important; flex-wrap: wrap; align-items: center !important; gap: .5rem 1.25rem; }
html.sc-theme .mission.is-quest.is-quest:last-child h3 { margin: 0 !important; flex: 0 0 auto; }
html.sc-theme .mission.is-quest.is-quest:last-child p { flex: 1 1 18rem; margin: 0 !important; }
html.sc-theme .mission.is-quest.is-quest:last-child .mission-go { margin: 0 !important; padding-top: .4rem !important; }
html.sc-theme .mission h3 { color: var(--sc-gray-900) !important; font-family: var(--sc-font-display) !important; font-weight: 700 !important; }
html.sc-theme .mission p { color: var(--sc-gray-800) !important; font-weight: 600 !important; }
html.sc-theme .mission-go { align-self: flex-start; background: #fff !important; color: #000 !important; border: 3px solid #000 !important; border-radius: 999px !important; box-shadow: 3px 3px 0 #000 !important; font-weight: 800 !important; padding: .4rem .9rem !important; margin-top: auto !important; }
html.sc-theme .mission-content { padding-top: 1.2rem !important; }
html.sc-theme .mission-content > .mission-go { margin-top: 1rem !important; }
html.sc-theme .mission-icon { align-self: flex-start; width: 56px; height: 56px; display: flex; align-items: center; justify-content: center; background: #fff !important; border: 3px solid #000 !important; border-radius: 1rem !important; box-shadow: 3px 3px 0 #000 !important; }
html.sc-theme .mission-photo { border-left: 4px solid #000 !important; opacity: 1 !important; filter: none !important; mix-blend-mode: normal !important; }
html.sc-theme .route-step { background: #fff !important; border: 3px solid #000 !important; border-radius: 1rem !important; box-shadow: 3px 3px 0 #000 !important; color: var(--sc-gray-900) !important; }
html.sc-theme .route-step b { color: var(--sc-accent) !important; font-family: var(--sc-font-display) !important; }
html.sc-theme .route-step small { color: var(--sc-gray-700) !important; font-weight: 600 !important; }
html.sc-theme .print-pack { background: var(--sc-yellow) !important; border: 4px solid #000 !important; border-radius: 1.5rem !important; box-shadow: 5px 5px 0 #000 !important; }
html.sc-theme .print-link { background: #fff !important; color: var(--sc-gray-900) !important; border: 3px solid #000 !important; border-radius: 1rem !important; box-shadow: 3px 3px 0 #000 !important; font-weight: 800 !important; }
html.sc-theme .print-link:hover { transform: translate(-2px, -2px) !important; box-shadow: 5px 5px 0 #000 !important; }
html.sc-theme .camp footer { color: var(--sc-gray-600) !important; border-top: 3px dashed #000 !important; font-weight: 700 !important; }
