/* =========================================================
   CCH海轶堂 —— 门户首页样式
   独立于工作台的 app.css：首页是纯静态页，只引这一份样式。
   零外部依赖：所有图形都是 CSS 渐变或内联 SVG，断外网照常显示。
   ⚠ 改了这份文件记得同步改 index.html 里的 ?v= 版本号（静态资源有 12h 缓存）。
   ========================================================= */
/* 与 app.css 同名的这套变量给调色盘用，默认值两边保持一致，改一处记得同步另一处。
   --deep/--mid/--darkest 是首屏那道深色渐变的三段，--cyan 是光斑的亮色。 */
:root{
  --main:#08bfbf; --accent:#2ed9d1; --cyan:#7cf0e6; --deep:#06585a;
  --mid:#0b8e8e; --darkest:#03393b; --on-accent:#04393c; --main-deep:#0a7b7d;
  --main-rgb:8,191,191; --accent-rgb:46,217,209;
  --cyan-rgb:124,240,230; --deep-rgb:6,88,90;
  --soft:#e0f6f5; --soft-2:#eefaf9; --soft-line:#a5eee9; --card-tint:#f6fbfb;
  --bg:#f0f7f6; --card:#fff; --line:#e5e7eb;
  --text:#111827; --muted:#6b7280; --faint:#9aa3ab;
  --radius:16px;
  --shadow-sm:0 1px 3px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.04);
  --shadow-lg:0 26px 52px -14px rgba(var(--deep-rgb),.30);
  --ease:cubic-bezier(.2,.8,.3,1);
}

/* 默认亮色主题下：主色 #08bfbf 偏亮，悬停填色图标改深青字；自定义配色时 main 压暗、白字仍清晰 */
:root:not([data-theme]) .cap:hover .ci{color:var(--on-accent)}
*{box-sizing:border-box;margin:0;padding:0}
html{height:100%}
body{
  min-height:100%; display:flex; flex-direction:column;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
  background:var(--bg); color:var(--text); line-height:1.6;
  -webkit-font-smoothing:antialiased; -webkit-text-size-adjust:100%;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
svg{display:block}
ul{list-style:none}

/* =========================================================
   首屏
   ========================================================= */
.hero{
  position:relative; overflow:hidden; flex:none; color:#fff; isolation:isolate;
  background:linear-gradient(152deg,var(--darkest) 0%,var(--deep) 32%,var(--mid) 66%,var(--main) 94%,var(--accent) 100%);
  padding:clamp(18px,2.6vw,26px) clamp(20px,5vw,72px) clamp(66px,9vw,120px);
}

/* 光斑：三个柔边径向渐变缓慢漂移，做出"极光"的流动感。
   刻意不用 filter:blur —— 渐变自身就有柔和边缘，省掉模糊滤镜在手机上更省电。 */
.orb{position:absolute; z-index:0; border-radius:50%; pointer-events:none}
.orb.a{
  width:54vw; min-width:430px; aspect-ratio:1; left:-10vw; top:-20vw;
  background:radial-gradient(circle at 50% 50%,rgba(var(--cyan-rgb),.30),rgba(var(--cyan-rgb),0) 62%);
  animation:drift1 26s var(--ease) infinite alternate;
}
.orb.b{
  width:46vw; min-width:370px; aspect-ratio:1; right:-8vw; top:-12vw;
  background:radial-gradient(circle at 50% 50%,rgba(var(--accent-rgb),.32),rgba(var(--accent-rgb),0) 62%);
  animation:drift2 32s var(--ease) infinite alternate;
}
.orb.c{
  width:40vw; min-width:310px; aspect-ratio:1; left:30vw; bottom:-24vw;
  background:radial-gradient(circle at 50% 50%,rgba(var(--deep-rgb),.55),rgba(var(--deep-rgb),0) 66%);
  animation:drift3 38s var(--ease) infinite alternate;
}
@keyframes drift1{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(6vw,4vw,0) scale(1.14)}}
@keyframes drift2{from{transform:translate3d(0,0,0) scale(1.08)}to{transform:translate3d(-5vw,5vw,0) scale(1)}}
@keyframes drift3{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(4vw,-3vw,0) scale(1.1)}}

