/*
Theme Name: 7yuewx
Theme URI: https://www.7yuewx.com
Author: ChatGPT
Author URI: https://www.7yuewx.com
Description: 一个兴趣使然的自用博客主题，使用ChatGPT仿制。
Version: v2025.11.03
Text Domain: 7yuewx
*/

/* ---------- Variables ---------- */
:root{
  --bg:#fff; --text:#111; --muted:#666; --divider:#E5E5E5; --dark:#222;

  --container:1200px;
  --header-h:64px;
  --logo-max-h:40px;

  /* Z 轴：Header 最高；遮罩/抽屉只在其下方 */
  --z-header:1000;
  --z-overlay:900;
  --z-drawer:905;
  --z-btt:950;

  /* Drawer 动效 */
  --drawer-duration:.36s;
  --drawer-ease:cubic-bezier(.20,.80,.20,1);

  /* Back-to-top 与安全区 */
  --btt-size:28px;
  --btt-offset:24px;
  --safe-right: env(safe-area-inset-right, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);

  /* Footer 扁平 */
  --footer-vpad:8px;

  /* 汉堡视觉参数（借鉴你给的思路，但用中心定位避免越界） */
  --bar-w:20px;             /* 线条长度（视觉） */
  --bar-h:2px;              /* 线条厚度 */
  --bar-gap:6px;            /* 上/下与中线的垂直间距 */
}

/* ---------- Reset / Base ---------- */
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font:16px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{max-width:var(--container);margin:0 auto;padding:0 16px}

html, body {
  font-family:
    -apple-system, BlinkMacSystemFont, /* macOS/iOS */
    "Segoe UI",                        /* Windows */
    "Noto Sans", "Noto Sans CJK SC", "Noto Sans CJK JP", /* Google系统字体，适配中日文 */
    "Hiragino Kaku Gothic Pro", "Yu Gothic", /* 日文常见字体 */
    "Microsoft YaHei", "SimHei",       /* 中文常见字体 */
    sans-serif;
}

/* ---------- Accessibility ---------- */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:16px;top:8px;background:#000;color:#fff;padding:8px 12px;border-radius:4px;z-index:calc(var(--z-header)+1)}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:var(--z-header); background:#fff;
  border-bottom:1px solid var(--divider);
}
.header-bar{height:var(--header-h);display:flex;align-items:center;justify-content:space-between;overflow:visible}
.header-left,.header-right{width:160px;display:flex;align-items:center;overflow:visible}
.header-middle{flex:1;display:flex;justify-content:center}
.logo img{max-height:var(--logo-max-h);width:auto}

/* 汉堡：点击热区 44×44，三条线绝对居中定位，永不越界/被裁 */
/* 让 header 的内部成为定位上下文 */
.site-header .header-bar { position: relative; }

/* 按钮改成 absolute，锚定在 header 内部，垂直居中 */
.hamburger{
  position: absolute;  /* ← 关键：不再用 fixed */
  left: calc(20px - (22px - (var(--bar-w) / 2)));
  top: 50%;
  transform: translateY(-50%);  /* 保持 44×44 区域中心对齐 */
  z-index: 1;                    /* 仅需盖过 header 背景即可 */
  width:44px; height:44px;
  border:0; background:transparent; cursor:pointer; padding:0; margin:0;
}

.hamburger > span{
  position:absolute; left:50%; top:50%;
  width:var(--bar-w); height:var(--bar-h); background:#111; border-radius:2px;
  transform:translate(-50%,-50%); transition:transform .3s ease, opacity .3s ease, width .3s ease;
}
/* 三条线：基于中心的相对位移，父元素再小也不越界 */
.hamburger > span:nth-child(1){ transform:translate(-50%,-50%) translateY(calc(-1 * var(--bar-gap))); transform-origin:center; }
.hamburger > span:nth-child(2){ transform:translate(-50%,-50%); transform-origin:center; }
.hamburger > span:nth-child(3){transform:translate(-50%,-50%) translateX(calc(-0.1 * var(--bar-w))) translateY(var(--bar-gap)); width:calc(var(--bar-w)*.8); transform-origin:center;}

