/* 珠海校徽版外壳 UI —— 配色贴合原版「合成大西瓜」的奶油黄 + 木色 */
:root{
  --cream:#ffefc4; --cream2:#ffe3a0; --wood:#b5763c; --wood2:#8a5426;
  --ink:#7a4a12; --ink2:#9c6b2f; --line:rgba(160,110,40,.28);
  --orange:#ff9f1c; --orange2:#ff7a00;
}
#zhPicker, #zhRestart, #zhFileWarn{
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  -webkit-tap-highlight-color:transparent;
}

/* ---------------- 开局免责声明 ---------------- */
#zhDisclaimer{
  position:fixed; inset:0; z-index:100000; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(180deg,#fff6dc,#ffe3a0); padding:20px;
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink); overflow:auto;
}
#zhDisclaimer.hide{display:none}
.zh-dis-box{
  width:100%; max-width:440px; background:#fffdf5; border:3px solid rgba(190,140,60,.55);
  border-radius:22px; padding:22px 20px 16px; box-shadow:0 18px 44px rgba(120,80,20,.3);
}
.zh-dis-ico{font-size:40px;line-height:1;text-align:center}
.zh-dis-box h2{text-align:center;margin:6px 0 10px;font-size:20px;color:#8c5312;letter-spacing:2px}
.zh-dis-main{
  text-align:center;font-size:18px;font-weight:900;color:#e8590c;margin:0 0 12px;
  padding:9px; border-radius:12px; background:#fff2d8; border:2px dashed rgba(232,89,12,.45);
}
.zh-dis-list{margin:0 0 14px;padding-left:19px;font-size:12.5px;line-height:1.85;color:#8a6231}
.zh-dis-list li{margin-bottom:3px}
.zh-dis-check{
  display:flex; align-items:center; gap:9px; cursor:pointer; user-select:none;
  padding:11px 13px; border-radius:14px; background:#fff7e6; border:2px solid rgba(190,140,60,.4);
  font-size:14px; font-weight:800; color:#8c5312; margin-bottom:12px;
}
.zh-dis-check input{width:20px;height:20px;accent-color:#ff7a00;flex:0 0 auto;cursor:pointer}
.zh-dis-check.on{border-color:var(--orange);background:#fff2d8}
#zhAgreeBtn{width:100%}
.zh-dis-foot{text-align:center;font-size:11px;color:#a5834f;margin-top:10px}

/* ---------------- 加载中（点「同意并开始」后显示，带进度条） ---------------- */
#zhLoading{
  position:fixed; inset:0; z-index:100001; display:none; align-items:center; justify-content:center;
  background:linear-gradient(180deg,#fff6dc,#ffe3a0); padding:22px;
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);
}
#zhLoading.show{display:flex}
.zh-ld-box{
  width:100%; max-width:420px; background:#fffdf5; border:3px solid rgba(190,140,60,.5);
  border-radius:22px; padding:24px 22px 20px; box-shadow:0 18px 44px rgba(120,80,20,.28); text-align:center;
}
.zh-ld-ico{font-size:40px;line-height:1;animation:zhBounce 1.1s ease-in-out infinite}
@keyframes zhBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
.zh-ld-box h2{margin:8px 0 16px;font-size:19px;color:#8c5312;letter-spacing:1px}
.zh-ld-bar{
  height:16px; border-radius:999px; background:#f2e6cb; overflow:hidden;
  box-shadow:inset 0 1px 3px rgba(150,110,50,.25); border:1px solid rgba(190,140,60,.35);
}
.zh-ld-bar i{
  display:block; height:100%; width:0%; border-radius:999px;
  background:linear-gradient(90deg,#ffc24d,#ff8a1f 60%,#ff6a00); transition:width .25s linear;
}
.zh-ld-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px}
#zhLdPct{font-size:16px;font-weight:900;color:#e8590c;font-variant-numeric:tabular-nums}
#zhLdTip{font-size:12px;color:#8a6231}
.zh-ld-note{font-size:11.5px;line-height:1.7;color:#a5834f;margin-top:10px;min-height:18px}
#zhLdReload{display:none;margin-top:14px;font-size:15px;padding:13px}
#zhLdReload.show{display:block}

/* 未勾选时按钮变灰，但依然可以点（点了会抖动提示，不会卡死） */
.zh-big.idle{background:#e8dcc4;color:#b6a68a;box-shadow:0 5px 0 #d3c5a8;text-shadow:none;cursor:pointer}
.zh-big.idle:active{transform:translateY(3px);box-shadow:0 2px 0 #d3c5a8}
.zh-dis-check.shake{animation:zhShake .36s}
@keyframes zhShake{
  0%,100%{transform:translateX(0)}
  20%{transform:translateX(-7px)}
  40%{transform:translateX(7px)}
  60%{transform:translateX(-5px)}
  80%{transform:translateX(5px)}
}

/* ---------------- 宽屏：竖屏棋盘居中 ----------------
   注意：cc.game.frame 就是 #canvasDiv，它的宽高由引擎的 setFrameSize 设定，
   这里绝对不能用 !important 覆盖，否则会破坏引擎的分辨率适配。 */
html, body { height:100%; }
body{
  background:#f2dda6 !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  overflow:hidden; margin:0; padding:0;
}
#canvasDiv{ position:relative !important; left:auto !important; top:auto !important; margin:0 !important; }
#Cocos2dGameContainer{ position:relative !important; left:auto !important; top:auto !important; }
#GameCanvas{ display:block; box-shadow:0 10px 40px rgba(110,70,10,.35); }

/* ---------------- file:// 提示 ---------------- */
#zhFileWarn{
  position:fixed; inset:0; z-index:99999; display:none; align-items:center; justify-content:center;
  background:linear-gradient(180deg,#fff6dc,#ffe3a0); padding:22px;
}
#zhFileWarn.show{display:flex}
.zh-fw-box{
  max-width:430px;background:#fffdf5;border:3px solid rgba(190,140,60,.55);border-radius:20px;
  padding:24px 20px;text-align:center;color:#7a4a12;box-shadow:0 16px 40px rgba(120,80,20,.28);
}
.zh-fw-ico{font-size:44px;line-height:1}
.zh-fw-box h2{margin:8px 0 10px;font-size:20px;color:#8c5312}
.zh-fw-box p{margin:0 0 10px;font-size:13.5px;line-height:1.75}
.zh-fw-box b{color:#e8590c}
.zh-fw-tip{font-size:12px !important;color:#a5834f !important;margin-bottom:0 !important}

/* ---------------- 选校 ---------------- */
#zhPicker{
  position:fixed; inset:0; z-index:9999; display:none; flex-direction:column; align-items:center;
  padding:calc(10px + env(safe-area-inset-top,0px)) 12px calc(10px + env(safe-area-inset-bottom,0px));
  background:linear-gradient(180deg,#fff6dc 0%,var(--cream) 42%,var(--cream2) 100%);
  color:var(--ink); overflow:hidden;
}
#zhPicker::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:26px;
  background:linear-gradient(180deg,var(--wood) 0%,var(--wood2) 100%);
}
#zhPicker.show{display:flex}
.zh-sheet{width:100%;max-width:880px;display:flex;flex-direction:column;min-height:0;flex:1;position:relative;z-index:1}
.zh-title{text-align:center;margin:4px 0 0}
.zh-title h1{
  margin:0;font-size:25px;font-weight:900;letter-spacing:2px;color:#8c5312;
  text-shadow:0 2px 0 #fff, 0 4px 10px rgba(180,120,40,.28);
}
.zh-title p{margin:6px 0 0;font-size:12.5px;line-height:1.65;color:var(--ink2)}
.zh-title p b{color:#e8590c}
.zh-tools{display:flex;align-items:center;gap:7px;margin:11px 0 8px;flex-wrap:wrap;justify-content:center}
.zh-fbtn{
  border:2px solid rgba(190,140,60,.45); background:#fffdf4; color:var(--ink2);
  font-size:12.5px; font-weight:700; padding:7px 15px; border-radius:999px; cursor:pointer;
  box-shadow:0 2px 0 rgba(190,140,60,.35);
}
.zh-fbtn.on{background:linear-gradient(180deg,#ffbe4d,var(--orange)); color:#fff; border-color:#e88a00; box-shadow:0 2px 0 #c97400}
.zh-fbtn:active{transform:translateY(1px)}
#zhSearch{
  flex:1 1 140px; max-width:230px; min-width:0; background:#fffdf4; border:2px solid rgba(190,140,60,.45);
  color:var(--ink); border-radius:999px; padding:8px 15px; font-size:12.5px; outline:none;
}
#zhSearch:focus{border-color:var(--orange)}
.zh-gridwrap{flex:1 1 auto; min-height:0; overflow-y:auto; -webkit-overflow-scrolling:touch; padding:4px 2px 12px}
.zh-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(104px,1fr)); gap:9px}
.zh-card{
  position:relative; display:flex; flex-direction:column; align-items:center; gap:5px; cursor:pointer;
  background:linear-gradient(180deg,#fffdf6,#fff4dc); border:2px solid rgba(190,140,60,.35);
  border-radius:16px; padding:10px 5px 8px; color:var(--ink);
  box-shadow:0 3px 0 rgba(190,140,60,.25); transition:transform .12s, box-shadow .12s, border-color .12s;
}
.zh-card:hover{transform:translateY(-2px); border-color:rgba(255,150,20,.75)}
.zh-card:active{transform:scale(.97)}
.zh-card.on{border-color:var(--orange); background:linear-gradient(180deg,#fff8e6,#ffe9bd); box-shadow:0 0 0 3px rgba(255,159,28,.35),0 3px 0 #d98a12}
.zh-card.on::after{
  content:"✓"; position:absolute; top:5px; right:7px; width:17px; height:17px; border-radius:50%;
  background:var(--orange); color:#fff; font-size:11px; font-weight:900; display:grid; place-items:center;
}
.zh-ph{width:54px;height:54px;border-radius:50%;background:#fff;display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 0 2px rgba(190,140,60,.18)}
.zh-ph img{width:100%;height:100%;object-fit:contain;padding:2px}
.zh-nm{font-size:11.5px;font-weight:700;line-height:1.25;text-align:center}
.zh-tag{font-size:9px;padding:1px 8px;border-radius:999px;font-weight:700}
.zh-tag.pub{background:#e3f0ff;color:#2b6fd8;border:1px solid #b9d6ff}
.zh-tag.pri{background:#ffeed6;color:#c47b00;border:1px solid #ffd79a}
.zh-tag.boss{background:linear-gradient(180deg,#ffb528,#ff7a00);color:#fff;border:1px solid #e8590c}
.zh-card.boss{border-color:#e8590c;box-shadow:0 0 0 3px rgba(232,89,12,.28),0 3px 0 #c95f00;cursor:default;transform:none}
.zh-card.boss::after{display:none}
.zh-card.boss .zh-nm{color:#c95f00}
.zh-empty{grid-column:1/-1;text-align:center;color:var(--ink2);font-size:13px;padding:28px 0}

/* BOSS 信息条 + 计数 */
.zh-bossbar{
  display:none; align-items:center; gap:8px; flex-wrap:wrap; justify-content:center;
  margin:10px 0 0; padding:7px 12px; border-radius:14px;
  background:#fff6e0; border:2px dashed rgba(232,89,12,.5);
}
.zh-bossbar.show{display:flex}
.zh-bosslabel{font-size:11px;font-weight:800;color:#c95f00;letter-spacing:1px}
.zh-bosschip{display:flex;align-items:center;gap:6px;background:#fff;border-radius:999px;padding:2px 10px 2px 3px;box-shadow:inset 0 0 0 2px rgba(190,140,60,.25)}
.zh-bosschip img{width:26px;height:26px;border-radius:50%;object-fit:contain}
.zh-bosschip b{font-size:12.5px;color:#8c5312}
.zh-count{font-size:12px;font-weight:800;color:#c95f00;margin-left:auto}
.zh-steprow{display:none;gap:7px}
.zh-steprow.show{display:flex}
.zh-steprow .zh-ghost{flex:1;padding:9px 6px;font-size:12.5px}

.zh-bottom{flex:0 0 auto;display:flex;flex-direction:column;gap:7px;padding-top:8px}
.zh-big{
  width:100%;padding:15px;border:0;border-radius:16px;font-size:16.5px;font-weight:900;letter-spacing:1px;
  color:#fff;cursor:pointer;background:linear-gradient(180deg,#ffb528,var(--orange) 55%,var(--orange2));
  box-shadow:0 5px 0 #c95f00, 0 10px 22px rgba(220,130,0,.35); text-shadow:0 1px 1px rgba(160,80,0,.4);
}
.zh-big:active:not(:disabled){transform:translateY(3px);box-shadow:0 2px 0 #c95f00}
.zh-big:disabled{background:#e8dcc4;color:#b6a68a;box-shadow:0 5px 0 #d3c5a8;text-shadow:none;cursor:not-allowed}
.zh-foot{font-size:10.5px;color:var(--ink2);text-align:center;line-height:1.6;padding-bottom:16px}

/* ---------------- 游戏中：右上角按钮 ---------------- */
#zhRestart{
  position:fixed; z-index:9000; display:none;
  padding:6px 13px; border-radius:999px; border:2px solid rgba(190,140,60,.65);
  background:rgba(255,250,235,.95); color:#8c5312; font-size:12.5px; font-weight:800; cursor:pointer;
  box-shadow:0 2px 8px rgba(150,100,30,.25);
}
#zhRestart.show{display:block}
#zhRestart:active{transform:translateY(1px)}

/* ---------------- 游戏中：在线人数卡片（两行，可点击跳统计页） ---------------- */
#zhOnline{
  position:fixed; z-index:9000; display:none; flex-direction:column; align-items:center; gap:1px;
  padding:5px 13px 6px; border-radius:16px; border:2px solid rgba(190,140,60,.6);
  background:rgba(255,250,235,.95); color:#8c5312; font-size:12px; font-weight:800;
  box-shadow:0 2px 8px rgba(150,100,30,.25); white-space:nowrap; text-align:center;
  pointer-events:auto; cursor:pointer; -webkit-tap-highlight-color:transparent;
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
#zhOnline:hover{border-color:rgba(255,150,20,.9);background:#fffbee}
#zhOnline:active{transform:translateY(1px)}
#zhOnline.show{display:flex}
#zhOnline b{color:#e8590c;font-variant-numeric:tabular-nums}
#zhOnline .zh-on-row{display:flex;align-items:center;gap:5px;line-height:1.25}
#zhOnline .zh-on-sub{font-size:10px;font-weight:700;color:#a5834f;line-height:1.25}
#zhOnline .zh-on-sub b{color:#d2691e;font-size:10.5px}
#zhOnline .zh-dot{
  width:8px;height:8px;border-radius:50%;background:#3ec46d;flex:0 0 auto;
  box-shadow:0 0 0 3px rgba(62,196,109,.22);animation:zhPulse 1.8s infinite;
}
@keyframes zhPulse{0%,100%{opacity:1}50%{opacity:.35}}
.zh-foot .online-count{color:#e8590c;font-weight:900}

/* ---------------- 游戏中：下一级提示（半透明、可拖动） ---------------- */
#zhNext{
  position:fixed; z-index:9500; display:none; align-items:center; gap:8px;
  padding:6px 12px 6px 6px; border-radius:999px; border:2px solid rgba(190,140,60,.6);
  background:rgba(255,250,235,.95); box-shadow:0 2px 8px rgba(150,100,30,.25);
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  opacity:.78;                                  /* 半透明，不挡视线 */
  pointer-events:auto;                          /* 要能拖动，所以接事件 */
  cursor:grab; touch-action:none;
  user-select:none; -webkit-user-select:none; -webkit-tap-highlight-color:transparent;
}
#zhNext.show{display:flex}
#zhNext.dragging{opacity:1; cursor:grabbing; box-shadow:0 8px 22px rgba(150,100,30,.5)}
#zhNext img{width:30px;height:30px;border-radius:50%;object-fit:contain;background:#fff;flex:0 0 auto;
  box-shadow:inset 0 0 0 2px rgba(190,140,60,.22); pointer-events:none}
#zhNext .zh-next-tx{display:flex;flex-direction:column;line-height:1.28;min-width:0;pointer-events:none}
#zhNext b{font-size:12.5px;color:#8c5312;white-space:nowrap;pointer-events:none}
#zhNext i{font-style:normal;font-size:11px;color:#d2691e;font-weight:800;white-space:nowrap;pointer-events:none}
#zhNext.done b{color:#c95f00}
#zhNext.done i{color:#e8590c}

/* ---------------- 游戏内：淡淡的分享二维码（截图给朋友扫） ---------------- */
#zhQr{
  position:fixed; z-index:8800; display:none; flex-direction:column; align-items:center; gap:3px;
  pointer-events:none;                 /* 纯装饰，不挡操作、不触发投球 */
  opacity:.6;                          /* 融入背景，但保证手机摄像头也扫得到 */
  user-select:none; -webkit-user-select:none;
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
#zhQr.show{display:flex}
#zhQr img{
  display:block; width:112px; height:112px;
  image-rendering:-webkit-optimize-contrast;   /* 缩放后保持清晰，利于扫码 */
}
#zhQrTip{
  font-size:10.5px; line-height:1.2; font-weight:800; letter-spacing:.3px;
  color:#8a5a1e; white-space:nowrap; text-align:center;
}

/* ---------------- 公告弹窗 ---------------- */
#zhNotice{
  position:fixed; inset:0; z-index:100003; display:none; align-items:center; justify-content:center;
  background:rgba(60,40,10,.55); padding:20px;
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  color:var(--ink);
}
#zhNotice.show{display:flex}
.zh-nt-box{
  width:100%; max-width:380px; background:#fffdf5; border:3px solid rgba(190,140,60,.55);
  border-radius:20px; padding:18px 18px 16px; box-shadow:0 18px 44px rgba(0,0,0,.35);
}
.zh-nt-hd{display:flex; align-items:baseline; justify-content:space-between; gap:8px; margin-bottom:10px}
.zh-nt-title{font-size:17px; font-weight:900; color:#8c5312; letter-spacing:.5px}
.zh-nt-time{font-size:10.5px; color:#b09268; white-space:nowrap}
.zh-nt-body{
  font-size:13.5px; line-height:1.75; color:#7a5a2e;
  background:#fff8e9; border:2px solid rgba(190,140,60,.28); border-radius:12px;
  padding:12px 13px; margin-bottom:14px; max-height:46vh; overflow:auto; word-break:break-word;
}
#zhNtOk{width:100%}

/* ---------------- 结算战绩卡 ---------------- */
/* 只在游戏结束后出现的小按钮：放在棋盘右下角，避开游戏自带的结算弹窗（居中的那个） */
#zhCardBtn{
  position:fixed; z-index:9200; display:none;
  padding:0 18px; height:38px; border-radius:999px; border:2px solid #e8a33d;
  background:linear-gradient(180deg,#ffd166,#ff9f28); color:#7a3d00;
  font-size:13px; font-weight:900; cursor:pointer; white-space:nowrap;
  box-shadow:0 3px 0 #c97400, 0 8px 18px rgba(180,110,10,.35);
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  /* 用 flex 居中，避免中文/emoji 在按钮里跑偏 */
  align-items:center; justify-content:center; line-height:1; text-align:center;
  -webkit-tap-highlight-color:transparent;
  animation:zhCardPulse 1.6s ease-in-out infinite;
}
#zhCardBtn.show{display:flex}
#zhCardBtn>span{display:block;line-height:1}
#zhCardBtn:active{transform:translateY(2px);box-shadow:0 1px 0 #c97400}
@keyframes zhCardPulse{0%,100%{opacity:1}50%{opacity:.7}}

#zhCardMask{
  position:fixed; inset:0; z-index:100002; display:none; align-items:center; justify-content:center;
  background:rgba(60,40,10,.55); padding:16px; overflow:auto;
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
#zhCardMask.show{display:flex}
.zh-card-box{
  position:relative; width:100%; max-width:400px; background:#fffdf5;
  border:3px solid rgba(190,140,60,.5); border-radius:20px; padding:14px 14px 16px;
  box-shadow:0 18px 44px rgba(0,0,0,.35); text-align:center;
}
#zhCardClose{
  position:absolute; top:8px; right:8px; width:34px; height:34px; border-radius:50%;
  border:2px solid rgba(190,140,60,.5); background:#fff8e8; color:#8c5312;
  font-size:16px; font-weight:900; cursor:pointer; line-height:1;
}
.zh-card-hd{font-size:13px;font-weight:800;color:#8c5312;margin:2px 34px 10px}
.zh-card-imgwrap{max-height:56vh;overflow:auto;border-radius:12px;background:#f7efdc}
#zhCardImg{width:100%;display:block;border-radius:12px}
.zh-card-tip{font-size:11px;color:#a5834f;margin-top:8px}
.zh-card-btns{display:flex;gap:8px;margin-top:12px}
.zh-card-btns button{
  flex:1; padding:12px 6px; border-radius:14px; border:0; cursor:pointer;
  font-size:14.5px; font-weight:900; color:#fff;
  background:linear-gradient(180deg,#ffb528,#ff7a00); box-shadow:0 4px 0 #c95f00;
}
.zh-card-btns button#zhCardCopy{
  background:#fff6e2; color:#8c5312; box-shadow:0 4px 0 #e0cda6; border:2px solid rgba(190,140,60,.5);
}
.zh-card-btns button:active{transform:translateY(2px)}
.zh-foot .plays-count{color:#e8590c;font-weight:900}
#zhOnline .plays-count{color:#e8590c}

/* ---------------- 底部署名（可点击 → iamcrl.cn） ---------------- */
#zhCredit{
  position:fixed; z-index:9000; display:none; text-align:center;
  transform:translateX(-50%); line-height:1.25;
  pointer-events:auto; cursor:pointer; -webkit-tap-highlight-color:transparent;
  font-family:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  text-shadow:0 1px 0 rgba(255,255,255,.45);
}
#zhCredit.show{display:block}
#zhCredit:hover{filter:brightness(1.12)}
#zhCredit b{display:block; font-size:11px; line-height:1.2; color:#fff6dd; letter-spacing:.5px;
  text-shadow:0 1px 2px rgba(85,45,0,.85), 0 0 6px rgba(85,45,0,.5)}
#zhCredit i{display:block; font-style:normal; font-size:9px; line-height:1.2; color:#ffe9bd;
  text-shadow:0 1px 2px rgba(85,45,0,.85), 0 0 6px rgba(85,45,0,.5)}

/* ---------------- 兜底定位 ----------------
   正常情况下 JS 会按棋盘的实际位置精确摆放这些浮层。
   万一 JS 没跑起来（典型情况：浏览器缓存了旧版 zhuhai.js，和新版 index.html 混着用），
   也要保证它们出现在合理的位置，而不是因为缺少 top/left 而挤在页面左上角。 */
#zhRestart{ top:56px; right:10px; }
#zhOnline{ top:8px; right:10px; }
#zhQr{ top:104px; right:12px; left:auto; }
#zhNext{ top:20%; left:12px; }
#zhCredit{ bottom:26px; left:50%; }
#zhCardBtn{ right:12px; bottom:106px; }

@media (max-width:420px){
  .zh-grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr));gap:7px}
  .zh-ph{width:46px;height:46px}
  .zh-title h1{font-size:21px}
}