/* 细网格：给大色块一点结构感；用遮罩向左上淡出，避免出现生硬的边界 */
.grid{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.55;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(120% 96% at 16% 0%,#000 18%,transparent 76%);
  mask-image:radial-gradient(120% 96% at 16% 0%,#000 18%,transparent 76%);
  animation:gridPan 44s linear infinite;
}
@keyframes gridPan{from{background-position:0 0,0 0}to{background-position:64px 64px,64px 64px}}

/* 一道缓慢扫过的光带（用 transform 动画，走合成层不触发重排） */
.beam{
  position:absolute; top:-30%; left:-42%; width:32%; height:170%; z-index:0; pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.10),rgba(255,255,255,0));
  transform:rotate(13deg);
  animation:beamSweep 10s ease-in-out infinite;
}
@keyframes beamSweep{0%{transform:translateX(0) rotate(13deg)}60%,100%{transform:translateX(420%) rotate(13deg)}}

.hero-inner{position:relative; z-index:2; max-width:1120px; margin:0 auto}

.topbar{
  display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
  font-size:12px; letter-spacing:.22em; color:rgba(255,255,255,.64);
  padding-bottom:clamp(42px,6.4vw,74px);
}
.topbar .mark{display:inline-flex; align-items:center; gap:10px; color:#fff; font-weight:700; letter-spacing:.2em}
.topbar .logo{
  width:26px; height:26px; flex:none; border-radius:8px; display:inline-flex;
  align-items:center; justify-content:center;
  background:linear-gradient(135deg,var(--accent),var(--cyan));
  box-shadow:0 6px 16px rgba(var(--accent-rgb),.35);
}
.topbar .logo svg{width:15px; height:15px; color:var(--on-accent)}

.eyebrow{
  display:inline-flex; align-items:center; gap:12px;
  font-size:12px; letter-spacing:.3em; color:rgba(255,255,255,.74); margin-bottom:20px;
}
.eyebrow::before{content:""; width:34px; height:1px; background:linear-gradient(90deg,var(--cyan),transparent)}

h1{font-size:clamp(30px,5.4vw,58px); font-weight:700; line-height:1.14; letter-spacing:.1em}
h1 .pre{display:block; font-size:.42em; font-weight:600; letter-spacing:.26em; opacity:.78; margin-bottom:12px}

.lede{
  margin-top:22px; max-width:52ch;
  font-size:clamp(14px,1.5vw,16.5px); line-height:1.95; letter-spacing:.04em;
  color:rgba(255,255,255,.78);
}

.cta{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:34px}
.btn-main{
  position:relative; overflow:hidden; display:inline-flex; align-items:center; gap:10px;
  padding:14px 26px; border-radius:999px; font-size:14.5px; font-weight:700; letter-spacing:.08em;
  color:rgba(255,255,255,.92); background:transparent; border:1px solid rgba(255,255,255,.26);
  transition:transform .28s var(--ease),background .25s,border-color .25s;
}
.btn-main:hover{transform:translateY(-2px); background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.5)}
.btn-main svg{width:17px; height:17px; transition:transform .28s var(--ease)}
.btn-main:hover svg{transform:translateX(3px)}

.btn-ghost{
  display:inline-flex; align-items:center; gap:8px; padding:14px 26px; border-radius:999px;
  font-size:14.5px; letter-spacing:.08em; color:rgba(255,255,255,.92);
  border:1px solid rgba(255,255,255,.26); background:rgba(255,255,255,.06);
  transition:background .25s,border-color .25s,transform .28s var(--ease);
}
.btn-ghost:hover{background:rgba(255,255,255,.14); border-color:rgba(255,255,255,.5); transform:translateY(-2px)}

.hero-meta{
  display:flex; flex-wrap:wrap; gap:14px 40px;
  margin-top:46px; padding-top:26px; border-top:1px solid rgba(255,255,255,.13);
}
.hero-meta li{display:flex; align-items:baseline; gap:9px}
.hero-meta b{font-size:clamp(20px,2.2vw,27px); font-weight:700; font-variant-numeric:tabular-nums; letter-spacing:.02em}
.hero-meta span{font-size:12.5px; letter-spacing:.12em; color:rgba(255,255,255,.64)}

