/* 儿童版模式样式（由 mode.js 在 <html> 上切换 .ybw-child 类生效） */
/* 原则：只做叠加，不改动专业版任何样式；儿童版 = 更大字、更大卡、卡通图、简化区块 */

html.ybw-child body{ font-size:18px; }
html.ybw-child h1{ font-size:clamp(30px,5vw,46px); }
html.ybw-child .shot-title{ font-size:19px; }
html.ybw-child .shot-card{ border-radius:16px; }
html.ybw-child .shot-img{ min-height:180px; }
html.ybw-child .explore-bar .pchip b,
html.ybw-child .grid-toolbar .grid-count b,
html.ybw-child .shot-stats,
html.ybw-child .shot-tags .tag.cat{ display:none; }   /* 儿童版隐藏计数与次要标签 */

/* 儿童版：首页右侧海域云图 + 高级统计默认收起来，界面更清爽 */
html.ybw-child .hero-right{ display:none; }
html.ybw-child .hero-left{ flex:1 1 100%; }

/* 物种卡片：卡通海底底图（背景模版之一，随卡片循环）+ 透明卡通鱼叠加其上 */
html.ybw-child .shot-card .shot-img{ position:relative; background-size:cover; background-position:center; background-color:#bfe9ff; }
html.ybw-child .shot-card:nth-child(3n+1) .shot-img{ background-image:url('/img/儿童背景/bg01.webp'); }
html.ybw-child .shot-card:nth-child(3n+2) .shot-img{ background-image:url('/img/儿童背景/bg02.webp'); }
html.ybw-child .shot-card:nth-child(3n+3) .shot-img{ background-image:url('/img/儿童背景/bg03.webp'); }
html.ybw-child .shot-card .shot-img img{ position:relative; z-index:2; object-fit:contain; }

/* 儿童版列表视图简化 */
html.ybw-child .shot-row .row-avatar{ height:70px; }

/* ===== 儿童版「海报卡」物种列表（对齐样板：卡通海底背景 + 透明卡通鱼 + 名称 + 副标题 + 三点科普 + XX博士徽章） ===== */
html.ybw-child .shot-card.ybw-poster{
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  aspect-ratio:3/4;border-radius:18px;border:none;text-decoration:none;
  background-size:cover;background-position:center;
  box-shadow:0 10px 26px rgba(0,50,90,.20);
}
html.ybw-child .shot-card.ybw-poster:hover{ transform:translateY(-4px); }
html.ybw-child .shot-card.ybw-poster .ybw-poster-overlay{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.82) 0%,rgba(255,255,255,.25) 26%,rgba(255,255,255,.10) 58%,rgba(6,42,80,.82) 100%);
}
html.ybw-child .shot-card.ybw-poster .ybw-p-top{ position:relative;z-index:2;padding:16px 16px 4px;text-align:center; }
html.ybw-child .shot-card.ybw-poster .ybw-p-name{
  font-size:clamp(24px,2.4vw,34px);font-weight:900;color:#0b4d8c;letter-spacing:3px;line-height:1.15;
  text-shadow:0 2px 6px rgba(255,255,255,.7);
}
html.ybw-child .shot-card.ybw-poster .ybw-p-sub{ font-size:14px;color:#1d6aa8;margin-top:5px;font-weight:600; }
html.ybw-child .shot-card.ybw-poster .ybw-p-img{ position:relative;z-index:2;flex:1;display:flex;align-items:center;justify-content:center;padding:6px 18px;min-height:0; }
html.ybw-child .shot-card.ybw-poster .ybw-p-img img{
  width:82%;max-height:100%;object-fit:contain;
  filter:drop-shadow(0 8px 12px rgba(0,30,60,.28));
}
html.ybw-child .shot-card.ybw-poster .ybw-p-facts{ position:relative;z-index:2;padding:10px 14px 16px;color:#fff; }
html.ybw-child .shot-card.ybw-poster .ybw-p-fact{ display:flex;gap:8px;font-size:14px;line-height:1.5;margin-bottom:7px;align-items:baseline; }
html.ybw-child .shot-card.ybw-poster .ybw-p-fact b{ color:#ffe9a8;flex:none;font-weight:700; }

/* ===== 儿童版「鱼类导航」：只列鱼种名称（可搜索面板） ===== */
html.ybw-child nav[data-hscroll] a{ display:none; }            /* 儿童版隐藏栏目导航，只保留鱼类图鉴 */
html.ybw-child .ybw-child-nav{ display:inline-flex; position:relative; }
.ybw-child-nav{ display:inline-flex; position:relative; }
.ybw-fish-btn{
  display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 14px;border-radius:999px;
  border:none;background:rgba(255,214,102,.95);color:#5a3e00;font-size:14px;font-weight:700;cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.18);transition:transform .12s;
}
.ybw-fish-btn:hover{ transform:scale(1.03); }
.ybw-fish-btn i{ font-size:14px; }
html.ybw-child .nav-search{ display:none; }
.ybw-fish-panel{
  position:absolute;right:0;top:40px;width:min(340px,88vw);z-index:9990;
  background:#f2fbff;border:2px solid #bde6ff;border-radius:16px;overflow:hidden;
  box-shadow:0 12px 40px rgba(0,40,80,.28);
}
.ybw-fish-head{ padding:12px 14px 10px;background:linear-gradient(160deg,#4aa3e0,#2b7fbf); }
.ybw-fish-title{ display:block;color:#fff;font-weight:800;font-size:15px;margin-bottom:8px; }
.ybw-fish-search{
  width:100%;box-sizing:border-box;height:36px;border:none;border-radius:999px;padding:0 14px;
  font-size:14px;outline:none;color:#123;
}
.ybw-fish-list{ max-height:min(420px,60vh);overflow:auto;padding:8px; }
.ybw-fish-item{
  display:block;padding:7px 12px;border-radius:8px;color:#0b4d8c;font-size:15px;font-weight:600;text-decoration:none;
}
.ybw-fish-item:hover{ background:#d8f1ff; }
.ybw-fish-more{ padding:8px 12px;font-size:12px;color:#4a86b0; }
.ybw-fish-empty{ padding:20px 12px;text-align:center;color:#5a86a8;font-size:14px; }

/* ===== 儿童版「详情页」：更儿童化的独立版式（隐藏专业版繁重区块） ===== */
html.ybw-child-detail .detail-grid{ grid-template-columns:1fr !important; }
html.ybw-child-detail .detail-side{ display:none !important; }
html.ybw-child-detail .detail-main{ width:100%;max-width:860px;margin:0 auto; }
html.ybw-child-detail .spcmp-box,
html.ybw-child-detail .sp-xphy-box,
html.ybw-child-detail .gallery-row,
html.ybw-child-detail .sp-food-row,
html.ybw-child-detail .sp-food-more-wrap,
html.ybw-child-detail .sp-plan-card,
html.ybw-child-detail .sp-lib-wrap,
html.ybw-child-detail .sp-block-card,
html.ybw-child-detail .sp-error-panel,
html.ybw-child-detail #spErrorBtn,
html.ybw-child-detail .disease-item,
html.ybw-child-detail .sp-members{ display:none !important; }
html.ybw-child-detail .sp-intro-box{
  font-size:19px;line-height:2;background:#fff;border-radius:18px;padding:22px 26px;
  box-shadow:0 6px 22px rgba(0,40,80,.10);
}
html.ybw-child-detail .sp-h2{ font-size:26px; }

/* 儿童详情海报卡 */
.ybw-cd-hero{
  position:relative;overflow:hidden;border-radius:20px;margin:14px auto;
  width:calc(100% - 20px);max-width:min(860px,calc(100vw - 20px));box-sizing:border-box;
  background-size:cover;background-position:center;box-shadow:0 10px 30px rgba(0,50,90,.22);
  display:flex;flex-direction:column;text-align:center;
}
.ybw-cd-overlay{ position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.85) 0%,rgba(255,255,255,.30) 30%,rgba(255,255,255,.15) 60%,rgba(6,42,80,.85) 100%); }
.ybw-cd-top{ position:relative;z-index:2;padding:20px 20px 4px; }
.ybw-cd-img{ position:relative;z-index:2;display:flex;align-items:center;justify-content:center;padding:8px 20px; }
.ybw-cd-img img{ width:min(300px,70%);object-fit:contain;filter:drop-shadow(0 10px 14px rgba(0,30,60,.3)); }
.ybw-cd-facts{ position:relative;z-index:2;padding:8px 22px 26px;color:#fff;text-align:left; }
.ybw-cd-facts .ybw-p-fact{ font-size:17px; }

/* 导航上的切换按钮样式 */
.nav-mode-btn{
  display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.14);color:#fff;font-size:13px;cursor:pointer;
  transition:background .2s,transform .1s;
}
.nav-mode-btn:hover{ background:rgba(255,255,255,.24); }
.nav-mode-btn:active{ transform:scale(.96); }
.nav-mode-btn i{ font-size:14px; }
html.ybw-child .nav-mode-btn{ background:rgba(255,214,102,.9); border-color:rgba(255,214,102,.9); color:#5a3e00; }

/* 版本选择弹窗（首次访问首页展示） */
#ybwModalMask{ position:fixed;inset:0;z-index:9999;display:flex;align-items:center;justify-content:center;
  background:rgba(4,32,58,.72);backdrop-filter:blur(4px); }
#ybwModal{ width:min(520px,92vw);background:linear-gradient(160deg,#0d5f9e 0%,#0a4d8c 55%,#0a6bb8 100%);
  border-radius:22px;padding:34px 30px 28px;color:#fff;box-shadow:0 18px 60px rgba(0,0,0,.4);text-align:center; }
#ybwModal .ybw-title{ font-size:24px;font-weight:800;margin:0 0 4px; }
#ybwModal .ybw-sub{ font-size:14px;color:#cfe7ff;margin:0 0 22px; }
#ybwModal .ybw-choices{ display:flex;gap:14px; }
#ybwModal .ybw-choice{ flex:1;border-radius:16px;padding:20px 14px;cursor:pointer;border:2px solid transparent;
  background:rgba(255,255,255,.12);transition:transform .12s,border-color .2s,background .2s; }
#ybwModal .ybw-choice:hover{ transform:translateY(-3px);border-color:#fff; }
#ybwModal .ybw-choice .ybw-emoji{ font-size:40px;display:block;margin-bottom:8px; }
#ybwModal .ybw-choice .ybw-name{ font-size:19px;font-weight:700; }
#ybwModal .ybw-choice .ybw-desc{ font-size:12.5px;color:#d7ecff;margin-top:6px;line-height:1.5; }
#ybwModal .ybw-remember{ margin-top:16px;font-size:12.5px;color:#b9dcff; }

/* ===== 儿童版独立列表页（/child，服务端渲染海报卡网格） ===== */
html.ybw-child .ybw-child-hero{
  position:relative;overflow:hidden;border-radius:22px;margin:16px auto 22px;max-width:100%;
  background:linear-gradient(160deg,#0d7fcf 0%,#0a5fb0 55%,#0b7fc9 100%);
  box-shadow:0 12px 34px rgba(0,60,110,.28);text-align:center;color:#fff;padding:34px 20px 30px;
}
html.ybw-child .ybw-child-hero h1{ margin:0;font-size:clamp(28px,4.5vw,44px);font-weight:900;letter-spacing:2px; }
html.ybw-child .ybw-child-hero p{ margin:10px 0 0;font-size:15px;color:#d9efff; }
html.ybw-child .ybw-child-hero p b{
  display:inline-block;margin:0 3px;padding:0 8px;border-radius:999px;
  background:rgba(255,255,255,.18);color:#ffe9a8;font-size:1.12em;
}
html.ybw-child .ybw-child-hero .ybw-hero-bubbles{ pointer-events:none;position:absolute;inset:0;overflow:hidden; }
html.ybw-child .ybw-pgrid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(330px,1fr));gap:20px;
  padding:0 0 26px;max-width:100%;margin:0 auto;
}
html.ybw-child .ybw-pgrid .shot-card{ margin:0;width:auto; }
/* 列表页海报卡：自然高度（固定 3/4 会裁切长文本），设最小高 */
html.ybw-child .ybw-pgrid .shot-card.ybw-poster{ aspect-ratio:auto;min-height:340px; }
/* 儿童列表分页（更大更圆润，适合小朋友点） */
html.ybw-child .ybw-pagination{ display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 0 30px; }
html.ybw-child .ybw-pagination a,html.ybw-child .ybw-pagination .cur{
  display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 14px;
  border-radius:999px;font-size:15px;font-weight:700;text-decoration:none;color:#0b4d8c;background:#e8f6ff;border:2px solid #c4e6ff;
  transition:transform .12s,background .2s;
}
html.ybw-child .ybw-pagination a:hover{ transform:scale(1.06);background:#d4eeff; }
html.ybw-child .ybw-pagination .cur{ background:#f5a623;border-color:#f5a623;color:#5a3e00;cursor:default; }
html.ybw-child .ybw-pagination .dim{ color:#9ac2e0;pointer-events:none; }
html.ybw-child .ybw-child-loadmore{
  max-width:100%;margin:0 auto 14px;display:flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 16px;border-radius:14px;background:#eef8ff;color:#3f77a5;font-size:14px;cursor:default;
}
html.ybw-child .ybw-child-loadmore .lm-spinner{
  width:16px;height:16px;border:2px solid #b9def5;border-top-color:#0b7fc9;border-radius:50%;
  animation:ybwLmSpin .8s linear infinite;display:none;
}
html.ybw-child .ybw-child-loadmore.loading .lm-spinner{ display:inline-block; }
html.ybw-child .ybw-child-loadmore.done{ background:#e8f8ee;color:#2d8a57; }
html.ybw-child .ybw-child-loadmore.error{ background:#fff1f0;color:#c0392b;cursor:pointer; }
@keyframes ybwLmSpin{ to{ transform:rotate(360deg); } }

/* ===== 儿童版独立详情页（/child/<id>.html） ===== */
html.ybw-child .ybw-cd-back-round{
  position:absolute;z-index:5;top:14px;left:14px;right:auto;width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.95);
  color:#0b4d8c;font-size:18px;text-decoration:none;box-shadow:none;
  transition:background .2s;
}
html.ybw-child .ybw-cd-back-round:hover{ background:#fff;box-shadow:none; }
html.ybw-child .ybw-cd-next-round{
  position:absolute;z-index:5;top:14px;right:14px;width:42px;height:42px;
  display:flex;align-items:center;justify-content:center;border-radius:50%;
  background:rgba(255,255,255,.9);border:1px solid rgba(255,255,255,.95);
  color:#0b4d8c;font-size:18px;text-decoration:none;box-shadow:none;
  transition:background .2s;
}
html.ybw-child .ybw-cd-next-round:hover{ background:#fff;box-shadow:none; }
html.ybw-child .ybw-child-detail-intro{
  max-width:860px;margin:18px auto 30px;background:#fff;border-radius:20px;padding:24px 28px;
  box-shadow:0 8px 26px rgba(0,40,80,.10);font-size:19px;line-height:2;color:#153a5a;
}
html.ybw-child .ybw-child-detail-intro h2{ font-size:26px;color:#0b4d8c;margin:0 0 10px; }
html.ybw-child .ybw-child-detail-intro .ybw-aliases{ font-size:15px;color:#5a86a8;margin-top:10px; }
html.ybw-child .ybw-child-detail-intro .ybw-src{ font-size:12.5px;color:#9db8cf;margin-top:12px; }