/* ===== Minecraft 学习成长工作台 V1.4 · 样式 =====
 * 视觉方向：Minecraft Resource Center / Server Dashboard
 * 关键词：Pixel UI · Block Interface · Inventory Style · Quest Board · Adventure Map · XP System
 * 原则：70% 清晰学习工作台 + 30% Minecraft 世界氛围；中文正文可读，英文标题像素风。
 * 零外部依赖：无 CDN、无网络字体、无外部图标库。 */

:root{
  /* Minecraft 调色板 */
  --sky-1:#87CEEB; --sky-2:#B0E0E6; --sky-3:#E0F7FA;
  --cloud:#ffffff;
  --grass-1:#7CBD3E; --grass-2:#5D8C3A; --grass-3:#4A7030; --grass-4:#365222;
  --dirt-1:#B88B58; --dirt-2:#8B5A2B; --dirt-3:#6F4E37;
  --stone-1:#2b2b2b; --stone-2:#3a3a3a; --stone-3:#4a4a4a; --stone-4:#5e5e5e; --stone-5:#8a8a8a;
  --wood-1:#F5E6C8; --wood-2:#E6D5B0; --wood-3:#C9B896; --wood-4:#A68B6A;
  --diamond-1:#4AEDD4; --diamond-2:#2AB5A0; --diamond-3:#1F8275;
  --gold-1:#F4D142; --gold-2:#C5A328; --gold-3:#8F7518;
  --red-1:#D9534F; --red-2:#B02E26; --red-3:#7A1C17;
  --xp-1:#7CBD3E; --xp-2:#5A9A2A; --xp-3:#3F711C;
  --ink:#2b2b2b; --paper:#F5F0E6; --card:#FFFDF5; --line:#A68B6A;
  --muted:#7a6f5d;
  --pixel:2px;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;}
body{
  font-family:"Microsoft YaHei","Segoe UI",system-ui,-apple-system,sans-serif;
  color:var(--ink);
  background:
    /* 底部极淡地形 */
    linear-gradient(to top, rgba(74,112,48,.12) 0 60px, transparent 120px),
    /* 天空 */
    linear-gradient(180deg, var(--sky-1) 0%, var(--sky-2) 55%, var(--sky-3) 100%);
  font-size:15px;
  overflow:hidden;
}