.scroll-hint{
  position:absolute; left:50%; bottom:20px; transform:translateX(-50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:5px;
  font-size:10.5px; letter-spacing:.24em; color:rgba(255,255,255,.46);
}
.scroll-hint svg{width:16px; height:16px; animation:bob 2.2s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0); opacity:.5}50%{transform:translateY(6px); opacity:1}}

/* 首屏入场：标题与按钮依次升起 */
@keyframes riseIn{from{opacity:0; transform:translateY(16px)}to{opacity:1; transform:none}}
.hero-inner > *{animation:riseIn .82s var(--ease) both}
.hero-inner > .topbar{animation-delay:.05s}
.hero-inner > .eyebrow{animation-delay:.14s}
.hero-inner > h1{animation-delay:.22s}
.hero-inner > .lede{animation-delay:.30s}
.hero-inner > .cta{animation-delay:.38s}
.hero-inner > .hero-meta{animation-delay:.46s}

/* =========================================================
   主体
   ========================================================= */
.body{
  flex:1; width:100%; max-width:1120px; margin:0 auto;
  padding:clamp(46px,6vw,78px) clamp(20px,5vw,72px) clamp(40px,5vw,66px);
}
.sec{margin-bottom:clamp(48px,6vw,80px)}
.sec:last-child{margin-bottom:0}

.sec-head{
  display:flex; align-items:center; gap:14px;
  font-size:12.5px; letter-spacing:.3em; color:var(--muted);
  margin-bottom:26px;
}
.sec-head::before{content:""; width:18px; height:2px; border-radius:2px; background:linear-gradient(90deg,var(--main),var(--accent))}
.sec-head::after{content:""; flex:1; height:1px; background:linear-gradient(90deg,var(--line),transparent)}

/* ---------- 模块卡片 ---------- */
.entries{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}

.entry{
  position:relative; overflow:hidden; display:flex; flex-direction:column;
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:30px 26px 24px; box-shadow:var(--shadow-sm);
}
/* 顶边一道渐显的彩条 */
.entry::before{
  content:""; position:absolute; left:0; top:0; height:3px; width:0;
  background:linear-gradient(90deg,var(--main),var(--accent));
  transition:width .42s var(--ease);
}
a.entry{transition:transform .34s var(--ease),box-shadow .34s var(--ease),border-color .34s}
a.entry:hover{transform:translateY(-6px); border-color:rgba(var(--main-rgb),.38); box-shadow:var(--shadow-lg)}
a.entry:hover::before{width:100%}
/* 悬停时斜向掠过的柔光（超出部分被卡片裁掉） */
.entry::after{
  content:""; position:absolute; inset:-45% -65%; pointer-events:none; opacity:0;
  background:linear-gradient(100deg,transparent 42%,rgba(var(--accent-rgb),.13) 50%,transparent 58%);
  transition:opacity .3s;
}
a.entry:hover::after{opacity:1; animation:sheen 1.1s var(--ease)}
@keyframes sheen{from{transform:translateX(-42%)}to{transform:translateX(42%)}}

.entry .ico{
  width:48px; height:48px; border-radius:13px; margin-bottom:20px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(var(--main-rgb),.09); color:var(--main-deep);
  transition:transform .34s var(--ease),background .34s;
}
.entry .ico svg{width:23px; height:23px}
a.entry:hover .ico{transform:translateY(-2px) scale(1.06); background:rgba(var(--main-rgb),.14)}

.entry h2{font-size:19px; font-weight:700; letter-spacing:.1em}
.entry .desc{margin:10px 0 22px; font-size:13px; color:var(--muted); line-height:1.9}
.entry .foot{
  margin-top:auto; padding-top:16px; border-top:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  font-size:12.5px; letter-spacing:.14em;
}
.entry .go{color:var(--main-deep); font-weight:600}
.entry .arw{width:16px; height:16px; color:var(--main-deep); transition:transform .28s var(--ease)}
a.entry:hover .arw{transform:translateX(4px)}

