/* ============================================================
   数轴系列 · 共享样式
   适用：数轴探险家 / 数轴运算器 / 乘方探索器 / 有理数大闯关
   引入：<link rel="stylesheet" href="../../../css/number-line.css">
   ============================================================ */

/* ⚠️ 坑24：全屏Canvas页面必须覆盖 body flex */
html,body{display:block;padding:0;margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#2c3e50}
html{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);min-height:100%}
body{background:transparent;padding:10px}
*{box-sizing:border-box;margin:0;padding:0}
#app{max-width:720px;margin:0 auto;padding:8px}

/* ─── 头部与返回链接 ─── */
.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.header h1{font-size:1.1rem;color:#fff;margin:0;text-shadow:0 1px 3px rgba(0,0,0,0.3)}
.header h1 small{font-size:0.7rem;color:rgba(255,255,255,0.7);font-weight:normal;margin-left:4px}
#backLink{color:rgba(255,255,255,0.85);text-decoration:none;font-size:0.85rem}
#backLink:hover{color:#fff}

/* ─── 故事栏（min-height 防文案跳动） ─── */
.story-line{text-align:center;font-size:0.8rem;color:rgba(255,255,255,0.8);margin-bottom:6px;min-height:1.2em;line-height:1.4;padding:0 4px}

/* ─── 舞台（Canvas 砖块小路） ─── */
.arena{background:#fff;border:1px solid #d0d0d0;border-radius:12px;overflow:hidden;font-family:system-ui,-apple-system,sans-serif}
.arena canvas{display:block;width:100%;height:auto}

/* ─── 信息栏（位置/朝向/速度） ─── */
.info{display:flex;gap:12px;padding:4px 14px 8px;font-size:12px;color:#666;flex-wrap:wrap;justify-content:space-between}
.info span{background:#f0f0f0;padding:2px 10px;border-radius:6px}

/* ─── 尾注 ─── */
.site-footer{text-align:center;padding:12px;color:#bbb;font-size:0.7rem}
.site-footer a{color:#bbb;text-decoration:none}
.site-footer a:hover{color:#fff}