Hi-Tuto

Hi-Tuto design system for all frontend/UI work in this repo. Use whenever creating or modifying React components, pages, styles, Tailwind classes, or the mascot in frontend/ — ensures the Thinkby-inspired look (flat vivid color panels, one-sided shadows, square mascot) stays consistent.

Author Hi Tuto HTML lesson capsules. Use when emitting final lesson HTML, choosing scroll vs Canvas Studio vs slide shell, wiring tutor hooks, or applying postprocess/CSP constraints.

Source-grounding rules — cite retrieved facts, never invent specifics, prefer source packs over web when a document is attached. Use when a lesson has source packs or research. (Body pending Deep Agents skills wiring.)

Core pedagogy for Hi Tuto lessons — one mechanism per lesson, prerequisite ordering, active recall. Use when scoping or sequencing lesson content. (Body pending Deep Agents skills wiring.)

Data-synthesis guidance — generating plausible datasets for visualizations or simulations when no source data exists. Use during asset_plan for data-driven capsules. (Body pending Deep Agents skills wiring.)

Generate PBR meshes (Hunyuan 3D Pro) for Canvas Studio chapters only. Use when presentation is studio and subjects need realistic 3D. Studio chrome lives in ui-studio-style — this skill owns mesh generation only.

Simulation guidance — parameter sliders, physics/agent loops, and deterministic seeds. Use for simulation- or tool-archetype lessons. (Body pending Deep Agents skills wiring.)

Advanced maths — proofs, calculus, and linear-algebra visualizations. Use for university-level, proof-based, or higher-maths topics. (Body pending Deep Agents skills wiring.)

Chemistry lessons — reactions, bonding, molecular structure, periodic trends. Use for chemistry topics (may pair with 3D molecule meshes). (Body pending Deep Agents skills wiring.)

Health and physiology lessons — body systems, processes, and anatomy. Use for health, medicine, nutrition, and human-biology topics. (Body pending Deep Agents skills wiring.)

History lessons — timelines, cause-and-effect chains, primary sources, and maps. Use for historical and social-studies topics. (Body pending Deep Agents skills wiring.)

Maths lessons — interactive number lines, step-by-step derivations, worked examples and drills. Use for arithmetic, algebra, and geometry topics. (Body pending Deep Agents skills wiring.)

Science lesson guidance for coursegen. Use for biology, physics, earth science, and when lessons need structural 3D, labs, or Canvas Studio inspectable UIs.

Default scroll-page lesson shell — a scrollable interactive mini-app with a clear section rhythm. Use when knobs.presentation is page (or resolves to the default).

Slide-deck lesson shell — one idea per slide with prev/next navigation. Use when knobs.presentation is slide or the learner asked for slides/deck/presentation mode.

Editorial specimen-explorer shell — browsable subject and part rails, a dominant clipped 3D stage, inspect controls, details, microscopy/evidence, and comparison. No quizzes or assessment UI. Hunyuan 3D embeds only in this shell.

Visualization guidance — choosing chart types and canvas interactions, mapping data to visuals. Use when a lesson centers on a chart or interactive visualization. (Body pending Deep Agents skills wiring.)