/* 尚未开放的模块：整体压暗，不用虚线边框等廉价手法 */
.entry.is-pending{background:#fbfcfc}
.entry.is-pending .ico{background:#f1f3f4; color:var(--faint)}
.entry.is-pending h2{color:#4b5563}
.entry .wait{color:var(--muted); letter-spacing:.2em}

/* ---------- 能力卡片 ---------- */
.caps{display:grid; grid-template-columns:repeat(auto-fit,minmax(258px,1fr)); gap:16px}
.cap{
  display:flex; gap:14px; align-items:flex-start; padding:18px;
  background:var(--card); border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),border-color .3s,box-shadow .3s;
}
.cap:hover{transform:translateY(-4px); border-color:rgba(var(--main-rgb),.32); box-shadow:0 18px 34px -16px rgba(var(--deep-rgb),.32)}
.cap .ci{
  width:38px; height:38px; flex:none; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(var(--main-rgb),.08); color:var(--main-deep);
  transition:background .3s,color .3s;
}
.cap .ci svg{width:19px; height:19px}
.cap:hover .ci{background:var(--main); color:#fff}
.cap h3{font-size:14.5px; font-weight:700; letter-spacing:.04em}
.cap p{margin-top:5px; font-size:12.5px; color:var(--muted); line-height:1.8}

/* =========================================================
   页脚（含 ICP 与公安备案）
   ========================================================= */
.foot-bar{
  flex:none; border-top:1px solid var(--line); background:#fff;
  padding:26px clamp(20px,5vw,72px); text-align:center;
  font-size:12px; color:var(--muted);
  display:flex; flex-direction:column; gap:9px; align-items:center; letter-spacing:.18em;
}
.foot-bar .brand{color:#4b5563; letter-spacing:.22em}
.fb-links{display:flex; align-items:center; justify-content:center; gap:4px 20px; flex-wrap:wrap; letter-spacing:.08em}
.fb-links a{display:inline-flex; align-items:center; gap:6px; min-height:22px; transition:color .2s}
.fb-links a:hover{color:var(--main-deep)}
/* 公安备案图标：备案平台下发的官方图标（20×20 PNG），已 base64 内联，
   浏览器不会再发任何图片请求，断外网照常显示。
   原图 19KB，这里去掉了 PNG 里的 XMP/ICC 元数据（400 个像素逐一比对完全一致）后只 1.3KB。
   源文件：public/static/img/beian.png；要改成外链引用，把 background 换成
   url("/static/img/beian.png") center/contain no-repeat 即可。 */
.fb-links .gb::before{
  content:""; width:15px; height:15px; flex:none;
  background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAACXBIWXMAAAsTAAALEwEAmpwYAAAFDUlEQVQ4y0XU228c9RnG8e8cdnZ29jRrr3e99aYBxwpOIME0SVuo66RpBWllDPJFIAhVRYRjRVGrctPSC0Qv6A2oqKWt0lw0KBetQEKNo5QkBBVIRKAoKUmUg3Ecx2vHsffg3dmdw87O/HoR1f4HPnpe6XleSQgBdguAEBlZhDhaiVikF2j22lfPjH145POnPKej7bj/7n1dmze/B/0lzxNEHQdkCZABIJVEEkLg23WQBHIgULQM8NGOySNHnzv5rytjwpnUZz0DJWOyNqvjlI3O8Pf7JzY8OL5fBLdNCK+JkCRAoKT7btENyaIplhFGBjRXP/Gn/R/++Onju5vujL4+obBXv8mz+iz33Zun6968uvfpYw8fffO1Q1JM0WxNwuU/+OoXsJJVkZGVFKpcKXpnXn3/9wfr7Nnbz0+KDdJ/uUDlckBlKqA++mceCs7x4oFH2feuj7j813cThqvLegI9Hl0FE55FPFofvD7x8tTI6LkRcyDPT7PnmD7YQF5jElht8EKkHpNTL5xkt3GG/Hfu4Qejh0eXPtk/bc+cXX/xg3+uglHPQXXfTxy6nNQ+m9/KD7daNM82kK/Xkcwo0WqAe/Imkdu70ZsO5b+dZvyBNie+2sjbHwe9CallIA+tgvWlcjH89IM3QikGqk3KmqexAJHAh6qLtM5A22Ii32ihEVKedujr8kCSqDVloj3qG4PD47etgDOXjo235+aGMwkNOlFEoUB2uJcmAuu+boI9RRKvDGG8uBm5xyC3JUvLboMQFHIGlM7uqM6eenIFNBKZOxuWT3+PC3o3R08bqDtTVB5cSzBnIX3Zwj58E396Ge2lYbp+fjfvHKgBcYY2qbSmFnFLU8UVMKzOjzZqKncVLYrf1Hjr7Tj/fq3E0LYCaSOJfaFGuOjhnquRnFvm/KtXePNAlPyQyaa+OuU5D796aXgFlNWWaTVkUktX2P1AQMdP4E8s0P33L5D7IrR7FMKcSnZngcKJq5T3nafVVhgfi5CsTGI1VNSkrAGoADHj68flO66NBfk+nviWxet9Pbw1twF/9gLdlUnkdAznQg1rIMdcpsA/5BikTJ749iKdZBHzTgkjs2ZiBQQ5JxqC+SmLuzZM89tfbuHll0aYsDZBw2fMrtBlyrxzOEkTA8jwi+d1tg1MMj8JuDZhxxpaAVWzvbWTzOMv+JQWL/Kz4Sjjx+OcOGJzSd7Mro1fUYiV6Rzqo11zWDNo8Ktd17h56hq2r6NnNVRTGwRuPQev+dljldO/O+gstPHKPpRmWPfwENG8DkGFoKLSXHRI394Fa7uhVGb6vcs4ySyJ/gSxXoP0wJ7tWuZHH0lCCAA6rf8+Xj3/+h8D10mVP15AjQt6t28gqDr4dgvZ0NG74khahMqpKTqBSnrrOnyXavqOkUfiZuq4pN1/62TfmcFZckruQszW82Eqv3OAoN4isBpgaCiaiRaD9nKTVqmGvrYbvZjHW7Zx56wwtqaJkkoR+39tRPsqCp/8OveNZG8kU8Crh4SBShgouEsWiJB2pU5zcglJiYAk4d4oE4nJ5L9byGqG9UzosLplTUkR7d72kGWn/2CXSramLJPKdYhINprko3jLCMchOZglNZBC1pqoaQ0p03u9o97zG9VY/4iiLbFaG+EjRVS7UYm/4FzMv+LUl3Z5/uz3vraxZ2NoSQndlLvUWBLrBtdjPaat5kbOVqcWjzkztaN923OhpCiIwAXgfy17NxK98SWXAAAAAElFTkSuQmCC") center/contain no-repeat;
}

/* =========================================================
   响应式
   ========================================================= */
@media(max-width:900px){
  .entries{grid-template-columns:1fr 1fr}
  /* 窄屏关掉光斑漂移：省电，也避免低端机因为大面积重绘掉帧 */
  .orb{animation:none}
}
@media(max-width:640px){
  .entries{grid-template-columns:1fr}
  .topbar{padding-bottom:34px; letter-spacing:.16em}
  .hero p.lede{margin-top:18px}
  .cta{gap:10px; margin-top:28px}
  .btn-main,.btn-ghost{padding:13px 20px; font-size:14px}
  .hero-meta{gap:12px 26px; margin-top:32px; padding-top:20px}
  .scroll-hint{display:none}
  .sec-head{letter-spacing:.24em; margin-bottom:20px}
  .entry{padding:24px 22px}
}

/* 尊重系统的"减少动态效果"设置 */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important; animation-iteration-count:1!important;
    transition-duration:.001ms!important;
  }
  .orb,.grid,.beam,.scroll-hint svg{animation:none!important}
  .hero-inner > *{opacity:1!important; transform:none!important}
}

/* =========================================================
   进入工作台：先选日常百味 / 工作履职
   纯 CSS 选择面板：checkbox 在 body 顶部，面板在 body 末尾，
   点按钮展开，点遮罩或 × 收起，不依赖内联脚本
   ========================================================= */
.entry-toggle{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.entry-trigger{cursor:pointer;user-select:none}
#entryToggle:checked ~ .hero .entry-trigger svg{transform:rotate(180deg)}

.entry-mask,.entry-sheet{display:none}
#entryToggle:checked ~ .entry-mask{display:block}
#entryToggle:checked ~ .entry-sheet{display:flex}

.entry-mask{
  position:fixed; inset:0; z-index:90; cursor:pointer;
  background:rgba(4,24,22,.58);
  -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
}
.entry-sheet{
  position:fixed; inset:0; z-index:91; padding:20px; pointer-events:none;
  align-items:center; justify-content:center;
}
.entry-panel{
  pointer-events:auto; width:min(560px,100%); max-height:calc(100vh - 40px);
  overflow:auto; background:var(--card); color:var(--text);
  border-radius:22px; padding:26px;
  box-shadow:0 30px 80px -24px rgba(0,0,0,.5);
  animation:entryIn .24s var(--ease);
}
@keyframes entryIn{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}

.entry-sheet-head{display:flex;align-items:flex-start;gap:16px;margin-bottom:18px}
.entry-sheet-head h2{font-size:21px;font-weight:800;letter-spacing:.06em;color:var(--deep)}
.entry-sheet-head p{font-size:13px;color:var(--muted);line-height:1.7;margin-top:6px}
.entry-close{
  flex:none; width:34px; height:34px; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:20px; line-height:1; color:var(--muted); cursor:pointer;
  background:var(--card-tint); border:1px solid var(--line);
  transition:color .2s,border-color .2s;
}
.entry-close:hover{color:var(--main-deep);border-color:rgba(var(--main-rgb),.4)}

.entry-options{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.entry-opt{
  display:flex; align-items:center; gap:14px; padding:18px;
  background:#fff; border:1px solid var(--line); border-radius:16px;
  transition:transform .22s var(--ease),border-color .22s,box-shadow .22s;
}
.entry-opt:hover{transform:translateY(-3px);border-color:rgba(var(--main-rgb),.38);box-shadow:0 16px 34px -18px rgba(var(--deep-rgb),.4)}
.entry-opt.daily{background:linear-gradient(150deg,var(--soft-2),#fff)}
.entry-opt.daily:hover{border-color:var(--soft-line)}
.entry-opt-ico{
  width:46px; height:46px; flex:none; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background:rgba(var(--main-rgb),.09); color:var(--main-deep);
}
.entry-opt.daily .entry-opt-ico{background:rgba(var(--accent-rgb),.16);color:var(--main-deep)}
.entry-opt-ico svg{width:22px;height:22px}
.entry-opt-body{flex:1;min-width:0;display:flex;flex-direction:column}
.entry-opt-body b{font-size:15px;font-weight:700;letter-spacing:.04em}
.entry-opt-body span{font-size:12.5px;color:#4b5563;margin-top:3px}
.entry-opt-body em{font-style:normal;font-size:11.5px;color:var(--muted);margin-top:4px;line-height:1.5}
.entry-opt-go{flex:none;font-size:12px;font-weight:600;color:var(--main-deep);letter-spacing:.06em}
.entry-opt.daily .entry-opt-go{color:var(--main-deep)}

@media(max-width:640px){
  .entry-sheet{padding:14px}
  .entry-panel{padding:20px;border-radius:18px}
  .entry-options{grid-template-columns:1fr}
  .entry-opt{padding:15px}
  .entry-sheet-head h2{font-size:18px}
  .entry-close{width:44px;height:44px}
}

/* 学习提高：区域选择面板第三项 */
.entry-opt.study{grid-column:1/-1; background:linear-gradient(150deg,rgba(var(--accent-rgb),.08),#fff)}
.entry-opt.study .entry-opt-ico{background:rgba(var(--accent-rgb),.16); color:var(--main-deep)}
.entry-opt.study .entry-opt-go{color:var(--main-deep)}