/* 像素云（装饰） */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.35;
  background:
    radial-gradient(circle at 12% 14%, #fff 18px, transparent 20px),
    radial-gradient(circle at 14% 12%, #fff 22px, transparent 24px),
    radial-gradient(circle at 18% 16%, #fff 16px, transparent 18px),
    radial-gradient(circle at 62% 10%, #fff 20px, transparent 22px),
    radial-gradient(circle at 66% 8%, #fff 24px, transparent 26px),
    radial-gradient(circle at 70% 12%, #fff 18px, transparent 20px),
    radial-gradient(circle at 86% 18%, #fff 16px, transparent 18px),
    radial-gradient(circle at 88% 16%, #fff 20px, transparent 22px),
    radial-gradient(circle at 36% 22%, #fff 18px, transparent 20px);
}

/* ===== 顶部 HUD ===== */
#topbar{
  position:sticky; top:0; z-index:30;
  height:56px; display:flex; align-items:center; justify-content:space-between;
  padding:0 18px;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.12) 0 6px, transparent 6px 12px),
    linear-gradient(180deg, var(--stone-3), var(--stone-1));
  color:#f3f3f3;
  border-bottom:var(--pixel) solid #000;
  box-shadow:0 4px 0 rgba(0,0,0,.25);
}
.topbar-left{display:flex; align-items:center; gap:10px;}
.topbar-cube{
  width:32px; height:32px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--grass-1), var(--grass-3));
  border:var(--pixel) solid #000; border-top-color:#a8e070; border-left-color:#a8e070;
  font-size:18px; text-shadow:1px 1px 0 #000;
  box-shadow:2px 2px 0 rgba(0,0,0,.35);
}
.topbar-en{font-family:"Courier New",monospace; font-size:13px; font-weight:900; letter-spacing:1.5px; color:#cdeccd; text-shadow:1px 1px 0 #163b16;}
.topbar-zh{font-size:14px; font-weight:700; letter-spacing:1px;}
.topbar-right{display:flex; gap:10px; align-items:center;}
.hud-item{
  display:inline-flex; align-items:center; gap:6px;
  background:linear-gradient(180deg, var(--stone-4), var(--stone-3));
  border:var(--pixel) solid #000; border-top-color:#8a8a8a; border-left-color:#8a8a8a;
  padding:5px 10px; font-size:13px; font-weight:700;
  box-shadow:2px 2px 0 rgba(0,0,0,.3);
}
.hud-item.xp-gold{color:var(--gold-1); text-shadow:1px 1px 0 #000;}
.hud-item.pet-grass{color:var(--grass-1); text-shadow:1px 1px 0 #000;}

/* ===== 外壳布局 ===== */
#app-shell{
  display:flex; min-height:calc(100vh - 56px);
  position:relative; z-index:1;
}

/* ===== 左侧导航：深板岩游戏菜单 ===== */
#sidebar{
  width:230px; flex:0 0 230px;
  background:
    repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 6px, transparent 6px 12px),
    linear-gradient(180deg, var(--stone-2), var(--stone-1));
  color:#e8e8e8; display:flex; flex-direction:column;
  border-right:var(--pixel) solid #000;
  box-shadow:4px 0 0 rgba(0,0,0,.25);
  position:sticky; top:0; height:calc(100vh - 56px);
  /* 修复：允许侧边栏内部纵向滚动，避免矮屏时「待我审核 / 设置」被截断且无法访问 */
  min-height:0;
}
.brand{
  display:flex; align-items:center; gap:10px;
  padding:16px 14px;
  border-bottom:var(--pixel) solid #000;
  background:rgba(0,0,0,.12);
}
.brand-cube{
  width:36px; height:36px; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg, var(--grass-1), var(--grass-3));
  border:var(--pixel) solid #000; border-top-color:#a8e070; border-left-color:#a8e070;
  font-size:20px; text-shadow:1px 1px 0 #000;
  box-shadow:2px 2px 0 rgba(0,0,0,.35);
}
.brand-en{font-family:"Courier New",monospace; font-size:11px; font-weight:900; letter-spacing:1px; color:#aaa;}
.brand-zh{font-size:15px; font-weight:800; letter-spacing:1px;}
/* 修复：nav 占满剩余高度并允许纵向滚动；min-height:0 是 flex 子项可滚动的关键 */
#nav{
  display:flex; flex-direction:column; padding:10px; gap:6px;
  flex:1; min-height:0; overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin;
}
#nav::-webkit-scrollbar{width:8px;}
#nav::-webkit-scrollbar-track{background:rgba(0,0,0,.18);}
#nav::-webkit-scrollbar-thumb{background:#6b6b6b; border:1px solid #000;}
#nav-bottom{padding:10px; border-top:var(--pixel) solid #000; flex-shrink:0;}
.nav-item{
  display:flex; align-items:center; gap:8px; width:100%; text-align:left;
  background:var(--stone-3); color:#e8e8e8;
  border:var(--pixel) solid #000; border-top-color:#6a6a6a; border-left-color:#6a6a6a;
  padding:10px 12px; font-size:14px; cursor:pointer;
  box-shadow:2px 2px 0 rgba(0,0,0,.35);
  transition:background .12s, transform .05s;
}
.nav-item:hover{background:var(--stone-4);}
.nav-item:active{transform:translate(2px,2px); box-shadow:0 0 0 rgba(0,0,0,.35);}
.nav-item.active{
  background:linear-gradient(180deg, var(--grass-2), var(--grass-3));
  border-color:#1a330f; border-top-color:#8cd65a; border-left-color:#8cd65a;
  color:#fff; text-shadow:1px 1px 0 #1a330f;
}
.nav-ico{font-size:18px; width:24px; text-align:center; flex:0 0 24px;}
.nav-main{font-weight:700;}
.nav-sub{
  margin-left:auto; font-family:"Courier New",monospace; font-size:9px; letter-spacing:.5px;
  color:#aaa; font-weight:700;
}
.nav-item.active .nav-sub{color:#cdeccd;}

/* ===== 主内容区 ===== */
#main{flex:1; min-width:0; padding:22px 28px 40px; overflow-y:auto; height:calc(100vh - 56px);}
#app{max-width:1280px; margin:0 auto;}

/* ===== 英文像素标题 ===== */
.mc-en{font-family:"Courier New",monospace; font-weight:900; letter-spacing:2px; text-transform:uppercase;}

/* ===== 卡片系统：Inventory / Parchment Panel ===== */
.card{
  background:var(--card);
  border:var(--pixel) solid var(--wood-4); border-top-color:#fff; border-left-color:#fff;
  padding:16px 18px; margin-bottom:18px;
  box-shadow:4px 4px 0 rgba(80,60,40,.25);
}
.panel{
  background:linear-gradient(180deg, var(--stone-4), var(--stone-3));
  color:#f3f3f3; border:var(--pixel) solid #000; border-top-color:#8a8a8a; border-left-color:#8a8a8a;
  padding:14px 16px; margin-bottom:16px;
  box-shadow:4px 4px 0 rgba(0,0,0,.25);
}
.muted{color:var(--muted);} .small{font-size:13px;}

/* ===== 区块标题 ===== */
.sec-title{
  display:flex; align-items:center; gap:8px; margin:0 0 14px; padding-bottom:8px;
  border-bottom:var(--pixel) solid var(--wood-3);
  font-size:18px; font-weight:800; letter-spacing:.5px;
}
.sec-title.sub{font-size:15px; margin-top:14px;}
.sec-title .en{
  margin-left:auto; font-family:"Courier New",monospace; font-size:11px; letter-spacing:2px;
  color:var(--muted); text-transform:uppercase; font-weight:900;
}

/* ===== Hero：基地入口 ===== */
.hero{
  background:
    linear-gradient(180deg, rgba(124,189,62,.9), rgba(74,112,48,.95)),
    linear-gradient(180deg, var(--grass-2), var(--grass-3));
  border:var(--pixel) solid #1a330f; border-top-color:#8cd65a; border-left-color:#8cd65a;
  padding:18px 20px; margin-bottom:20px;
  box-shadow:4px 4px 0 rgba(0,0,0,.3);
  position:relative;
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:8px;
  background:repeating-linear-gradient(90deg, var(--dirt-2) 0 12px, var(--dirt-3) 12px 24px);
  border-top:var(--pixel) solid #4a2e12;
}
.hero-en{font-family:"Courier New",monospace; font-size:13px; letter-spacing:3px; color:#eaffd8; text-shadow:1px 1px 0 #1a330f;}
.hero-zh{font-size:22px; font-weight:900; letter-spacing:2px; color:#fff; text-shadow:2px 2px 0 #1a330f; margin-bottom:12px;}
.statusbar{display:flex; flex-wrap:wrap; gap:8px 12px; align-items:center;}
.statusbar.hud{
  background:linear-gradient(180deg, var(--stone-3), var(--stone-2));
  color:#f3f3f3; border:var(--pixel) solid #000; border-top-color:#6a6a6a; border-left-color:#6a6a6a;
  padding:12px 16px; margin-bottom:18px;
  box-shadow:3px 3px 0 rgba(0,0,0,.3); text-shadow:1px 1px 0 #000;
}

/* ===== 标签 chip ===== */
.chip{
  display:inline-flex; align-items:center; gap:4px;
  padding:3px 10px; font-size:12px; font-weight:700;
  border:var(--pixel) solid rgba(0,0,0,.2);
  box-shadow:1px 1px 0 rgba(0,0,0,.15);
}
.chip.green{background:#eaf6dd; color:var(--grass-3);}
.chip.blue{background:#dff7f2; color:var(--diamond-3);}
.chip.gold{background:#fdf3d4; color:var(--gold-3);}
.chip.red{background:#f9e0de; color:var(--red-2);}
.chip.muted{background:#eee; color:var(--muted);}
.chip.xs{padding:1px 6px; font-size:11px;}
.chip.subject-eng{background:#dff7f2; color:#1f7e9c;}
.chip.subject-chs{background:#f9e6d4; color:#8b5a2b;}
.chip.subject-math{background:#fdf3d4; color:#8f7518;}

/* ===== 学期目标 / 进度条 ===== */
.goals{list-style:none; padding:0; margin:0 0 12px; display:flex; gap:10px; flex-wrap:wrap;}
.goals li{
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  padding:9px 14px; flex:1; min-width:160px;
  box-shadow:3px 3px 0 rgba(120,100,70,.2);
}
.xpbar{
  position:relative; height:20px;
  background:#3a3a3a; border:var(--pixel) solid #000; border-top-color:#5a5a5a; border-left-color:#5a5a5a;
  overflow:hidden; margin:6px 0 2px;
  box-shadow:inset 1px 1px 0 rgba(0,0,0,.4);
}
.xpfill{
  height:100%;
  background:repeating-linear-gradient(90deg, var(--xp-1) 0 10px, var(--xp-2) 10px 12px);
  border-right:var(--pixel) solid var(--xp-3);
  transition:width .25s;
}

/* ===== 链接 ===== */
.link{color:var(--diamond-2); font-weight:700; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:4px; margin-top:6px;}
.link:hover{text-decoration:underline;}

/* ===== 宠物状态条 ===== */
.bars{display:flex; flex-direction:column; gap:6px; margin:10px 0;}
.bar{display:flex; align-items:center; gap:8px; font-size:12px;}
.bar-label{width:34px; flex:0 0 34px; color:var(--muted); font-weight:700;}
.bar-track{flex:1; height:14px; background:#3a3a3a; border:var(--pixel) solid #000; border-top-color:#5a5a5a; border-left-color:#5a5a5a; overflow:hidden; box-shadow:inset 1px 1px 0 rgba(0,0,0,.4);}
.bar-fill{display:block; height:100%; background:repeating-linear-gradient(90deg, var(--grass-1) 0 8px, var(--grass-2) 8px 10px); border-right:var(--pixel) solid var(--grass-3);}
.bar-val{width:28px; flex:0 0 28px; text-align:right; font-weight:800;}
.bar-status{margin-left:8px; font-size:11px; font-weight:700; color:var(--muted); flex:0 0 auto;}
.bar-green .bar-fill{background:repeating-linear-gradient(90deg, var(--grass-1) 0 8px, var(--grass-2) 8px 10px); border-right:var(--pixel) solid var(--grass-3);}
.bar-green .bar-status{color:var(--grass-3);}
.bar-amber .bar-fill{background:repeating-linear-gradient(90deg, #f4c542 0 8px, #e3a008 8px 10px); border-right:var(--pixel) solid #a86d00;}
.bar-amber .bar-status{color:#a86d00;}
.bar-low .bar-fill{background:repeating-linear-gradient(90deg, #e98c3a 0 8px, #d2631a 8px 10px); border-right:var(--pixel) solid #9a4310;}
.bar-low .bar-status{color:#b1500f;}

/* ===== 宠物盒 ===== */
.pet-box{
  text-align:center; background:linear-gradient(180deg, #eef0ea, #e3e6dc);
  border:var(--pixel) solid var(--wood-4); border-top-color:#fff; border-left-color:#fff;
  padding:18px; box-shadow:3px 3px 0 rgba(80,60,40,.2);
}
.pet-thumb{
  display:flex; align-items:center; justify-content:center; margin:0 auto;
  width:96px; height:96px; background:#fff;
  border:var(--pixel) solid #000; border-top-color:#bbb; border-left-color:#bbb;
  box-shadow:inset 2px 2px 0 rgba(0,0,0,.15), 2px 2px 0 rgba(0,0,0,.2);
}
.pet-thumb img{width:100%; height:100%; object-fit:contain; image-rendering:pixelated;}
.pet-thumb.big{width:140px; height:140px;}
.pet-emoji{font-size:64px;}
.pet-emoji.big{font-size:92px;}
.pet-name{font-weight:800; margin-top:12px; font-size:16px;}
.pet-empty{text-align:center; padding:20px;}
.pet-picks{display:grid; grid-template-columns:repeat(auto-fill, minmax(110px,1fr)); gap:14px; margin-top:14px;}
.pet-card{
  display:flex; flex-direction:column; align-items:center; gap:6px; padding:12px 8px;
  background:#fff; border:var(--pixel) solid var(--wood-4); border-top-color:#fff; border-left-color:#fff;
  cursor:pointer; box-shadow:2px 2px 0 rgba(80,60,40,.2);
  transition:transform .05s, background .1s;
}
.pet-card:hover{background:#f7f5ed;}
.pet-card:active{transform:translate(2px,2px); box-shadow:1px 1px 0 rgba(80,60,40,.2);}
.pet-card img{width:72px; height:72px; object-fit:contain; image-rendering:pixelated;}
.pet-card-name{font-size:13px; font-weight:700; color:var(--ink);}
.pet-actions{display:flex; gap:8px; flex-wrap:wrap; margin-top:14px; justify-content:center;}
/* ===== 宠物 V2：低状态提示 / 飘字 / 规则 ===== */
.pet-box{position:relative;}
.pet-hints{margin:8px 0 0; display:flex; flex-direction:column; gap:4px;}
.pet-hint{font-size:13px; color:#a85b16; background:#fff4e3; border:var(--pixel) solid #e9c89a; padding:6px 10px; box-shadow:2px 2px 0 rgba(120,80,20,.15);}
.pet-float{
  position:absolute; left:50%; top:10px; transform:translateX(-50%);
  background:rgba(20,20,20,.78); color:#fff; padding:6px 12px; border-radius:10px;
  font-size:14px; font-weight:700; pointer-events:none; z-index:6;
  animation:petfloat 2.5s ease forwards;
}
@keyframes petfloat{0%{opacity:0; transform:translate(-50%,6px);}15%{opacity:1; transform:translate(-50%,0);}80%{opacity:1;}100%{opacity:0; transform:translate(-50%,-10px);}}
.set-sub{font-size:12px; font-weight:800; color:var(--ink); margin:10px 0 4px; opacity:.8;}
.pet-home-card:hover{background:#fffdf6;}

/* ===== 学习任务 Quest Board ===== */
.week-switch{display:flex; gap:8px; align-items:center; flex-wrap:wrap; margin-bottom:14px;}
.wk-label{font-weight:800; font-size:15px; background:#faf5e6; padding:5px 10px; border:var(--pixel) solid var(--wood-3);}
.quest-board{overflow-x:auto; border:var(--pixel) solid var(--wood-4); background:#e8dfc8; margin-bottom:14px;}
table.map,table.gmap{width:100%; border-collapse:separate; border-spacing:var(--pixel); font-size:13px; min-width:680px;}
table.map th,table.map td,table.gmap th,table.gmap td{
  border:var(--pixel) solid #8a7a60; border-top-color:#fff8e8; border-left-color:#fff8e8;
  padding:7px 6px; text-align:center; background:#f5f0e3;
}
table.map th,table.gmap th{background:#e6d9b8; font-weight:800;}
.tname{text-align:left; font-weight:700; min-width:180px; padding-left:10px;}
.t-sub{color:var(--muted); font-size:11px; font-weight:400; margin-left:5px;}
.req{color:var(--grass-3); font-size:11px; font-weight:700; margin-left:4px;}
.tops{white-space:nowrap;}
.cell{cursor:pointer; font-weight:800; min-width:42px; background:#fff; transition:background .1s;}
.cell:hover{background:#fff7d6;}
.cell-done{color:var(--grass-3); background:#d8eed0;}
.cell-none{color:var(--muted); background:#faf7ed;}
.cell-lock{color:#bbb; background:#ece7d8;}
.btn.up{color:var(--grass-3);} .btn.down{color:var(--diamond-3);}
.sign{
  background:linear-gradient(180deg, #e6d5b0, #d4c39a);
  border:var(--pixel) solid #6b4f2a; border-top-color:#f7ebcf; border-left-color:#f7ebcf;
  padding:12px 14px; color:#3a2a12;
  box-shadow:3px 3px 0 rgba(80,55,20,.35); font-size:13px;
}

/* ===== 规则标签 ===== */
.rule-tag{
  display:inline-block; font-size:11px; font-weight:700; padding:1px 7px;
  border:var(--pixel) solid #000; margin-left:6px; vertical-align:middle;
  box-shadow:1px 1px 0 rgba(0,0,0,.25); letter-spacing:.5px;
}
.rule-tag.dy{background:#dff7f2; color:var(--diamond-3); border-top-color:#bfece3; border-left-color:#bfece3;}
.rule-tag.wk{background:#fdf3d4; color:var(--gold-3); border-top-color:#fce7ab; border-left-color:#fce7ab;}

/* ===== 本周待完成 / 缺口 ===== */
.gap-line{font-weight:800; margin:14px 0 6px; font-size:15px; color:var(--grass-3);}
.gap-line.done{color:var(--grass-3);}
.gap-block{
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  padding:12px 14px; margin-top:6px; margin-bottom:14px;
  box-shadow:3px 3px 0 rgba(80,60,40,.2);
}
.gap-head{font-weight:800; margin-bottom:8px; font-size:14px; color:var(--gold-3);}
.gap-list{margin:0; padding-left:20px;}
.gap-list li{margin:4px 0; font-size:14px;}

/* ===== 按钮系统 ===== */
.btn{
  font-family:inherit; font-size:14px; cursor:pointer;
  background:linear-gradient(180deg, #d6cbb0, #c4b69a);
  border:var(--pixel) solid #000; border-top-color:#f7f1e3; border-left-color:#f7f1e3;
  padding:8px 14px; color:var(--ink); font-weight:700;
  box-shadow:2px 2px 0 rgba(0,0,0,.3);
  transition:transform .05s, background .1s;
}
.btn:active{transform:translate(2px,2px); box-shadow:0 0 0 rgba(0,0,0,.3);}
.btn:hover{filter:brightness(1.05);}
.btn:disabled{opacity:.5; cursor:not-allowed; box-shadow:none;}
.btn.sm{padding:5px 10px; font-size:13px;}
.btn.xs{padding:3px 8px; font-size:12px; box-shadow:1px 1px 0 rgba(0,0,0,.3);}
/* 草方块主按钮 */
.btn.primary{
  background:linear-gradient(180deg, var(--grass-1), var(--grass-2));
  color:#fff; border-color:#1a330f; border-top-color:#a8e070; border-left-color:#a8e070;
  text-shadow:1px 1px 0 #1a330f;
}
.btn.primary:hover{background:linear-gradient(180deg, #8bd650, var(--grass-2));}
/* 钻石蓝 */
.btn.blue{
  background:linear-gradient(180deg, var(--diamond-1), var(--diamond-2));
  color:#fff; border-color:#145c52; border-top-color:#a8f5e8; border-left-color:#a8f5e8;
  text-shadow:1px 1px 0 #145c52;
}
/* 金按钮 */
.btn.gold{
  background:linear-gradient(180deg, var(--gold-1), var(--gold-2));
  color:#3a2a05; border-color:#7a6215; border-top-color:#fff3b8; border-left-color:#fff3b8;
}
/* 红石红 */
.btn.danger{
  background:linear-gradient(180deg, var(--red-1), var(--red-2));
  color:#fff; border-color:#4a1210; border-top-color:#f2a8a4; border-left-color:#f2a8a4;
  text-shadow:1px 1px 0 #4a1210;
}
/* TNT · 高风险操作（家长积分清零）：比 danger 更醒目 */
.btn.tnt{
  background:repeating-linear-gradient(45deg, #b81d1d, #b81d1d 10px, #8c1414 10px, #8c1414 20px);
  color:#fff; border-color:#3a0a0a; border-top-color:#ff9c9c; border-left-color:#ff9c9c;
  font-weight:900; letter-spacing:.5px; text-shadow:1px 1px 0 #3a0a0a;
  box-shadow:3px 3px 0 rgba(60,10,10,.35);
}
.btn.tnt:disabled{ background:#c9b8b8; color:#7a6a6a; border-color:#9a8a8a; text-shadow:none; box-shadow:2px 2px 0 rgba(0,0,0,.1); cursor:not-allowed; opacity:.85; }

/* ===== 积分管理（家长） ===== */
.ledger-mini{display:flex; gap:14px; flex-wrap:wrap; margin:6px 0 4px;}
.ledger-mini > div{background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff; padding:8px 12px; box-shadow:2px 2px 0 rgba(80,60,40,.15);}
.lm-val{font-size:22px; font-weight:900; color:var(--grass-3);}
.lm-label{font-size:12px; color:var(--muted); margin-left:6px; font-weight:700;}
.adj-actions{display:flex; gap:10px; flex-wrap:wrap; margin:6px 0;}
.adj-quick{display:flex; gap:6px; margin:6px 0;}
.warn-banner{background:#ffe9b8; border:var(--pixel) solid #d99b1f; color:#7a5210; font-weight:900; padding:10px 12px; margin:8px 0; text-shadow:1px 1px 0 #fff3d0;}
.modal-err{font-size:13px;}
.btn.primary:disabled, .btn.primary.disabled{opacity:.5; cursor:not-allowed;}

/* ===== XP 账本摘要 HUD（5 卡自适应） ===== */
.xp-ledger{display:grid; grid-template-columns:repeat(auto-fit, minmax(110px,1fr)); gap:12px; margin-bottom:18px;}

/* ===== 成长行为卡片 ===== */
.behaviors{display:flex; flex-direction:column; gap:0;}
.behavior{
  display:flex; align-items:center; gap:12px; justify-content:space-between;
  padding:12px 14px; background:#faf5e6;
  border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  margin-bottom:10px; box-shadow:2px 2px 0 rgba(80,60,40,.15);
}
.behavior.disabled{opacity:.6;}
.behavior.got{background:#e4f3d9; border-color:var(--grass-2);}
.behavior .b-name{font-weight:700;}
.behavior .b-pts{color:var(--grass-3); font-weight:800;}
.behavior .b-desc{font-size:12px; color:var(--muted); margin-top:3px;}
.behavior .b-ops{display:flex; gap:6px; align-items:center; flex-wrap:wrap;}

/* ===== XP 账本摘要 HUD ===== */
.xp-ledger{display:grid; grid-template-columns:repeat(4,1fr); gap:12px; margin-bottom:18px;}
.ledger-card{
  background:var(--card); border:var(--pixel) solid var(--wood-4); border-top-color:#fff; border-left-color:#fff;
  padding:14px; text-align:center; box-shadow:3px 3px 0 rgba(80,60,40,.2);
}
.ledger-card.blue{border-color:var(--diamond-3);} .ledger-card.red{border-color:var(--red-2);} .ledger-card.gold{border-color:var(--gold-3);}
.ledger-card.purple{border-color:#7b4bd6;}
.ledger-val{font-size:28px; font-weight:900; color:var(--grass-3); text-shadow:1px 1px 0 rgba(0,0,0,.08);}
.ledger-card.blue .ledger-val{color:var(--diamond-3);} .ledger-card.red .ledger-val{color:var(--red-2);} .ledger-card.gold .ledger-val{color:var(--gold-3);}
.ledger-card.purple .ledger-val{color:#7b4bd6;}
.ledger-label{font-size:12px; color:var(--muted); margin-top:4px; font-weight:700;}

/* ===== 今日成长记录 ===== */
.rec-list{border:var(--pixel) solid var(--wood-3); background:#faf5e6; margin-bottom:8px;}
.rec-item{display:flex; align-items:center; gap:10px; padding:9px 12px; border-bottom:var(--pixel) solid var(--wood-2); font-size:13px;}
.rec-item:last-child{border-bottom:none;}
.rec-main{flex:1;}
.rec-pts{color:var(--grass-3); font-weight:800; margin-left:6px;}
.rec-note{color:var(--muted); font-size:12px; margin-top:2px;}

/* ===== GROWTH MAP ===== */
.gmap .bname{text-align:left; font-weight:700; min-width:120px; padding-left:8px;}
.gcell{cursor:pointer; font-weight:800; min-width:42px; background:#fff;}
.gcell-on{color:var(--grass-3); background:#d8eed0;}
.gcell-on:hover{background:#c5e6b8;}
.gcell-empty{color:var(--muted); background:#faf7ed;}
.gcell-empty:hover{background:#fff7d6; color:var(--grass-3);}
.gcell-off{color:#bbb; background:#ece7d8;}
.gcell-future{color:#ccc; background:#ece7d8; cursor:not-allowed;}
.wk-count{font-weight:800; color:var(--diamond-3);}
.day-total{font-weight:800; color:var(--gold-3); background:#fdf3d4;}
.day-xp-row td{background:#fff8e6;}

/* ===== 本周成长表现 / 趋势 ===== */
.tiers{display:flex; flex-direction:column; gap:10px; margin-bottom:6px;}
.tier{
  border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  padding:10px 12px; background:#faf5e6; box-shadow:2px 2px 0 rgba(80,60,40,.15);
}
.tier-best{border-color:var(--gold-3); background:#fdf3d4;}
.tier-form{border-color:var(--grass-3); background:#eaf6dd;}
.tier-watch{border-color:var(--diamond-3); background:#dff7f2;}
.tier-title{font-weight:800; margin-bottom:6px;}
.tier-items{display:flex; flex-wrap:wrap; gap:8px;}
.tier-item{background:#fff; border:var(--pixel) solid var(--wood-3); padding:2px 10px; font-size:13px; font-weight:700;}
.daily-xp{display:flex; flex-direction:column; gap:7px;}
.xp-row{display:flex; align-items:center; gap:10px;}
.xp-name{width:90px; flex:0 0 90px; font-size:13px; font-weight:700;}
.xp-bar{display:flex; gap:3px; flex:1;}
.xp-cell{width:14px; height:18px; border:var(--pixel) solid #000; background:#d6cbb0;}
.xp-cell.on{background:repeating-linear-gradient(90deg, var(--xp-1) 0 6px, var(--xp-2) 6px 8px); border-color:#2f6b1d;}
.xp-num{width:40px; flex:0 0 40px; text-align:right; font-weight:800; color:var(--grass-3);}

/* ===== 阅读书架：Inventory Item ===== */
.shelf{display:flex; flex-wrap:wrap; gap:14px;}
.book{
  width:170px; background:linear-gradient(180deg, #faf5e6, #f2ead3);
  border:var(--pixel) solid var(--wood-4); border-top-color:#fff; border-left-color:#fff;
  padding:14px; position:relative; box-shadow:3px 3px 0 rgba(80,60,40,.22);
  display:flex; flex-direction:column; align-items:center; text-align:center;
}
.book.reading{border-left:5px solid var(--gold-2);}
.book.done{border-left:5px solid var(--grass-2);}
.bk-emoji{font-size:36px; margin-bottom:4px;}
.bk-name{font-weight:700; font-size:14px; margin:4px 0;}
.bk-ops{display:flex; gap:6px; margin-top:auto; padding-top:8px;}
.stars{color:var(--gold-2); letter-spacing:1px; margin-top:6px;}

/* ===== 宠物规则内联编辑器 ===== */
.pet-note{margin-top:12px; font-size:12px; color:var(--muted); line-height:1.5;}
.pet-rules{
  margin-top:14px; padding:12px;
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  box-shadow:2px 2px 0 rgba(80,60,40,.15);
}
.pet-rules-title{font-weight:800; font-size:13px; margin-bottom:8px; color:var(--ink);}
.pet-rule-row{display:flex; align-items:center; gap:10px; padding:6px 0;}
.pet-rule-row .pr-emoji{width:22px; flex:0 0 22px; font-size:15px; text-align:center;}
.pet-rule-row .pr-label{width:42px; flex:0 0 42px; font-weight:700; font-size:13px;}
.pet-rule-row .pr-field{display:inline-flex; align-items:center; gap:5px; flex:1; font-size:12px; color:var(--muted); width:auto;}
.pet-rule-row .pr-field input{
  width:54px; flex:0 0 54px; padding:5px 6px;
  border:var(--pixel) solid var(--wood-3); font-family:inherit; font-size:14px; text-align:center; background:#fff;
}

/* ===== Minecraft 兑换：Game Portal ===== */
.mc-rules{
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  padding:10px 12px; font-size:13px; color:var(--muted); margin-bottom:14px;
}
.gates{display:flex; flex-direction:column; gap:10px;}
.gate{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:12px 14px; background:#faf5e6;
  border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
}
.gate-done{background:#e4f3d9; border-color:var(--grass-3);}
.gate-lock{opacity:.85;}
.gate-icon{font-size:24px;}
.gate-label{font-weight:700; flex:1; margin-left:8px;}
.lock-banner{
  padding:14px 16px; margin-bottom:14px; font-weight:700;
  border:var(--pixel) solid #000; box-shadow:3px 3px 0 rgba(0,0,0,.2);
}
.lock-banner.open{background:#e4f3d9; color:var(--grass-3); border-color:var(--grass-3);}
.lock-banner.closed{background:#f3d6d4; color:var(--red-2); border-color:var(--red-2);}
.exchange-grid{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px;}
.portal-visual{
  text-align:center; padding:14px; margin-bottom:14px;
  background:linear-gradient(180deg, #3a1f5e, #1a0f2e);
  border:var(--pixel) solid #000; border-top-color:#6a4a8a; border-left-color:#6a4a8a;
  color:#d8b8f0; font-family:"Courier New",monospace; font-weight:900; letter-spacing:2px;
  box-shadow:4px 4px 0 rgba(0,0,0,.3);
}

/* ===== 成长档案：Adventure Log ===== */
.archive-switch{display:flex; gap:8px; margin-bottom:14px;}
.agg{
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  padding:12px 14px; box-shadow:3px 3px 0 rgba(80,60,40,.18); margin-bottom:12px;
}
.growth-obsv{
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-left:5px solid var(--grass-2);
  padding:12px 14px; font-size:14px; line-height:1.6;
}

/* ===== 设置：Game Settings ===== */
.set-row{display:flex; align-items:center; gap:12px; padding:9px 0; border-bottom:var(--pixel) dashed var(--wood-3);}
.set-row label{width:170px; flex:0 0 170px; font-weight:700;}
.set-row input,.set-row select,.set-row textarea{flex:1; padding:7px 9px; border:var(--pixel) solid var(--wood-3); font-family:inherit; font-size:14px; background:#fff;}
.set-list{margin:12px 0;}
.daycb{display:inline-flex; align-items:center; gap:3px; margin-right:10px; font-size:14px;}
.daychecks{display:flex; flex-wrap:wrap; gap:4px; margin-bottom:10px;}
.ck{display:flex; align-items:center; gap:6px; font-size:14px; margin:6px 0;}
label{display:block; font-weight:700; margin:8px 0 4px; font-size:14px;}
input,select,textarea{
  width:100%; padding:9px; border:var(--pixel) solid var(--wood-3);
  font-family:inherit; font-size:14px; margin-bottom:10px; background:#fff; font-size:15px;
}

/* ===== 弹窗 ===== */
.modal-mask{position:fixed; inset:0; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; z-index:50;}
.modal{
  background:#fff; border:var(--pixel) solid #000; border-top-color:#8a8a8a; border-left-color:#8a8a8a;
  width:min(480px,94vw); box-shadow:0 8px 30px rgba(0,0,0,.35);
  max-height:85vh; display:flex; flex-direction:column; overflow:hidden;
}
.modal-head{padding:16px 20px 12px; border-bottom:var(--pixel) solid var(--wood-3); flex:0 0 auto;}
.modal-head h3{margin:0; font-size:17px;}
.modal-body{padding:14px 20px; overflow-y:auto; flex:1 1 auto;}
.modal-foot{position:sticky; bottom:0; background:#fff; border-top:var(--pixel) solid var(--wood-3); padding:12px 20px; display:flex; gap:10px; justify-content:flex-end; flex:0 0 auto;}
.modal-body label{font-weight:700; margin:8px 0 4px; font-size:14px;}
.modal-body input,.modal-body select,.modal-body textarea{width:100%; padding:9px; border:var(--pixel) solid var(--wood-3); font-family:inherit; font-size:15px; margin-bottom:10px; background:#fff;}
.rec-preview{background:#faf5e6; border:var(--pixel) solid var(--wood-3); padding:10px 12px; margin-bottom:10px;}
.rec-preview .b-pts{color:var(--grass-3); font-weight:800; margin-left:4px;}
/* 评分参考 */
.rubric{background:#f3f7ee; border:var(--pixel) solid var(--grass-2); padding:10px 12px; margin-bottom:10px;}
.rubric-title{font-weight:800; color:var(--grass-3); margin-bottom:4px; font-size:13px;}
.rubric-body{font-size:13px; color:#3a4a2e; white-space:pre-line; line-height:1.5;}
/* 按钮式评分 */
.score-btns{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:6px;}
.score-btn{margin:0; min-width:52px; background:#e9eef0; border-color:var(--wood-3); color:#333;}
.score-btn.sel{background:var(--grass-2); border-color:var(--grass-3); color:#fff; box-shadow: inset 0 0 0 2px #fff;}
/* 鼓励语 */
.encourage{margin-top:14px; padding:10px 12px; background:#f3f7ee; border:var(--pixel) dashed var(--grass-2);
  border-radius:0; font-size:13px; color:#3a4a2e; line-height:1.6;}
.detail-name{font-size:17px; font-weight:800; margin-bottom:10px;}
.detail-row{display:flex; gap:12px; padding:6px 0; border-bottom:var(--pixel) dashed var(--wood-3); font-size:14px;}
.detail-row span{width:60px; flex:0 0 60px; color:var(--muted);}

/* ===== 角色标识 / 待审核 HUD ===== */
.role-pill{padding:4px 10px; font-weight:800; font-size:12px; border:var(--pixel) solid #000; box-shadow:1px 1px 0 rgba(0,0,0,.3);}
.role-pill.child{background:linear-gradient(180deg,#cfe9ff,#a9d4f5); color:#0b3d63; border-top-color:#eaf6ff; border-left-color:#eaf6ff;}
.role-pill.parent{background:linear-gradient(180deg,#ffd9ec,#f5a9d4); color:#5a0f3a; border-top-color:#ffeaf5; border-left-color:#ffeaf5;}
.hud-item.xp-pending{color:var(--gold-2); text-shadow:1px 1px 0 #000;}
/* 普通信息 HUD 不显示指针手势（默认光标） */
.hud-item{cursor:default;}
/* 家长模式顶部「待审核」按钮：真正可点击，带明显交互反馈 */
.hud-review-btn{
  font:inherit;
  font-size:13px; font-weight:700; /* 与 .hud-item 保持一致，避免 font:inherit 重置后视觉跑偏 */
  color:inherit;
  cursor:pointer;
}
.hud-review-btn:hover{filter:brightness(1.15);}
.hud-review-btn:active{transform:translate(2px,2px); box-shadow:none;}

/* ===== 家长审核卡片 ===== */
.review-card{
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  padding:12px 14px; margin-bottom:12px; box-shadow:2px 2px 0 rgba(80,60,40,.15);
}
.review-head{font-size:15px; font-weight:800; margin-bottom:6px; display:flex; flex-wrap:wrap; gap:8px; align-items:center;}
.review-tags{margin:4px 0;}
.review-note{background:#fff; border:var(--pixel) solid var(--wood-2); padding:8px 10px; margin:6px 0; font-size:14px; line-height:1.5;}
.review-ops{display:flex; gap:8px; flex-wrap:wrap; margin-top:8px;}
.req-list{display:flex; flex-direction:column; gap:0;}

/* ===== 孩子申请：分值选择 / 标签 ===== */
.apply-scores{display:flex; flex-wrap:wrap; gap:10px; margin:6px 0 4px;}
.apply-score{
  flex:1 1 120px; min-height:64px; cursor:pointer; text-align:left;
  background:#faf5e6; border:var(--pixel) solid var(--wood-3); border-top-color:#fff; border-left-color:#fff;
  padding:10px 12px; box-shadow:2px 2px 0 rgba(80,60,40,.15); transition:background .1s, transform .05s;
}
.apply-score:active{transform:translate(2px,2px); box-shadow:1px 1px 0 rgba(80,60,40,.15);}
.apply-score.sel{background:linear-gradient(180deg,var(--grass-1),var(--grass-2)); border-color:#1a330f; border-top-color:#a8e070; border-left-color:#a8e070; color:#fff; text-shadow:1px 1px 0 #1a330f;}
.as-score{font-weight:900; font-size:16px;}
.as-text{font-size:12px; margin-top:3px; line-height:1.4;}
.tag-list{display:flex; flex-wrap:wrap; gap:8px; margin:4px 0;}
.tagcb{display:inline-flex; align-items:center; gap:4px; font-size:14px; background:#faf5e6; border:var(--pixel) solid var(--wood-3); padding:6px 10px;}
.rubric-line{margin:3px 0; font-size:13px; line-height:1.5;}
.tier-items{display:flex; flex-wrap:wrap; gap:8px;}

/* ===== 轻提示 ===== */
#toast{position:fixed; left:50%; bottom:30px; transform:translateX(-50%); background:#2b2b2b; color:#fff; padding:10px 18px; font-size:14px; opacity:0; pointer-events:none; transition:opacity .2s; z-index:60; border:var(--pixel) solid #000; box-shadow:3px 3px 0 rgba(0,0,0,.3);}
#toast.show{opacity:1;}

/* ===== 响应式 ===== */
/* 家长专属元素：孩子模式下隐藏 */
.mode-child .parent-only{display:none !important;}

@media (max-width:900px){
  #app-shell{flex-direction:column;}
  #sidebar{width:100%; flex:none; height:auto; position:relative; flex-direction:row; flex-wrap:wrap; align-items:center; box-shadow:none; border-right:none; border-bottom:var(--pixel) solid #000;}
  #nav{flex-direction:row; flex-wrap:wrap; padding:8px; overflow:visible;}
  #nav-bottom{border-top:none; border-left:var(--pixel) solid #000; padding:8px;}
  .brand{border-bottom:none; border-right:var(--pixel) solid #000;}
  .nav-item{width:auto; box-shadow:2px 2px 0 rgba(0,0,0,.35);}
  #main{padding:16px; height:auto;}
  .xp-ledger{grid-template-columns:repeat(2,1fr);}
  table.map,table.gmap{font-size:12px;}
  .tname{min-width:140px;}
  /* 顶部 HUD 在手机上换行显示，不隐藏（模式标识 / 正式积分 / 待审核必须可见） */
  #topbar{height:auto; min-height:56px; flex-wrap:wrap; padding:6px 10px; gap:6px;}
  .topbar-right{flex-wrap:wrap; gap:6px; width:100%; justify-content:flex-start;}
  .hud-item{font-size:12px; padding:4px 8px;}
}

/* 手机竖屏：左侧导航收到底部，固定停靠，便于单手操作 */
@media (max-width:640px){
  #app-shell{flex-direction:column;}
  #sidebar{
    order:3; position:fixed; left:0; right:0; bottom:0; top:auto; z-index:40;
    width:100%; flex:none; flex-direction:row; flex-wrap:nowrap; overflow-x:auto;
    border-right:none; border-top:var(--pixel) solid #000; box-shadow:0 -4px 0 rgba(0,0,0,.25);
    padding:6px; gap:4px;
  }
  #nav,#nav-bottom{flex-direction:row; flex-wrap:nowrap; padding:0; gap:4px; border:none;}
  #nav-bottom{border-left:none;}
  /* 手机端：横向滚动由 #sidebar(overflow-x:auto) 承担，nav 自身不设纵向滚动 */
  #nav{overflow-x:visible; overflow-y:visible; min-height:0;}
  .brand{display:none;}
  .nav-item{flex:0 0 auto; flex-direction:column; gap:2px; padding:8px 10px; font-size:11px; min-height:44px; text-align:center;}
  .nav-ico{font-size:18px;}
  .nav-sub{display:none;}
  .nav-main{font-size:11px;}
  #main{padding:12px 12px 90px;}
  /* 触控目标不小于 44px */
  .btn,.nav-item,.chip,.apply-score,.score-btn,.tagcb{min-height:44px; min-width:44px; display:inline-flex; align-items:center; justify-content:center;}
  .apply-score{display:block;}
  .apply-score .as-score,.apply-score .as-text{display:block;}
  /* 弹窗不溢出屏幕 */
  .modal{width:min(480px,94vw); max-height:88vh;}
  .modal-body{max-height:64vh;}
  /* 家长审核卡片单列 */
  .review-card{margin-bottom:12px;}
  .review-ops .btn{width:100%;}
}

/* 平板横屏 / 竖屏通用 */
@media (min-width:641px) and (max-width:1100px){
  #sidebar{width:190px; flex:0 0 190px;}
  #main{padding:18px 20px 36px;}
}