/* 和你给的写法一致的展开效果（支持两种触发：is-open 或 aria-expanded="true"） */
.hamburger.is-open > span:nth-child(1),
.hamburger[aria-expanded="true"] > span:nth-child(1){
  transform:translate(-50%,-50%) rotate(45deg);
}
.hamburger.is-open > span:nth-child(2),
.hamburger[aria-expanded="true"] > span:nth-child(2){
  opacity:0;
}
.hamburger.is-open > span:nth-child(3),
.hamburger[aria-expanded="true"] > span:nth-child(3){
  transform:translate(-50%,-50%) rotate(-45deg);
  width:var(--bar-w);
}
.hamburger:focus-visible{outline:2px solid #000;outline-offset:4px}

/* 桌面主导航（Logo 右侧，仅桌面） */
.primary-nav{display:none}
@media (min-width:992px){
  .primary-nav{display:block}
  .primary-nav ul{list-style:none;display:flex;gap:20px;margin:0;padding:0}
  .primary-nav a{display:block;padding:6px 2px}
}

/* ---------- Drawer & Overlay：始终从 Header 下方开始 ---------- */
.drawer-overlay {
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  bottom: auto;
  height: calc(100dvh - var(--header-h));
  background: rgba(0,0,0,.25);
  display: none;
  z-index: var(--z-overlay);
}

.drawer {
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  bottom: auto;
  height: calc(100dvh - var(--header-h));
  background: #fff;
  transform: translateX(-100%);
  transition: transform var(--drawer-duration) var(--drawer-ease);
  z-index: var(--z-drawer);
}

.drawer.open{ transform:translateX(0) }
.drawer-overlay.show{ display:block }
.drawer-inner{ max-width:86vw; height:100%; overflow:auto; padding:24px }

/* ---------- Main ---------- */
main{ padding:24px 0 }

/* ---------- Footer（扁平） ---------- */
.site-footer{ background:#222; color:#fff; padding:var(--footer-vpad) 0; margin-top:40px; font-size:12px }
.site-footer .meta{ margin:0; text-align:left; line-height:1.4 }
.site-footer .meta a{ color:#fff; text-decoration:underline }

/* ---------- Back-to-top（更小+外边距+安全区） ---------- */
.back-to-top{
  position:fixed;
  right:calc(var(--btt-offset) + var(--safe-right));
  bottom:calc(var(--btt-offset) + var(--safe-bottom));
  width:var(--btt-size); height:var(--btt-size);
  border-radius:50%; background:#222; border:0; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  z-index:var(--z-btt);
}
.back-to-top img{ width:calc(var(--btt-size)*.5); height:calc(var(--btt-size)*.5); object-fit:contain }

/* 动画降级 */
@media (prefers-reduced-motion: reduce){
  .hamburger > span, .drawer{ transition:none }
}

/* 置顶文章 */
.hero {
  margin-bottom: 42px;
}

@media screen and (max-width: 767px) {
  .hero {
    margin-bottom: 58px;
  }
}

.hero__inner {
  display: block;
  position: relative;
  z-index: 0;           /* 新增：创建 stacking context */
  isolation: isolate;   /* 可选但强烈建议：进一步隔离，防止负层级“穿透” */
  padding-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .hero__inner {
    padding-top: 5.33vw;
    padding-bottom: 0;
  }
}

.hero__inner::after {
  content: "";
  background: #26B5EA;
  width: 100px;
  height: 446px;
  position: absolute;
  top: 50px;
  right: 0;
  z-index: -1;
  pointer-events: none; /* 可选：避免影响点击区域 */
}

@media screen and (min-width: 1366px) {
  .hero__inner::after {
    width: 7.32vw;
    height: 32.65vw;
  }
}

@media screen and (max-width: 767px) {
  .hero__inner::after {
    width: 10.67vw;
    height: 67.47vw;
    top: 10.67vw;
  }
}

@media screen and (min-width: 768px) {
  .hero__inner.is-hover .hero__image {
    background-color: #000000;
  }
  .hero__inner.is-hover .hero__image img {
    opacity: .85;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
  }
}

.hero__image {
  width: 1000px;
  height: 560px;
  border-radius: 0px 280px 280px 0px;
  overflow: hidden;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  z-index: 0;
}

@media screen and (min-width: 1366px) {
  .hero__image {
    width: 73.21vw;
    height: 41vw;
    border-radius: 0px 20.5vw 20.5vw 0px;
  }
}

@media screen and (max-width: 767px) {
  .hero__image {
    width: auto;
    height: 75.47vw;
  }
}

.hero__image img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  font-family: 'object-fit: cover;';
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.hero__main {
  position: absolute;
  top: 80px;
  right: 140px;
}

@media screen and (min-width: 1366px) {
  .hero__main {
    top: 5.86vw;
    right: 9.45vw;
  }
}

@media screen and (max-width: 767px) {
  .hero__main {
    position: static;
    margin-top: -12px;
    padding-bottom: 34px;
  }
}

.hero__tag {
  margin-bottom: 40px;
}

@media screen and (max-width: 767px) {
  .hero__tag {
    padding: 0 20px;
    margin-bottom: 12px;
  }
}

.hero__contents {
  width: 460px;
  background: #FFFFFF;
  padding: 24px 40px 30px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .hero__contents {
    width: auto;
    padding: 0 20px 0 20px;
  }
}

.hero__date {
  color: #666666;
  font-size: 12px;
}

@media screen and (max-width: 767px) {
  .hero__date {
    display: block;
    margin-bottom: 10px;
  }
}

.hero__heading {
  font-size: 30px;
  font-weight: bold;
  line-height: 48px;
  letter-spacing: 1.2px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  margin-bottom: 24px;
}

@media all and (-ms-high-contrast: none) {
  .hero__heading {
    max-height: 146px;
  }
}

@media screen and (max-width: 767px) {
  .hero__heading {
    font-size: 24px;
    line-height: 38px;
    letter-spacing: 1px;
    margin-bottom: 12px;
  }
}

.hero__text {
  color: #666666;
  font-size: 14px;
  letter-spacing: 1.4px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

@media all and (-ms-high-contrast: none) {
  .hero__text {
    max-height: 75px;
  }
}

@media screen and (max-width: 767px) {
  .hero__text {
    font-size: 12px;
    line-height: 25px;
    letter-spacing: 1.2px;
  }
}

.hero__link {
  font-size: 0;
  position: absolute;
  left: 80px;
  bottom: 0;
}

@media screen and (max-width: 767px) {
  .hero__link {
    position: static;
    text-align: center;
    padding: 0 20px;
  }
}

.hero{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}

/* 基础 */
.c-tag {
  font-size: 12px;
  letter-spacing: 0.6px;
  line-height: 1.5;
  border: 1px solid;
  border-radius: 1000px;
  position: relative;
  display: inline-block;
}

/* 循环输出时，除第一个外的标签左侧间距 */
.c-tag + .c-tag {
  margin-left: 20px;
}

/* 内层 span 基础 */
.c-tag span {
  padding: 2px 20px;
  border-radius: 1000px;
  position: relative;
  z-index: 5;
  display: block;
  overflow: hidden;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* PC 悬停改字色（xlarge 会覆盖为 inherit，见下） */
@media screen and (min-width: 768px) {
  .c-tag span:hover {
    color: #FFFFFF;
  }
}

/* 覆盖层（在 xlarge 与移动端被隐藏，见下） */
.c-tag span::before {
  content: "";
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  -webkit-transform: translateX(-100%);
  transform: translateX(-100%);
  z-index: -1;
}

/* 移动端隐藏覆盖层 */
@media screen and (max-width: 767px) {
  .c-tag span::before {
    display: none;
  }
}

/* 悬停时覆盖层滑入 */
.c-tag span:hover::before {
  -webkit-transform: translateX(0);
  transform: translateX(0);
}

/* 外层装饰线 */
.c-tag::after {
  content: "";
  display: block;
  height: 1px;
  width: 12px;
  position: absolute;
  top: 0;
  left: -9px;
  bottom: 0;
  margin: auto;
}

/* 颜色修饰：--all */
.c-tag--all {
  color: #26B5EA;
  border-color: #26B5EA;
}
.c-tag--all::before {
  background: #26B5EA; /* 虽未定义尺寸，但仍为匹配到的规则 */
}
.c-tag--all::after {
  background: #26B5EA;
}
.c-tag--all span::before {
  background: #26B5EA;
}

/* 尺寸修饰：--xlarge */
.c-tag--xlarge {
  font-size: 56px;
  border-width: 3px;
}
.c-tag--xlarge span {
  padding: 15px 50px;
}
/* 移动端尺寸调整 */
@media screen and (max-width: 767px) {
  .c-tag--xlarge span {
    padding: 10px 44px;
  }
}
/* xlarge 关闭覆盖层（覆盖上面的 ::before） */
.c-tag--xlarge span::before {
  display: none;
}
/* xlarge 保持悬停文字颜色不变（覆盖 PC 悬停白字） */
@media screen and (min-width: 768px) {
  .c-tag--xlarge span:hover {
    color: inherit;
  }
}
/* xlarge 外层装饰线尺寸 */
.c-tag--xlarge::after {
  width: 80px;
  height: 3px;
  left: -55px;
}
/* xlarge 外层装饰线移动端尺寸 */
@media screen and (max-width: 767px) {
  .c-tag--xlarge::after {
    width: 36px;
    height: 1px;
    left: -20px;
  }
}
/* xlarge 在移动端整体缩小边框与字号 */
@media screen and (max-width: 767px) {
  .c-tag--xlarge {
    font-size: 26px;
    border-width: 1px;
  }
}

/* 按钮通用 */
.c-button {
  outline: none;
}

/* 主按钮 */
.c-button--primary {
  font-size: 14px;
  color: #FFFFFF;
  letter-spacing: 2px;
  width: 440px;
  padding: 24px 52px;
  display: inline-block;
  text-align: center;
  border: 1px solid #222222;
  background: #222222;
  position: relative;
  -webkit-transition: color 0.3s;
  transition: color 0.3s;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  vertical-align: bottom;
  z-index: 5;
  cursor: pointer;
}

/* 移动端尺寸 */
@media screen and (max-width: 767px) {
  .c-button--primary {
    width: 100%;
    max-width: 335px;
    font-size: 12px;
    padding: 18px 50px;
  }
}

/* 背景滑入层（白色）——修正发丝线问题的完整替换版本 */
.c-button--primary::before {
  content: "";
  position: absolute;
  inset: 0; /* 代替 top/left/bottom/width/height，更严密贴合 */
  display: block;
  background: #FFFFFF;
  z-index: -1;

  /* 动画与初始状态：多推 1% 并使用 3D 变换，避免子像素漏出 */
  -webkit-transform: translate3d(-101%, 0, 0);
  transform: translate3d(-101%, 0, 0);

  -webkit-transition: -webkit-transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;

  /* 降低 WebKit/Blink 边缘抗锯齿伪影 */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  will-change: transform;
}

/* 桌面端悬停效果（未禁用时）：字色变深、白底滑入 */
@media screen and (min-width: 768px) {
  .c-button--primary:not(.is-disabled):hover {
    color: #222222;
  }
  .c-button--primary:not(.is-disabled):hover::before {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

/* NEWS */
.news {
  margin-bottom: 100px;
}

@media screen and (max-width: 767px) {
  .news {
    margin-bottom: 60px;
  }
}

.news__heading {
  font-size: 24px;
  letter-spacing: 2.4px;
  text-align: center;
  position: relative;
  margin-bottom: 20px;
  padding-bottom: 5px;
}

@media screen and (max-width: 767px) {
  .news__heading {
    padding-bottom: 6px;
    margin-bottom: 20px;
  }
}

.news__heading::after {
  content: "";
  height: 1px;
  width: 40px;
  background: #222222;
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.news__inner {
  width: 1180px;
  margin: auto;
  padding-bottom: 60px;
}

@media screen and (max-width: 767px) {
  .news__inner {
    width: auto;
    padding: 0 20px;
  }
}

.news__body {
  margin-bottom: 20px;
}

@media screen and (max-width: 767px) {
  .news__body {
    margin-bottom: 40px;
  }
}

.news__link {
  text-align: center;
  font-size: 0;
}

@media screen and (max-width: 767px) {
  .news__link {
    padding: 0 20px;
  }
}

/* NEWS 列表：为每条链接增加上下内边距，拉开间距并扩大可点击区域 */
.c-posts--string-list .c-posts__item > a{
  display: block;
  padding-block: 6px; /* 约等于每项之间总间距 12px，可按需改大/改小 */
}

.news{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);}

/* ===================================================== */
/*                     PICKUP（微调版·修正）             */
/* 仅修：黑点 / 白面板右收过多 / 过渡 1.5s               */
/* ===================================================== */

.pickup{
  position: relative;
  width: 100vw;                  /* 等于视口宽 */
  left: 50%;
  transform: translateX(-50%);
  overflow-x: clip;
  z-index: 0;
  isolation: isolate;

  --gap: 24px;                   /* PC 间距 */
  --arrow: 40px;                 /* 箭头尺寸 */
  --arrow-gap: 10px;
  --stripe-size: 12px;           /* 蓝白条宽（右侧竖条 & 底部条） */
}
.pickup, .pickup *{ box-sizing: border-box; }

/* 标题 */
.pickup__heading{ text-align:center; margin:0 auto 12px; }
.pickup__heading img{ display:block; margin:0 auto; width:min(520px, 36vw); height:auto; }
@media (max-width:767px){ .pickup__heading img{ width:220px; } }

/* 主体 */
.pickup__body{ position:relative; z-index:0; margin-bottom:36px; }
.pickup__wrap{
  position: relative;
  --wrap-w: min(1280px, 94vw);   /* PC 宽度容器（3卡） */
  --panel-left-out: 40px;        /* 白面板左外侧“收”距离 */
  width: var(--wrap-w);
  margin: 44px auto 0;
}
.pickup__viewport{
  width: var(--wrap-w);
  margin: 0 auto;
  overflow: hidden;              /* 禁横向滚 */
  position: relative;
}

/* 列表：PC=3卡，SP=1卡（见媒体查询）
   修：list-style:none 去掉右下角黑点；过渡 1.5s 更顺滑 */
.pickup__list{
  display:flex;
  gap: var(--gap);
  align-items:flex-start;
  will-change: transform;
  margin:0; padding:0;
  list-style: none;                                   /* ✅ 去黑点 */
  transition: transform 1.5s cubic-bezier(.22,.61,.36,1); /* ✅ 更慢更顺 */
}
.pickup__item{
  flex: 0 0 calc( (var(--wrap-w) - 2*var(--gap)) / 3 ); /* PC 三等分 */
}

/* 箭头：以“图片高度”为基准垂直居中；方向为常规 > / < */
.pickup__arrow{
  position:absolute;
  top: calc(var(--img-h, 270px) / 2);
  transform: translateY(-50%);
  width: var(--arrow);
  height: var(--arrow);
  background:#222;
  border:1px solid #222;
  border-radius:0;
  cursor:pointer;
  text-indent:-9999px;
  z-index:5;
  outline:none;
}
.pickup__arrow::after{
  content:""; position:absolute; left:50%; top:50%;
  width:12px; height:12px;
  border-right:2px solid #fff;
  border-top:2px solid #fff;
  transform: translate(-50%,-50%) rotate(45deg);  /* “>” */
}
.pickup__prev::after{ transform: translate(-50%,-50%) rotate(225deg); } /* “<” */

@media (min-width:768px){
  .pickup__wrap{ --card-w: calc( (var(--wrap-w) - 2*var(--gap)) / 3 ); }
  /* 贴中间卡片左右边 */
  .pickup__prev{ left: calc(50% - (var(--card-w)/2) - var(--arrow) - var(--arrow-gap)); }
  .pickup__next{ left: calc(50% + (var(--card-w)/2) + var(--arrow-gap)); }
}
@media (hover:hover){
  .pickup__arrow:hover{ background:#fff; }
  .pickup__arrow:hover::after{ border-color:#222; }
}

/* 卡片与图片 */
.card{ display:block; position:relative; z-index:0; isolation:isolate; padding-bottom:18px; }
.card__thumb{
  height: var(--img-h, 270px);
  border-radius:6px; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
  background:#f2f2f2;
}
.card__thumb img{ width:100%; height:100%; object-fit:cover; transition:transform .3s, opacity .3s; }
@media (hover:hover){ .card:hover .card__thumb img{ transform:scale(1.06); opacity:.9; } }

/* 白面板
   ✅ 修：右侧“收进来”过多 —— 条纹画在面板内部，面板宽度做“左右对称收”
   => 宽 = 100% - 2*左收  （不再额外减去条纹宽度）
   覆盖高度维持你给的更小值。 */
.card__panel{
  position:relative;
  width: clamp(300px,
               calc(100% - 2*var(--panel-left-out)),
               427px);
  margin: -14px 0 0 var(--panel-left-out);
  padding: 20px 30px 24px;
  overflow: visible; /* 方案1：允许条纹向右侧伸出到面板外 */
}
/* 白底 */
.card__panel::after{
  content:""; position:absolute; inset:0; background:#fff; border-radius:4px; z-index:0;
  box-shadow:0 1px 0 rgba(0,0,0,.02);
}
/* 蓝白条：右竖 + 底横
   方向右上→左下（-45deg）；条纹“延出到面板外侧”
   关键点：右侧负 inset，把伪元素在右侧多扩 var(--stripe-size) */
.card__panel::before{
  content:""; position:absolute; inset:0 calc(-1 * var(--stripe-size)) 0 0; z-index:1; pointer-events:none;
  background:
    /* 右侧竖条（位于扩展区域里，不侵占白面） */
    repeating-linear-gradient(-45deg,#26B5EA 0 8px,transparent 8px 16px)
      right 0 top 0 / var(--stripe-size) 100% no-repeat,
    /* 底部横条：宽度补回 +var(--stripe-size) 以对齐新右边缘 */
    repeating-linear-gradient(-45deg,#26B5EA 0 8px,transparent 8px 16px)
      right 0 bottom 0 / calc(100% - 72px + var(--stripe-size)) var(--stripe-size) no-repeat;
  /* 左侧保持圆角，右侧伸出不需要圆角 */
  border-radius:4px 0 0 4px;
}
/* 面板内容层级 */
.card__panel > *{ position:relative; z-index:2; }

/* 文案 */
.card__title{
  margin:10px 0 13px;
  font-size:14px; line-height:22px; letter-spacing:1.4px;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
}
.card__meta{ margin-top:18px; display:flex; justify-content:space-between; align-items:center; }
.card__date{ font-size:12px; color:#666; }

/* 标签 */
.card__tag{ margin-bottom:0; padding-left:13px; }
.pickup .tag{ font-size:12px; line-height:1; color:#26B5EA; border:1px solid currentColor; border-radius:1000px; position:relative; display:inline-block; }
.pickup .tag span{ display:block; padding:5px 25px; border-radius:1000px; position:relative; z-index:1; overflow:hidden; transition:color .3s; }
.pickup .tag::after{ content:""; position:absolute; left:-13px; top:50%; width:24px; height:1px; background:currentColor; transform:translateY(-50%); }
.pickup .tag span::before{ content:""; position:absolute; inset:0; background:currentColor; transform:translateX(-100%); transition:transform .3s; z-index:0; }
@media (hover:hover){
 .pickup .tag span:hover{ color:#fff; }
 .pickup .tag span:hover::before{ transform:translateX(0); }
}
.pickup .tag--lg{ font-size:17px; }

/* READ MORE 容器 */
.pickup__link{ text-align:center; font-size:0; }

/* ========================= */
/*          移动端           */
/* ========================= */
@media (max-width:767px){
  .pickup{
    --gap: 10px;
    --arrow: 36px;
    --arrow-gap: 6px;
  }
  .pickup__wrap{
    --peek: 5.5vw;                 /* 左右微露 */
    --card-w: calc(100vw - 2*var(--peek));
    --img-h: calc(var(--card-w) * 0.519); /* 520:270 比例 */
    --wrap-w: 100vw;
    --panel-left-out: 3vw;         /* SP 左收更小 */
    margin-top: 40px;
  }
  .pickup__viewport{ width:100vw; }
  .pickup__list{ padding: 0 var(--peek); }
  .pickup__item{ flex: 0 0 var(--card-w); }

  /* 箭头贴“当前卡片图片”左右 */
  .pickup__prev{ left: calc(var(--peek) + var(--arrow-gap)); }
  .pickup__next{ right: calc(var(--peek) + var(--arrow-gap)); }

  /* 面板：对称收缩（不扣条纹宽度），覆盖稍减 */
  .card__panel{
    width: clamp(240px,
                 calc(100% - 2*var(--panel-left-out)),
                 79.5vw);
    margin: -4.5vw 0 0 var(--panel-left-out);
    padding: 20px 20px 24px;
  }

  .pickup__body{ margin-bottom:28px; }
}

/* 文章列表 */
/* =============================== */
/*        NEW POST / Recent        */
/* =============================== */

.recent{
  /* 等于视口宽度 + 居中对齐（确保左右 20px 视口边距生效） */
  position: relative;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  overflow-x: clip; /* 防横向滚动条 */
  box-sizing: border-box;
}
@media (max-width: 767px){
  .recent{
    margin: 80px 0 60px;
  }
}

/* 标题：居中 + 底部细线 */
.recent__heading{
  font-size: 24px;
  letter-spacing: 2.4px;
  text-align: center;
  position: relative;
  margin: 0 auto 20px;
  padding-bottom: 5px;
}
.recent__heading::after{
  content: "";
  height: 1px;
  width: 40px;
  background: #222;
  position: absolute;
  left: 0; right: 0; bottom: 0;
  margin: auto;
}
@media (max-width: 767px){
  .recent__heading{
    margin-bottom: 40px;
    padding-bottom: 6px;
  }
}

/* 内层容器：左右 20px 视口边距 */
.recent__inner{
  max-width: 1180px;      /* 与原站一致的内容宽上限 */
  margin: 0 auto;
  padding: 0 20px;        /* 关键：视口层级的左右边距 */
  box-sizing: border-box;
}

/* 内容与 READ MORE 的间距 */
.recent__body{ margin-bottom: 34px; }
@media (max-width: 767px){
  .recent__body{ margin-bottom: 40px; }
}
.recent__link{
  text-align: center;
  font-size: 0;
}

/* 列表（3列布局） */
.c-posts{ padding-top: 20px; }
@media (max-width: 767px){ .c-posts{ padding-top: 0; } }

.recent .c-posts__list{
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 采用 CSS Grid 更稳：PC=3列，列距60、行距50；SP=1列，行距30 */
.c-posts--3column .c-posts__list{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 60px;
  row-gap: 50px;
}
@media (max-width: 767px){
  .c-posts--3column .c-posts__list{
    grid-template-columns: 1fr;
    column-gap: 0;
    row-gap: 30px;
  }
}

/* 单卡片 */
.c-posts__item{ min-width: 0; } /* 防止内容撑列 */

/* 卡片外层链接块 */
.c-card{
  display: block;
  text-decoration: none;
  color: inherit;
  outline: none;
}

/* 缩略图：350:182 视觉比，圆角、溢出隐藏 */
.c-card__thumbnail{
  position: relative;
  width: 100%;
  aspect-ratio: 350 / 182; /* 约 1.92:1，贴近原站 */
  border-radius: 6px;
  overflow: hidden;
  background: #f2f2f2;
  margin: 0 0 16px 0;
}
.c-card__thumbnail img{
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .28s ease, opacity .28s ease;
}
@media (hover:hover){
  .c-card:hover .c-card__thumbnail img{
    transform: scale(1.04);
    opacity: 0.92;
  }
}

/* 内容区 */
.c-card__contents{}

/* 标签行（复用你在 pickup 中的 .tag 样式即可） */
.c-card__tag{
  font-size: 0;
  margin-bottom: 10px;
}
.c-card__tag .c-tag{ vertical-align: middle; }

/* 标题：两行截断风格接近原站 */
.c-card__heading{
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
  letter-spacing: 1.4px;
  margin: 0 0 10px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* 摘要：正文前三行（由 PHP 输出 <br><br>），颜色/行高贴近原站 */
.c-card__text{
  color: #666;
  font-size: 12px;
  line-height: 22px;
  letter-spacing: 1.2px;
  margin: 0 0 14px;
  /* 为防止长链接破版 */
  word-wrap: break-word;
  overflow-wrap: anywhere;
}

/* 日期：右对齐风格 */
.c-card__data{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.c-card__date{
  font-size: 12px;
  line-height: 17px;
  color: #666;
}

/* 小屏更多留白 */
@media (max-width: 767px){
  .recent__inner{ padding: 0 20px; }  /* 保持与视口 20px 一致 */
}

/* 1) 与上一块距离略收窄 */
.recent{ margin: 96px 0 100px; }
@media (max-width:767px){
  .recent{ margin: 70px 0 60px; }
}

/* 2) 卡片之间加浅灰分隔线，并让分隔线上下留白 */
.c-posts--3column .c-posts__item{
  position: relative;
  padding-top: 16px;
  padding-bottom: 16px;
}
.c-posts--3column .c-posts__item::after{
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: #E5E5E5;
}

/* 3) 标签左侧那条“穿插线”对齐卡片左边缘（不再伸出 20px 视口外边距之外） */
.recent .c-card__tag{ position: relative; }
.recent .tag::after{
  left: 0;                          /* 改为紧贴内容左边 */
  transform: translateY(-50%);      /* 仅垂直居中，不再向左溢出 */
}

/* 4) 摘要按“3 行”裁切（不是 3 段） */
.c-card__text{
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;  /* 关键：限制为三行 */
  overflow: hidden;
}

/* ========== ① 标签左侧连线对齐卡片左边缘（仅 recent 区域） ========== */
/* 把连线从 .tag::after 移到容器上画，确保贴齐卡片内容左边 */
.recent .c-card__tag{
  position: relative;
  color: #26B5EA;              /* 供 ::before 使用 currentColor */
}

/* 隐藏原本标签内的“左侧穿插线”，避免双线 */
.recent .tag::after{ content: none; }

/* 在容器上画一条基线，正好贴齐卡片内容左边缘 */
.recent .c-card__tag::before{
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 13px;                 /* 与原来穿插长度一致 */
  height: 1px;
  background: currentColor;
  transform: translateY(-50%);
}

/* 标签胶囊向右让出 13px，让基线“接”到胶囊左边 */
.recent .c-card__tag .c-tag{ margin-left: 13px; }

/* ========== ② 分割线上下对称，落在 row-gap 中心（3列 & 单列） ========== */
/* 用一个变量统一控制行间距，让分割线能居中站在这个间距里 */
.c-posts--3column .c-posts__list{
  --row-gap: 50px;             /* PC 行距 */
  row-gap: var(--row-gap);
}

/* 单列时改为 30px 行距 */
@media (max-width: 767px){
  .c-posts--3column .c-posts__list{ --row-gap: 30px; }
}

/* 每个卡片上下对称留白，并允许伪元素越界到“下半格”里 */
.c-posts--3column .c-posts__item{
  position: relative;
  padding-block: 16px;         /* 上下各 16px */
  overflow: visible;
}

/* 分割线画在“当前卡片底部向下”半个 row-gap 的位置 = 正好居中 */
.c-posts--3column .c-posts__item::after{
  content: "";
  position: absolute;
  left: 0; right: 0;
  bottom: calc(-1 * var(--row-gap) / 2);
  height: 1px;
  background: #E5E5E5;
}

/* 最后一行不画分割线（3列布局时，最后 3 个为最后一行） */
@media (min-width: 768px){
  .c-posts--3column .c-posts__item:nth-last-child(-n + 3)::after{ content: none; }
}

/* 单列时只需把最后一个去掉即可 */
@media (max-width: 767px){
  .c-posts--3column .c-posts__item:last-child::after{ content: none; }
}

/* ========================= */
/*        Pagination         */
/* ========================= */

.pager{
  width: min(1180px, calc(100vw - 40px));
  margin: 28px auto 120px;
  display: grid;
  grid-template-columns: 56px 1fr 56px;   /* 左按钮 | 中间 | 右按钮 */
  align-items: center;
  gap: 20px;
}
.pager__side{
  display: flex;
  justify-content: center;
  align-items: center;
}
.pager__center{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  flex-wrap: wrap;
}

/* 左右的黑色方块箭头 */
.pager__square{
  width: 56px; height: 56px;
  background: #222; border: 1px solid #222;
  display: inline-flex; align-items: center; justify-content: center;
}
.pager__square.is-disabled{
  opacity: .35; pointer-events: none;
}
.pager__square i{
  display: block; width: 16px; height: 16px; position: relative;
}
.pager__square i::before{
  content:""; position:absolute; left:50%; top:50%;
  width: 14px; height: 14px;
  border-top: 2px solid #fff; border-right: 2px solid #fff;
  transform: translate(-50%,-50%) rotate(45deg); /* 默认“>” */
}
.pager__square--prev i::before{
  transform: translate(-50%,-50%) rotate(225deg); /* “<” */
}
@media (hover:hover){
  .pager__square:not(.is-disabled):hover{ background:#fff; }
  .pager__square:not(.is-disabled):hover i::before{ border-color:#222; }
}

/* 中间 PREV / NEXT 文案 */
.pager__label{
  font-size: 13px; letter-spacing: 1.2px; color:#222;
}
.pager__label--prev{ order: 1; }
.pager__nums{ order: 2; }
.pager__label--next{ order: 3; }

/* 数字方框 */
.pager__nums{
  display: inline-flex; gap: 8px; align-items:center; margin:0; padding:0; list-style:none;
}
.pager__num{
  min-width: 42px; height: 42px; padding: 0 10px;
  display: inline-flex; align-items:center; justify-content:center;
  border: 1px solid #E5E5E5; color:#999; text-decoration:none; border-radius: 0;
  font-size: 14px;
}
.pager__num:hover{ border-color:#222; color:#222; }
.pager__num.is-current{
  border-color:#222; color:#222; font-weight: 600;
}

/* 小屏优化 */
@media (max-width:767px){
  .pager{
    grid-template-columns: 46px 1fr 46px;
    gap: 12px;
    margin: 20px auto 80px;
  }
  .pager__square{ width:46px; height:46px; }
  .pager__num{ min-width: 38px; height: 38px; font-size: 13px; }
  .pager__center{ gap: 12px; }
}

/* ===========================================
   Single Article
   =========================================== */

.single-article{
  --primary: #26B5EA;

  /* 居中 + 两侧相对视口 20px 边距 */
  width: 100%;
}
.single-article__inner {
  /* 居中容器：宽度 = min(阅读最大宽, 视口宽 - 40px) → 保证两侧各 20px 视口边距 */
  width: min(860px, 100vw - 40px);
  margin: 0 auto;

  /* 去掉相对定位与位移，避免“右偏” */
  position: static;
  left: auto;
  transform: none;

  /* 不限制 max-width，由 width 控制上限 */
  max-width: none;

  /* 继续清掉主题容器可能自带的 padding（保留你的意图） */
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* 标题 */
.single-article__title{
  font-size: 24px;
  line-height: 1.58333;
  letter-spacing: 1.8px;
  font-weight: 500;
  margin: 0 0 12px;
}

/* 分类胶囊（左） + 时间（右） */
.single-article__meta{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom: 18px;
}
.single-article__date{
  font-size:12px; color:#666;
}

/* 复用“胶囊”样式（蓝色边+字） */
.single-article__meta .c-tag{
  font-size:12px; line-height:1; color:var(--primary);
  border:1px solid currentColor; border-radius:1000px;
  position:relative; display:inline-block; vertical-align:middle;
}
.single-article__meta .c-tag > span{ display:block; padding:5px 16px; border-radius:1000px; }
.single-article__meta .c-tag--lg{ font-size:12px; } /* 这里保持 12px */

/* 特色图 */
.single-article__thumb{
  margin: 12px 0 0;
}
.single-article__thumb img{
  width:100%; height:auto; display:block; border-radius:5px;
}

/* 正文 */
.entry-content{
  margin-top: 35px;
  font-size:14px;
  line-height: 2.21429;
  letter-spacing: 0.7px;
}
.entry-content p{ margin: 0 0 1.2em; }
.entry-content a{ text-decoration: underline; }
.entry-content ul, .entry-content ol{ padding-left: 1.4em; margin: 0 0 1.2em; }
.entry-content blockquote{
  border-left: 3px solid #e5e5e5;
  margin: 1.4em 0; padding: .6em 1em; color:#333;
  background:#fafafa;
}

/* 正文图片：自适应 + 上下更大间距 */
.entry-content img{
  max-width:100%; height:auto; display:block;
  border-radius:5px;
  margin: 22px auto;
}
.entry-content figure{ margin: 22px 0; }
.entry-content figcaption{ font-size:12px; color:#666; text-align:center; margin-top:6px; }

/* 正文内 H2（容器 > h2） */
.entry-content > h2{
  margin: 0 0 45px;
  font-size:20px;
  line-height:1.9;
  padding: 30px 20px;
  border-top:1px solid #E5E5E5;
  border-bottom:1px solid #E5E5E5;
  letter-spacing:2px;
  font-weight:500;
}
@media screen and (max-width:767px){
  .entry-content > h2{
    letter-spacing:1.5px;
    padding:30px 10px;
  }
}

/* TAG 区块（双线+黑色胶囊） */
.single-article__tags{
  border-top:1px solid #EAEAEA;
  border-bottom:1px solid #EAEAEA;
  margin: 36px 0 0;
}
.single-article__tags-inner{
  display:flex; align-items:center; flex-wrap:wrap;
  gap: 10px 14px;
  padding: 18px 0;
}
.single-article__tags-label{ font-weight:500; }
.single-article__tags-list{ display:flex; gap:10px; flex-wrap:wrap; list-style:none; margin:0; padding:0; }
.c-chip{
  font-size:12px; line-height:1;
  border:1px solid #222; color:#222; border-radius:1000px; display:inline-block;
}
.c-chip > span{ display:block; padding:6px 14px; }

/* 上一篇/下一篇（双线包裹） */
.post-nav{
  border-top:1px solid #EAEAEA;
  border-bottom:1px solid #EAEAEA;
  margin-top: 28px;
  padding: 8px 0;
  display:flex; flex-direction:column; gap:12px;
}

/* 单条卡片 */
.post-nav__item{
  position:relative;
  display:flex; align-items:center; gap:14px;
  padding: 12px 14px 12px 16px;
  background:#fff;
  text-decoration:none;
  color:inherit;
  border-radius:6px;
  overflow:hidden;
}
.post-nav__item:hover .post-nav__title{ text-decoration:underline; }

/* 缩略图 */
.post-nav__thumb{
  width:110px; height:70px; border-radius:5px; overflow:hidden; flex:0 0 auto; background:#f3f3f3;
}
.post-nav__thumb img{ width:100%; height:100%; object-fit:cover; display:block; }

/* 没图占位 */
.post-nav__thumb--ph{
  background:linear-gradient(135deg,#eee,#f7f7f7);
}

/* 标题文本 */
.post-nav__title{
  font-size:13px; line-height:1.6; color:#000; font-weight:400;
}

/* 装饰竖条 + 箭头（白色） */
.post-nav__item::before,
.post-nav__item::after{ content:""; position:absolute; top:50%; transform:translateY(-50%); pointer-events:none; }

/* 竖条 */
.post-nav__item::before{
  width:10px; height:100%;
  background: var(--primary);
  border-radius:20px;
}

/* 箭头（用边画 ＞ / ＜） */
.post-nav__item::after{
  width:4px; height:4px;
  border-top:2px solid #fff;
  border-right:2px solid #fff;
}

/* prev：竖条在左，箭头指向左 */
.post-nav__prev::before{ left:0; }
.post-nav__prev::after{ left: 2px; transform: translateY(-50%) rotate(225deg); }

/* next：竖条在右，箭头指向右 */
.post-nav__next{ justify-content:space-between; }
.post-nav__next::before{ right:0; }
.post-nav__next::after{ right: 2px; transform: translateY(-50%) rotate(45deg); }

/* next 布局：标题在左、图在右（已在 HTML 顺序中处理） */

/* 面包屑 */
.breadcrumb {
  /* 间距设置：顶部 26px，底部 0 */
  margin: 26px 0 0;

  /* 上下边框用于分隔导航区域 */
  border-top: 1px solid #EAEAEA;
  border-bottom: 1px solid #EAEAEA;

  /* 内边距：上下留白，增强可读性 */
  padding: 12px 0;
}

.breadcrumb__list {
  list-style: none;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 14px;
  margin: 0;
  padding: 0;
  font-size: 12px;
  color: #333;
}

.breadcrumb__sep {
  color: #999;
}

.breadcrumb a {
  color: #333;
  text-decoration: none;
  font-weight: normal;
}

.breadcrumb a:hover {
  text-decoration: underline;
}

/* 响应 */
@media (max-width:767px){
  .single-article__inner{ max-width: 100%; }
  .post-nav__thumb{ width:100px; height:64px; }
}

/* ===== footer区域覆盖变量：加大内边距 & 返回顶部尺寸/间距 ===== */
:root{
  --footer-vpad: 22px;   /* 桌面上下内边距 */
  --btt-size: 44px;      /* 返回顶部按钮尺寸 */
  --btt-offset: 36px;    /* 按钮距右/下的外边距 */
}
@media (max-width: 767px){
  :root{
    --footer-vpad: 18px; /* 移动端更紧凑一点 */
    --btt-size: 38px;
    --btt-offset: 28px;
  }
}

/* ===== Footer：提高上下内边距、去掉链接下划线 ===== */
.site-footer{
  padding: var(--footer-vpad) 0;
}
.site-footer .meta a{
  color:#fff;
  text-decoration: none;       /* 禁止出现下划线 */
}
.site-footer .meta a:hover,
.site-footer .meta a:focus{
  text-decoration: none;       /* 悬停/聚焦也不显示下划线 */
  opacity: .9;                 /* 轻微反馈，可按需删 */
}

/* ===== Back-to-top：更大且离底更高（保留安全区适配） ===== */
.back-to-top{
  right: calc(var(--btt-offset) + var(--safe-right));
  bottom: calc(var(--btt-offset) + var(--safe-bottom));
  width: var(--btt-size);
  height: var(--btt-size);
}
.back-to-top img{
  width: calc(var(--btt-size) * .5);
  height: calc(var(--btt-size) * .5);
}

/* logo追加调整，让 Logo 容器内居中对齐 */
/* 只让容器等高 header；链接本身按内容尺寸收缩 */
.site-header .logo{
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: var(--header-h);
}
.site-header .custom-logo-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 0;
  line-height: 0;
}

/* 只用高度控制尺寸，宽度自适应；清掉全局干扰 */
.site-header .logo img,
.site-header .custom-logo,
.site-header .custom-logo-link img{
  height: var(--logo-h) !important;
  width: auto !important;
  max-width: none !important;
  aspect-ratio: auto;
  display: block;
}

/* 如果你希望小屏略小一些 */
@media (max-width: 767px){
  :root{
    --logo-h: 18px;
    --header-h: 64px;
  }
}

/* =========================================
   Drawer & Widgets (YUE) — 完整优化版
   ========================================= */

/* —— 抽屉容器尺寸：拉满，可读的左右内边距 —— */
.drawer {
  /* 保留你原有的定位/动画，不复写 transform/transition/z-index 等 */
}

.drawer-inner{
  width: 100%;
  max-width: none;              /* 关键：取消 86vw 限制，避免“很窄” */
  height: 100%;
  overflow: auto;
  padding: 24px 20px;           /* 移动端左右 20px，视觉干净 */
  margin: 0;                    /* 避免意外外边距 */
  box-sizing: border-box;
}

/* 桌面端：适度增大左右内边距，仍保持拉满（抽屉是全宽容器） */
@media (min-width: 1024px){
  .drawer-inner{
    padding: 28px 32px;
  }
}

/* —— 小工具块通用 —— */
.drawer .widget { 
  margin: 26px 0 30px;          /* 稍微大一些的上下间距 */
}

.drawer .widget-title {
  font-size: 15px;              /* 标题更大 */
  line-height: 1.4;
  letter-spacing: 1.2px;
  font-weight: 600;             /* 轻加粗 */
  color: #111;
  margin: 0 0 12px;
  text-transform: uppercase;    /* 全大写 */
}

/* —— 链接行（菜单/分类/标签）：斜杠分隔 —— */
.yuew-links__list{
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex; 
  flex-wrap: wrap; 
  align-items: center;
}

.yuew-links__li{
  display: inline-flex; 
  align-items: center; 
  line-height: 1.6;
  font-size: 13px;              /* 内容 13px */
  color: #111;
}

.yuew-links__li a{
  color: inherit;               /* 与文本一致（#111） */
  text-decoration: none; 
  font-weight: 400;
  font-size: 13px;
}

.yuew-links__li a:hover{ text-decoration: underline; }

/* 斜杠分隔：与内容同色（黑），并留出两侧间距 */
.yuew-links__li + .yuew-links__li{
  margin-left: 12px;
  position: relative;
}
.yuew-links__li + .yuew-links__li::before{
  content: "/";
  color: currentColor;          /* 与文字同色 */
  opacity: 1;                   /* 不再偏灰 */
  margin-right: 12px;
  font-weight: 400;
}

/* —— 搜索（浅灰胶囊 + 左侧放大镜） —— */
.yuew-search{
  position: relative;
  margin-top: 8px;
  width: 100%;
}

.yuew-search__field{
  width: 100%;
  background: #F2F2F2;
  border: none;
  border-radius: 999px;
  padding: 12px 42px 12px 44px; /* 右留按钮热区，左放图标 */
  font-size: 13px;
  outline: none;
  color: #111;
  box-sizing: border-box;
}

.yuew-search__field::placeholder{ color: #999; }

.yuew-search::before{
  content:"";
  position: absolute; 
  left: 14px; 
  top: 50%; 
  transform: translateY(-50%);
  width: 18px; height: 18px; 
  opacity: .6;
  background: no-repeat center/100%
    url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" stroke="%23111" fill="none" viewBox="0 0 24 24"><circle cx="11" cy="11" r="7" stroke-width="2"/><path d="M20 20l-3.5-3.5" stroke-width="2"/></svg>');
}

/* 提交按钮：无视觉但可点（可访问） */
.yuew-search__submit{
  position: absolute; 
  right: 6px; 
  top: 50%; 
  transform: translateY(-50%);
  width: 32px; height: 32px; 
  border: 0; background: transparent; 
  cursor: pointer;
}
.yuew-search__submit:focus{ 
  outline: 2px solid #111; 
  outline-offset: 2px; 
}

/* —— 确保手机端“拉满父容器” —— */
@media (max-width: 767px){
  .drawer .widget,
  .drawer .widget > *,
  .yuew-links__list,
  .yuew-search{
    width: 100%;
  }
  .yuew-links__list{ justify-content: flex-start; }
}

/* Single 文章内的所有链接：去下划线（含所有状态） */
.single-article a,
.single-article a:visited,
.single-article a:hover,
.single-article a:focus,
.single-article a:active {
  text-decoration: none !important;
}

/* —— 页面过短时防止footer上置，增加高度 —— */
main.container {
  min-height: calc(100vh - 100px);
}