/* p3.35 C1 起的 CoverKit 模板渲染层——只在文章配了 CoverKit 模板的这
   篇文章才会出现在页面里(Plugin::renderCover() 没有 render 出内容时,
   主题侧 appstore_cover_html() 走的还是原来的 emoji/图片封面那条路
   径,这份样式表跟着一起不生效,互不干扰)。

   .coverkit 永远铺满外层 .cover 容器(inset:0,和 .cover>img/.cover-
   center 是同一种"填满父容器"写法),z-index 盖过 .cover::after 的噪点
   叠层(z-index:1),不然噪点纹理会糊在模板文字上面看不清。外层
   .cover/.cover--hero 等既有类名负责整体尺寸/圆角/溢出裁切,这份样式
   表只管"填进去的内容长什么样",不重新定义盒子尺寸——插件只提供内
   容,主题继续管布局位置,边界很清楚。

   p3.36③A:12 个模板逐个照 ogcops 真实源码复刻设计(见 Templates.php 每
   个 case 分支上面写的对应哪个 ogcops 模板)。

   p3.36③B:③A 阶段每个模板的标题字号是用 .cover--hero/--story-wide/
   --story-half 这几个场景类名分别写死一个 px 值(和 C1 的 minimal/
   editorial/quote 三个是同一种做法)——这在参照尺寸下能看,但
   story-wide 在 two_big 布局桌面端能宽达 930px+、在 four_small 布局
   手机端只有 350px,同一个"story-wide"标签背后是完全不同的实际渲染
   宽度,写死一个 px 完全覆盖不了这个跨度,总指挥实测反馈的"quote 模板
   在宽 story 卡里比例崩掉"就是这个根因。

   改法:.hero__slide(components.css)和 .story-card(components.css,
   本来就有)现在都挂了 container-type:size,.coverkit 作为它们的间接
   子元素可以用 cqw(容器查询宽度)按自己实际所在那张卡/那个 slide 的
   真实渲染宽度连续算字号,而不是分成孤立的三档。每个模板标题的
   font-size 统一写成 clamp(MIN, K·cqw, MAX)一条规则,不再需要
   .cover--hero/--story-wide/--story-half 三份重复覆盖——K 是照③A 阶段
   定下的参照尺寸观感反推的比例系数,MIN/MAX 是量出来的极端宽度(手机
   端 story 卡~350px、桌面 hero~980px)对应的下限/上限,保证不管卡片实
   际是哪个宽度,字号都能连续跟着变,不会在 350px 和 351px 这种边界上
   突然跳一档,也不会在超出常见范围时无限放大/缩小到不可读。

   row/mini(小尺寸卡片图标位)这两个场景类名下面还留着一批规则——
   Plugin::renderCover() 只在 hero/story-wide/story-half 三种场景接管
   (见 AppStoreKit::APPLICABLE_CONTEXTS),CoverKit 模板实际上永远不会
   渲染进 row/mini,这批规则是死代码但无害,这轮不动它,不在改动范围内
   引入不必要的风险。

   装饰性元素(引用大双引号、终端提示符等)但凡量级明显偏大、在窄容器
   里可能挤占大半宽度的,这轮也一并换成 clamp 比例值;圆点/徽标/胶囊这
   类本来就很小的装饰元素维持固定 px(在最窄的 350px 容器下实测也没有
   溢出问题,换成响应式反而增加复杂度但收益趋近于零)。 */

.coverkit {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: hidden;
}

.coverkit__title {
  margin: 0;
  font-weight: 700;
  line-height: 1.25;
  color: #fff;
  text-wrap: balance;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/* ==================== 极简(C1) ==================== */
.coverkit--minimal {
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10%;
  background:
    radial-gradient(80% 65% at 50% 40%, hsl(var(--ck-h) 55% 42% / .9), hsl(var(--ck-h) 45% 16%));
}
.coverkit--minimal .coverkit__title {
  font-size: clamp(15px, 3.6cqw, 34px);
}
.cover--row .coverkit--minimal .coverkit__title,
.cover--mini .coverkit--minimal .coverkit__title { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== 编辑部(C1) ==================== */
.coverkit--editorial {
  justify-content: flex-end;
  padding: 8% 9%;
  gap: 6px;
  background:
    linear-gradient(180deg, hsl(var(--ck-h) 40% 22% / 0) 0%, hsl(var(--ck-h) 45% 12% / .92) 78%),
    linear-gradient(135deg, hsl(var(--ck-h) 55% 30%), hsl(calc(var(--ck-h) + 30) 50% 18%));
}
.coverkit--editorial .coverkit__eyebrow {
  align-self: flex-start;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: hsl(var(--ck-h) 90% 78%);
  background: hsl(var(--ck-h) 60% 20% / .6);
  padding: 3px 9px;
  border-radius: 999px;
}
.coverkit--editorial .coverkit__title { font-size: clamp(16px, 3.8cqw, 36px); }
.coverkit--editorial .coverkit__meta {
  font-size: 11px;
  color: rgb(255 255 255 / .6);
}
.cover--row .coverkit--editorial,
.cover--mini .coverkit--editorial { padding: 8%; gap: 2px; }
.cover--row .coverkit--editorial .coverkit__eyebrow,
.cover--mini .coverkit--editorial .coverkit__eyebrow,
.cover--row .coverkit--editorial .coverkit__meta,
.cover--mini .coverkit--editorial .coverkit__meta { display: none; }
.cover--row .coverkit--editorial .coverkit__title,
.cover--mini .coverkit--editorial .coverkit__title { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== 引用(C1,细化自 ogcops quote/centered-serif) ==================== */
.coverkit--quote {
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 12% 10%;
  /* p3.36③B 排查发现的真实 bug:这里原来写了 position:relative,本意
     是给下面 .coverkit__quote-mark(position:absolute)找一个定位锚点,
     但 .coverkit 基础规则本身已经是 position:absolute(见文件顶部,负
     责让整块模板贴满外层 .cover),而"position:absolute 的元素自己就是
     后代 absolute 元素的定位锚点",根本不需要再声明一遍——这里的
     position:relative 反而把基础规则的 absolute 覆盖掉了,导致
     .coverkit--quote 的盒子从"贴满 .cover"退化成"跟着 flex 内容撑出来
     多高算多高",在 story-wide 这种宽而矮的容器里被压得只剩一百来 px
     高,quote-mark 这类装饰元素相对这个被压扁的盒子摆位置,自然大幅溢
     出。直接删掉这行,不需要换成别的写法。 */
  background: linear-gradient(160deg, hsl(var(--ck-h) 35% 20%), hsl(var(--ck-h) 45% 10%));
}
.coverkit--quote .coverkit__quote-mark {
  position: absolute;
  top: -2%;
  left: 4%;
  font-size: clamp(48px, 13cqw, 120px);
  font-family: Georgia, 'Times New Roman', serif;
  color: hsl(var(--ck-h) 70% 55% / .28);
  line-height: 1;
  pointer-events: none;
}
.coverkit--quote .coverkit__title {
  position: relative;
  font-style: italic;
  font-size: clamp(14px, 3.4cqw, 32px);
}
.coverkit--quote .coverkit__meta {
  position: relative;
  margin-top: 8px;
  font-size: 11px;
  font-style: normal;
  color: hsl(var(--ck-h) 60% 75% / .85);
}
.cover--row .coverkit--quote .coverkit__quote-mark,
.cover--mini .coverkit--quote .coverkit__quote-mark,
.cover--row .coverkit--quote .coverkit__meta,
.cover--mini .coverkit--quote .coverkit__meta { display: none; }
.cover--row .coverkit--quote .coverkit__title,
.cover--mini .coverkit--quote .coverkit__title { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== IDE 终端(细化自 ogcops developer/vscode-theme) ====================
   和文章正文代码框(theme 的 code-window.css)刻意用同一套视觉语言——
   三色交通灯圆点 + 深色终端配色 + 等宽字体,读者切到这篇文章前后观感
   连贯。有代码字体(--font-code,B2 新增)时这里也用同一份,没设置时和
   代码框一样回退系统等宽栈。 */
.coverkit--terminal {
  background: #1c1c22;
  font-family: var(--font-code, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
}
.coverkit--terminal .coverkit__termbar {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 7px 10px;
  background: rgba(255, 255, 255, .04);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  flex: none;
}
.coverkit__dot { width: 8px; height: 8px; border-radius: 50%; display: block; }
.coverkit__dot--red { background: #ff5f56; }
.coverkit__dot--yellow { background: #ffbd2e; }
.coverkit__dot--green { background: #27c93f; }
.coverkit--terminal .coverkit__termtab {
  margin-left: 6px;
  font-size: 10px;
  padding: 2px 8px;
  border-radius: 5px 5px 0 0;
  background: rgba(255, 255, 255, .06);
  color: rgba(255, 255, 255, .55);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 40%;
}
.coverkit--terminal .coverkit__termbody {
  flex: 1;
  display: grid;
  grid-template-columns: auto 1fr;
  align-content: center;
  gap: 4px 10px;
  padding: 4% 6%;
  min-height: 0;
}
.coverkit__gutter {
  font-size: 11px;
  color: rgba(255, 255, 255, .25);
  text-align: right;
}
.coverkit__termline {
  font-size: clamp(11px, 2.1cqw, 20px);
  color: #e4e4ea;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: flex;
  align-items: baseline;
  gap: 6px;
}
.coverkit__termline--comment {
  color: #6a9955;
  font-style: italic;
}
.coverkit__prompt { color: #6adf7c; font-weight: 700; flex: none; }
.coverkit__title--mono {
  font-family: inherit;
  font-weight: 500;
  color: inherit;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.coverkit--terminal .coverkit__statusbar {
  flex: none;
  display: flex;
  justify-content: space-between;
  padding: 4px 12px;
  font-size: 10px;
  background: var(--ck-accent-status, #2b6cb0);
  color: rgba(255, 255, 255, .92);
}
.coverkit__caret {
  width: 6px;
  height: 1em;
  background: #6adf7c;
  flex: none;
  display: inline-block;
  animation: coverkit-blink 1.1s step-end infinite;
}
@keyframes coverkit-blink { 50% { opacity: 0; } }
.cover--row .coverkit--terminal .coverkit__termbar,
.cover--mini .coverkit--terminal .coverkit__termbar { padding: 4px 6px; }
.cover--row .coverkit--terminal .coverkit__gutter,
.cover--mini .coverkit--terminal .coverkit__gutter,
.cover--row .coverkit--terminal .coverkit__statusbar,
.cover--mini .coverkit--terminal .coverkit__statusbar,
.cover--row .coverkit--terminal .coverkit__termline--comment,
.cover--mini .coverkit--terminal .coverkit__termline--comment { display: none; }
.cover--row .coverkit__termline,
.cover--mini .coverkit__termline { font-size: 10px; }
.cover--row .coverkit__caret,
.cover--mini .coverkit__caret { display: none; }

@media (prefers-reduced-motion: reduce) {
  .coverkit__caret { animation: none; }
}

/* ==================== 巨字(复刻自 ogcops blog/bold-typography) ==================== */
.coverkit--bold {
  padding: 9% 8%;
  justify-content: space-between;
  background: #0a0a0a;
}
.coverkit--bold .coverkit__boldhead {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: hsl(var(--ck-h) 70% 65%);
}
.coverkit--bold .coverkit__title--bold {
  font-size: clamp(17px, 4.8cqw, 46px);
  font-weight: 900;
  letter-spacing: -.02em;
  text-transform: uppercase;
  line-height: 1.05;
  -webkit-line-clamp: 4;
}
.coverkit--bold .coverkit__boldfoot {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 12px;
  color: rgb(255 255 255 / .6);
}
.coverkit__accentbar {
  width: 32px;
  height: 4px;
  background: hsl(var(--ck-h) 70% 60%);
  display: block;
  flex: none;
}
.cover--row .coverkit--bold,
.cover--mini .coverkit--bold { padding: 8%; }
.cover--row .coverkit--bold .coverkit__boldhead,
.cover--mini .coverkit--bold .coverkit__boldhead,
.cover--row .coverkit--bold .coverkit__boldfoot,
.cover--mini .coverkit--bold .coverkit__boldfoot { display: none; }
.cover--row .coverkit--bold .coverkit__title--bold,
.cover--mini .coverkit--bold .coverkit__title--bold { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== 报纸(复刻自 ogcops blog/newspaper) ==================== */
.coverkit--newspaper {
  padding: 7% 9%;
  background: #f5f0e8;
  color: #1a1a1a;
  text-align: center;
  align-items: center;
}
.coverkit--newspaper .coverkit__masthead {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.coverkit__rule { width: 100%; flex: none; }
.coverkit__rule--thick { height: 3px; background: #2c2c2c; margin-top: 6px; }
.coverkit__rule--thin { height: 1px; background: #999; margin: 3px 0; }
.coverkit--newspaper .coverkit__dateline {
  width: 100%;
  display: flex;
  justify-content: space-between;
  font-size: 10px;
  font-style: italic;
  text-transform: uppercase;
  color: #555;
  margin: 4px 0;
}
.coverkit--newspaper .coverkit__title--serif {
  font-family: Georgia, 'Playfair Display', 'Times New Roman', serif;
  font-size: clamp(15px, 4cqw, 38px);
  line-height: 1.15;
  flex: 1;
  display: flex;
  align-items: center;
  color: #1a1a1a;
}
.coverkit--newspaper .coverkit__byline {
  font-size: 11px;
  font-style: italic;
  color: #666;
  margin-top: 4px;
}
.cover--row .coverkit--newspaper .coverkit__dateline,
.cover--mini .coverkit--newspaper .coverkit__dateline,
.cover--row .coverkit--newspaper .coverkit__byline,
.cover--mini .coverkit--newspaper .coverkit__byline,
.cover--row .coverkit--newspaper .coverkit__masthead,
.cover--mini .coverkit--newspaper .coverkit__masthead { display: none; }
.cover--row .coverkit--newspaper .coverkit__title--serif,
.cover--mini .coverkit--newspaper .coverkit__title--serif { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== 侧栏(复刻自 ogcops blog/sidebar-accent) ==================== */
.coverkit--sidebar {
  flex-direction: row;
  background: #fff;
}
.coverkit__sidebar-bar {
  width: 3.5%;
  flex: none;
  display: block;
  background: linear-gradient(180deg, hsl(var(--ck-h) 70% 55%), hsl(var(--ck-h) 70% 55% / .4));
}
.coverkit--sidebar .coverkit__sidebar-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 10px;
  padding: 8% 9%;
  min-width: 0;
}
.coverkit__badge {
  align-self: flex-start;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid hsl(var(--ck-h) 60% 50%);
  color: hsl(var(--ck-h) 60% 42%);
}
.coverkit--sidebar .coverkit__title--dark {
  color: #1a1a1a;
  font-size: clamp(13px, 3.4cqw, 32px);
}
.coverkit--sidebar .coverkit__sidebar-foot {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  color: #8a8a8e;
}
.coverkit__dotsep { width: 3px; height: 3px; border-radius: 50%; background: currentColor; display: block; flex: none; }
.cover--row .coverkit--sidebar .coverkit__badge,
.cover--mini .coverkit--sidebar .coverkit__badge,
.cover--row .coverkit--sidebar .coverkit__sidebar-foot,
.cover--mini .coverkit--sidebar .coverkit__sidebar-foot { display: none; }
.cover--row .coverkit--sidebar .coverkit__title--dark,
.cover--mini .coverkit--sidebar .coverkit__title--dark { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== 对话气泡(复刻自 ogcops quote/speech-bubble) ==================== */
.coverkit--bubble {
  padding: 7% 8%;
  justify-content: center;
  gap: 10px;
  background: #0a0a0a;
}
.coverkit--bubble .coverkit__bubble {
  position: relative;
  background: hsl(var(--ck-h) 20% 14%);
  border: 1px solid hsl(var(--ck-h) 60% 50% / .35);
  border-radius: 20px 20px 20px 4px;
  padding: 6% 7%;
}
.coverkit__bubble-tail {
  position: absolute;
  left: 18px;
  bottom: -9px;
  width: 16px;
  height: 16px;
  background: hsl(var(--ck-h) 20% 14%);
  border-right: 1px solid hsl(var(--ck-h) 60% 50% / .35);
  border-bottom: 1px solid hsl(var(--ck-h) 60% 50% / .35);
  border-radius: 0 0 4px 0;
  display: block;
}
.coverkit--bubble .coverkit__title--bubble {
  margin: 0;
  color: #fff;
  font-size: clamp(12px, 2.6cqw, 25px);
  font-weight: 600;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}
.coverkit--bubble .coverkit__bubble-author {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: 4px;
  font-size: 12px;
  color: rgb(255 255 255 / .7);
}
.coverkit__avatar {
  width: 24px;
  height: 24px;
  flex: none;
  border-radius: 50%;
  background: hsl(var(--ck-h) 65% 45%);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.cover--row .coverkit--bubble .coverkit__bubble-author,
.cover--mini .coverkit--bubble .coverkit__bubble-author { display: none; }
.cover--row .coverkit--bubble .coverkit__title--bubble,
.cover--mini .coverkit--bubble .coverkit__title--bubble { font-size: 11px; -webkit-line-clamp: 2; }
.cover--row .coverkit--bubble .coverkit__bubble,
.cover--mini .coverkit--bubble .coverkit__bubble { border-radius: 10px 10px 10px 3px; padding: 8%; }

/* ==================== 复古终端(复刻自 ogcops blog/retro-terminal) ==================== */
.coverkit--retro {
  /* p3.36③B:同 .coverkit--quote 那处——不需要再声明 position:relative,
     .coverkit 基础规则已经是 absolute,足够当 .coverkit__retro-scanlines
     的定位锚点。 */
  padding: 6% 7%;
  background: #0a0a0a;
  font-family: var(--font-code, ui-monospace, SFMono-Regular, Menlo, Consolas, monospace);
  color: #00ff41;
}
.coverkit__retro-scanlines {
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg, rgb(0 255 65 / .06) 0px, transparent 1px, transparent 3px);
  pointer-events: none;
}
.coverkit--retro .coverkit__retro-head {
  font-size: 11px;
  opacity: .8;
}
.coverkit--retro .coverkit__retro-head span { opacity: .55; margin-left: 6px; }
.coverkit__retro-rule {
  width: 100%;
  height: 1px;
  background: rgb(0 255 65 / .35);
  margin: 6px 0;
  flex: none;
}
.coverkit--retro .coverkit__retro-tag {
  font-size: 12px;
  opacity: .65;
  margin-bottom: 6px;
}
.coverkit--retro .coverkit__retro-title {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: clamp(13px, 2.7cqw, 26px);
  font-weight: 600;
  line-height: 1.3;
}
.coverkit--retro .coverkit__retro-foot {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  opacity: .6;
}
.cover--row .coverkit--retro .coverkit__retro-head,
.cover--mini .coverkit--retro .coverkit__retro-head,
.cover--row .coverkit--retro .coverkit__retro-tag,
.cover--mini .coverkit--retro .coverkit__retro-tag,
.cover--row .coverkit--retro .coverkit__retro-foot,
.cover--mini .coverkit--retro .coverkit__retro-foot,
.cover--row .coverkit--retro .coverkit__retro-rule,
.cover--mini .coverkit--retro .coverkit__retro-rule { display: none; }
.cover--row .coverkit--retro .coverkit__retro-title,
.cover--mini .coverkit--retro .coverkit__retro-title { font-size: 11px; }

/* ==================== 摘要(复刻自 ogcops newsletter/digest-banner) ==================== */
.coverkit--digest {
  padding: 7% 8%;
  background: #1a1a2e;
  justify-content: center;
  gap: 8px;
}
.coverkit--digest .coverkit__digest-head {
  display: flex;
  justify-content: space-between;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: hsl(20 75% 65%);
}
.coverkit--digest .coverkit__digest-head span:last-child {
  color: rgb(255 255 255 / .45);
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
}
.coverkit__digest-rule {
  display: block;
  width: 46px;
  height: 3px;
  border-radius: 2px;
  background: linear-gradient(90deg, hsl(20 75% 65%), transparent);
  flex: none;
  margin: 2px 0 4px;
}
.coverkit--digest .coverkit__title--digest {
  color: #fff;
  font-size: clamp(14px, 4.2cqw, 40px);
  font-weight: 800;
}
.coverkit--digest .coverkit__pillrow {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.coverkit__pill {
  font-size: 10px;
  padding: 3px 10px;
  border-radius: 999px;
  border: 1px solid rgb(255 255 255 / .28);
  color: rgb(255 255 255 / .8);
  white-space: nowrap;
}
.cover--row .coverkit--digest .coverkit__pillrow,
.cover--mini .coverkit--digest .coverkit__pillrow,
.cover--row .coverkit--digest .coverkit__digest-head,
.cover--mini .coverkit--digest .coverkit__digest-head { display: none; }
.cover--row .coverkit--digest .coverkit__title--digest,
.cover--mini .coverkit--digest .coverkit__title--digest { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== 渐变 ==================== */
.coverkit--gradient {
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10%;
  gap: 8px;
  background: linear-gradient(135deg, hsl(var(--ck-h) 65% 55%) 0%, hsl(var(--ck-h) 65% 55%) 45%, hsl(calc(var(--ck-h) + 70) 65% 45%) 100%);
}
.coverkit--gradient .coverkit__title {
  font-size: clamp(15px, 3.6cqw, 34px);
  text-shadow: 0 2px 12px rgb(0 0 0 / .18);
}
.coverkit--gradient .coverkit__meta {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: rgb(255 255 255 / .85);
}
.cover--row .coverkit--gradient .coverkit__meta,
.cover--mini .coverkit--gradient .coverkit__meta { display: none; }
.cover--row .coverkit--gradient .coverkit__title,
.cover--mini .coverkit--gradient .coverkit__title { font-size: 12px; -webkit-line-clamp: 2; }

/* ==================== 几何 ==================== */
.coverkit--geometric {
  /* p3.36③B:同 .coverkit--quote 那处——不需要再声明 position:relative,
     .coverkit 基础规则已经是 absolute,足够当 .coverkit__geo 那几个装
     饰形状的定位锚点。 */
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10%;
  background: hsl(var(--ck-h) 30% 12%);
}
.coverkit__geo {
  position: absolute;
  display: block;
  pointer-events: none;
  opacity: .5;
}
.coverkit__geo--circle {
  width: 34%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: hsl(var(--ck-h) 70% 55%);
  top: -10%;
  right: -8%;
}
.coverkit__geo--triangle {
  width: 0;
  height: 0;
  border-left: 15% solid transparent;
  border-right: 15% solid transparent;
  border-bottom: 26% solid hsl(calc(var(--ck-h) + 100) 65% 55%);
  left: -6%;
  bottom: -4%;
  opacity: .4;
}
.coverkit__geo--square {
  width: 14%;
  aspect-ratio: 1;
  background: hsl(calc(var(--ck-h) + 200) 70% 60%);
  top: 10%;
  left: 6%;
  transform: rotate(18deg);
  opacity: .35;
}
.coverkit--geometric .coverkit__title--geo {
  position: relative;
  color: #fff;
  font-size: clamp(15px, 3.8cqw, 36px);
  text-shadow: 0 2px 16px rgb(0 0 0 / .35);
}
.cover--row .coverkit--geometric .coverkit__geo,
.cover--mini .coverkit--geometric .coverkit__geo { display: none; }
.cover--row .coverkit--geometric .coverkit__title--geo,
.cover--mini .coverkit--geometric .coverkit__title--geo { font-size: 12px; -webkit-line-clamp: 2; }