:root {
  --maincolor: #52b788;
  --bordercl: #b0d8c4;
  --callouctcolor: #52b788;
  --hovercolor: #3a9d72;
}

html {
  font-size: 15px;
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

/* 滚动条 */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-thumb {
  background-color: #aaa;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #888;
}
::-webkit-scrollbar-track {
  background: transparent;
  margin-top: 5px;
  margin-bottom: 5px;
}

body {
  background: transparent;
  color: #3e3d3d;
  text-align: justify;
  text-justify: inter-ideograph;
  line-height: 2;
  font-family:Consolas, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", monospace, sans-serif;
  margin: 0 auto;
  word-break: break-word;
}

/* 壁纸背景 + 锐化 + 雾化 */
body::before {
  content: '';
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background:
    linear-gradient(rgba(255,255,255,0.62), rgba(255,255,255,0.62)),
    url('https://api.paugram.com/wallpaper/') center/cover no-repeat;
  filter: contrast(1.08) saturate(1.05) brightness(0.97);
  z-index: -1;
}

* {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

section.list-item {
  margin: 0 auto;
  padding-bottom: 15px;
  border-bottom: 1px dashed #d0e8dc;
}

/* selection */
::selection{
  background: #52b788;
  color: #fff;
}
::-moz-selection{
  background: #52b788;
  color: #fff;
}
::-webkit-selection {
  background: #52b788;
  color: #fff;
}

summary {
  font-size: 0.9em;
  list-style-type: none;
  cursor: pointer;
  display: inline-block;
  margin: 0.5em 0;
}
summary:hover {
  color: var(--hovercolor);
  text-decoration: underline wavy var(--hovercolor);
}
summary::-webkit-details-marker {
  display: none;
}
summary::before {
  content: "+";
  display: inline-block;
  margin-right: 8px;
}
details[open] summary::before {
  content: "-";
}

hr {
  border: 0;
  border-top: 2px dotted var(--bordercl);
  margin: 1em 0;
}

/* footnotes */
.footnotes {
  font-size: 0.9rem;
  color: #657362;
}
a.footnote-ref {
  font-size: 0.8rem;
}

/* ordered lists */
ol {
  list-style-position: outside;
  padding-left: 2em;
  margin: 0;
}
ol li {
  padding: 0;
}
ol li + li {
  list-style: decimal;
  border: none;
}

/* blockquote */
blockquote {
  border-left: 3px solid var(--bordercl);
  color: #737373;
  margin: 0;
  padding-left: 1em;
}

/* links */
a {
  color: #657362;
  text-decoration: none;
}
a:hover {
  color: var(--hovercolor);
}

/* unordered list */
ul {
  list-style: none;
  padding-left: 2ch;
}
ul > li::before {
  content: '* ';
  font-weight: bold;
  color: #52b788;
}

/* pagination */
ul.pagination {
  margin-top: 25px;
  padding-left: 0;
  display: flex;
  justify-content: space-between;
}

/* images */
img {
  display: block;
  padding: 5px;
  border: 1px #e0e0e0 solid;
  box-sizing: border-box;
  max-width: 100%;
}
figure {
  box-sizing: border-box;
  display: inline-block;
  margin: 0;
  max-width: 100%;
}
figure img {
  max-height: 500px;
}
@media screen and (min-width: 600px) {
  figure {
    padding: 0 40px;
  }
}
figure h4 {
  font-size: 1rem;
  margin: 0 0 1em;
}
figure h4::before {
  content: '↳ ';
}

/* code blocks */
code {
  background-color: rgb(247, 247, 247);
  padding: 0.05rem 0.3rem;
  margin-left: 0.15rem;
  margin-right: 0.15rem;
  word-wrap: break-word;
  border-radius: 0.4rem;
  box-shadow: 0.13rem 0.13rem 0.26rem rgb(197, 197, 197);
  font-family: 'Source Code Pro', 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
}
pre {
  background-color: rgb(247, 247, 247);
  line-height: 1.5;
  overflow-x: auto;
  padding: 0.6rem 1em;
  border-radius: 0.4rem;
  max-height: 20em;
  margin: 0;
  word-wrap: break-word;
  position: relative;
}
pre code {
  background-color: transparent;
  box-shadow: none;
  color: inherit;
  font-size: 0.95em;
  padding: 0;
  margin: 0;
  display: block;
  white-space: pre;
  font-weight: normal;
}

/* chroma 统一字重 */
.chroma * { font-weight: normal !important; }

/* highlight block */
.highlight {
  position: relative;
  border-radius: 0.4rem;
  margin: 1em 0;
  -webkit-overflow-scrolling: touch;
  background-color: rgb(247, 247, 247);
  box-shadow: 0.15rem 0.15rem 0.5rem rgb(150, 150, 150);
}
.highlight:hover {
  box-shadow: 0.2rem 0.2rem 0.6rem rgb(130, 130, 130);
}
.highlight pre::selection,
.highlight pre ::selection {
  background: #52b788;
  color: #fff;
}

/* code language label */
.highlight pre code[class*="language-"]::before {
  content: attr(data-lang);
  background: #52b788;
  border-radius: 0 0 0.25rem 0.25rem;
  color: white;
  font-size: 0.75em;
  letter-spacing: 0.025rem;
  padding: 0.2em 0.8em;
  position: absolute;
  right: 1rem;
  top: 0;
  text-align: right;
  text-transform: uppercase;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-weight: 500;
}

/* override specific languages */
.highlight pre code[class="language-js"]::before,
.highlight pre code[class="language-javascript"]::before {
  content: "js";
}
.highlight pre code[class*="language-yml"]::before,
.highlight pre code[class*="language-yaml"]::before {
  content: "yaml";
}
.highlight pre code[class*="language-shell"]::before,
.highlight pre code[class*="language-bash"]::before,
.highlight pre code[class*="language-sh"]::before {
  content: "shell";
}
.highlight pre code[class*="language-json"]::before {
  content: "json";
}
.highlight pre code[class*="language-python"]::before,
.highlight pre code[class*="language-py"]::before {
  content: "py";
}
.highlight pre code[class*="language-css"]::before {
  content: "css";
}
.highlight pre code[class*="language-go"]::before {
  content: "go";
}
.highlight pre code[class*="language-md"]::before,
.highlight pre code[class*="language-markdown"]::before {
  content: "markdown";
}
.highlight pre code[class*="language-ts"]::before,
.highlight pre code[class*="language-typescript"]::before {
  content: "ts";
}
.highlight pre code[class*="language-html"]::before {
  content: "html";
}

/* ========== 响应式调整 ========== */
@media (max-width: 768px) {
  pre {
    padding: 1em 0.8em;
    font-size: 0.9em;
  }
  .highlight pre code[class*="language-"]::before {
    font-size: 0.7em;
    padding: 0.15em 0.6em;
    right: 0.8rem;
  }
}

/* ========== 容器布局 ========== */
.content {
  margin: 0 auto;
  max-width: 700px;
  padding: 0 1ch;
  word-wrap: break-word;
}

main {
  background: #fff;
  padding: 10px 44px 30px;
  box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.15);
  border-radius: 1em;
}

/* ========== 页眉 Header ========== */
header {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  height: 80px;
  max-width: 600px;
  margin: 1em auto;
  padding: 0 20px;
  position: relative;
  contain: content;
}

header .main {
  font-size: 1.5rem;
}

nav {
  font-size: 1rem;
  display: flex;
  gap: 15px;
}

/* ========== 标题样式 ========== */
h1, h2, h3, h4, h5, h6 {
  font-size: 1.1rem;
  color: #657362;
}

h1 {
  font-size: 1.2rem;
  margin: 1em 0 0.5em;
  display: inline-block;
}

h3 {
  background: linear-gradient(transparent 60%, #d0ede0 30%);
  text-decoration: none;
  display: block;              /* 块级元素，保证换行 */
  width: fit-content;          /* 背景宽度随文字内容 */
  margin-block: 0;
  margin-bottom: 1em;
}

/* 标题前缀符号 */
h1::before { content: '# '; color: var(--maincolor); }
h2::before { content: '➭ '; color: var(--maincolor); }
h3::before { content: ''; color: var(--maincolor); }
h4::before { content: '#### '; color: var(--maincolor); }
h5::before { content: '##### '; color: var(--maincolor); }
h6::before { content: '###### '; color: var(--maincolor); }

/* ========== 元信息 ========== */
.meta {
  color: #999;
  font-size: 0.9rem;
}

/* ========== 正文内容 ========== */
.post-container {
  display: flex;
  justify-content: center;
  width: 100%;
  position: relative;
}

.post-content {
  flex: 3;
  min-width: 0;
}

/* ========== TOC 目录 ========== */
.toc {
  position: fixed;
  top: 120px;
  left: calc(50% + 370px);
  max-width: 220px;
  max-height: 70vh;
  overflow-y: auto;
  padding: 1em;
  font-size: 0.85em;
  line-height: 1.5;
  z-index: 999;
}

/* 抑制 h1-h6 前缀符号在 TOC 内出现 */
.toc h1::before, .toc h2::before, .toc h3::before,
.toc h4::before, .toc h5::before, .toc h6::before {
  content: '' !important;
}

/* TOC 滚动条样式 */
.toc::-webkit-scrollbar {
  width: 6px;
}
.toc::-webkit-scrollbar-thumb {
  background-color: #aaa;
  border-radius: 3px;
}

/* TOC 列表优化 */
.toc ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.toc li {
  margin: 0;
  padding: 0.2em 0 0 1em;
  position: relative;
}
.toc li::before {
  content: "›";
  position: absolute;
  left: 0;
  color: #52b788;
  font-size: 0.9em;
}
.toc li + li {
  border: none;
}

/* TOC 当前激活项样式 */
#TableOfContents a.active {
  position: relative;
  font-weight: bold;
  color: #3f2f2f;
  background-image: linear-gradient(to right, #a8d8be 100%, transparent 100%);
  background-size: 100% 8px;
  background-repeat: no-repeat;
  background-position: bottom left;
  padding-bottom: 2px;
}

/* 小屏隐藏 TOC */
@media (max-width: 1024px) {
  .toc {
    display: none;
  }
}

/* ========== 页脚 Footer ========== */
footer {
  display: flex;
  padding: 1rem 0;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  text-align: center;
  font-size: 90%;
}
.soc {
  display: flex;
  align-items: center;
  border-bottom: none;
}
.soc:hover {
  color: white;
}
.border {
  margin: 0.5rem;
  border: 1px solid;
}
.footer-info {
  padding: 0.2em;
}

/* ========== 常规元素 ========== */
.title h1 {
  margin-bottom: 0;
}
time {
  color: grey;
}
article .title {
  margin-bottom: 0.5em;
}

/* ========== 其他样式 ========== */
.site-description {
  display: flex;
  justify-content: space-between;
}

.tags a {
  text-decoration: none;
  margin-right: 8px;
}
.tags a:hover {
  text-decoration: underline wavy var(--hovercolor);
}

.tag-cloud {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  justify-content: space-between;
  font-size:0.9rem;
}
.tag-cloud a {
  padding: 0.3rem 0.8rem;
  background: #f0f0f0;
  border-radius: 1rem;
  margin: 0.2rem;
}

.draft-label {
  color: var(--bordercl);
  text-decoration: none;
  padding: 2px 4px;
  border-radius: 4px;
  margin-left: 6px;
  background-color: #f0f7f3;
}


/*polaroid*/


.polaroid {
    background: white;
    display: inline-block;
    padding: 25px 14.5px 10px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    margin: 1rem 0.55rem;
    position: relative;
    text-align: center;
    z-index: 1; /* 添加默认z-index */
}

.polaroid:hover {
    transform: scale(1.03);
    z-index: 999; /* hover时设置更高的z-index值 */
}


.polaroid img {
    width: 256px;
    height: auto;
    object-fit: cover;
    border: 1px solid #e0e0e0;
    padding: 2px;
}

.polaroid-caption {
    position: relative;
    text-align: center;
    margin-top: 15px;
    margin-bottom:10px;
    color: #666;
    font-size: 0.9rem;
    display: inline-block;
    z-index: 1;
    gap: 3px;
}
.caption-line {
    display: block;
    line-height: 150%;
}
.polaroid-caption::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 12px;
    background-color: rgba(255, 235, 59, 0.3);
    border-radius: 50% 50% 0 0;
    transform: rotate(-1deg);
    z-index: -1;
}
/* 右上角花纹胶带 */
.polaroid::before {
    content: "";
    position: absolute;
    top: -8px;
    right: -10px;
    width: 50px;
    height: 25px;
    background: repeating-linear-gradient(
        45deg,
       #f8f5f5,
        #f8f5f5 5px,
        #d0e8dc 5px,
        #d0e8dc 10px
    );
    transform: rotate(45deg);
    opacity: 0.8;
    z-index: 1;
}

/* 左下角花纹胶带 */
.polaroid::after {
    content: "";
    position: absolute;
    bottom: -8px;
    left: -10px;
    width: 50px;
    height: 25px;
    background: repeating-linear-gradient(
        -45deg,
        #f8f5f5,
        #f8f5f5 5px,
        #d0e8dc 5px,
        #d0e8dc 10px
    );
    transform: rotate(45deg);
    opacity: 0.8;
    z-index: 1;
}
/* 如果 polaroid 紧接 p 出现，取消 polaroid 的上间距 */



/* 表格基础样式 */
table {
  width: 90%;
  margin: 20px auto;
  border-collapse: collapse;
}

/* 表头样式 */
thead {
  background:#e0f0e8;
  color: #555;
}

/* 单元格通用样式 */
th, td {
  padding: 10px;
  border: 1px solid #f0e0e0;
  transition: all 0.3s ease;
}

/* 表头单元格特殊样式 */
th {
  font-weight: 600;
  letter-spacing: 0.5px;
}

/* 表格行悬停效果 */
tbody tr:hover {
  background-color: #f9f5f5;
}

/* 斑马条纹效果 */
tbody tr:nth-child(even) {
  background-color: #fcfafa;
}

/* 响应式调整 */
@media (max-width: 768px) {
  table {
    width: 100%;
  }
}

.postnav {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5em;
  font-size: 0.9em;
  width: 100%;
  margin-bottom: 1em;
  padding-top: 1em;
  border-top: 1px dashed #d0e8dc;
  transition: border-color 0.3s ease;
  }

.postnav .prev, .postnav .next {
    display: inline-flex;
    align-items: center;
}

.next_post a::after
{
  content:" ↪";
   margin-left: 0.5em; 
}

.prev_post a::before
{
  content:"↩ ";
   margin-right: 0.5em; 
}

.post-tags li{
  display: inline-block;
}

.post-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 10px;
    font-size:0.9rem
}

.article-list li{
	 list-style:none;
	padding:0.3rem 0;
  line-height: 220%;
		}

.article-list li + li {
    border-top: 1px dashed #c7c7c7;
}

li + li {
  border-top: 1px dashed #c7c7c7;
  list-style:none;
}

li{	
  padding:0.3rem 0;
  line-height: 220%;
}

ul {
    margin: 0px;
    padding-left: 0px;
}

.archive-year-header {
  border-bottom: 2px solid #d0e8dc;
  margin-bottom: 5px;
    margin-top: 15px;
    font-size: 120%;
    color: #444;
    text-align: left;
    font-weight: bold;
    text-indent: 0;
		}

.archive-year-header::before {
	content:""
		}

.article-list .post-date {
    float: right;
    margin-left: auto;
    font-size: 90%;
    color: #777;
}

/* more-link */
.readmore {
	clear: both;
	color:#52b788;
	background-size:15px 16px;
	margin-top: 10px;
	font-size:95%;
	}
.readmore:visited{
	color:#52b788;
	text-decoration: none;
}
.readmore:hover {
	text-decoration: none;
	clear: both;
	color:#3a9d72;
	background-size:15px 16px;
}
.readmore:active{
	text-decoration: none;
	clear: both;
	color:#3a9d72;
	background-size:15px 16px;
}

u {
    text-decoration-line: underline;
    text-decoration-style: wavy;
    text-decoration-color: var(--hovercolor);
}
white {
    color: #ffffff;
    opacity: 0;
    transition: opacity 0.8s ease;
}

white:hover {
    background-color: #657362;
    opacity: 1;
}
small {
    font-size: 0.9rem;
    color: #657362;
}

point{
text-emphasis: dot;
text-emphasis-position: under;
-webkit-text-emphasis: dot;
-webkit-text-emphasis-position: under;
}

.note{
  width: auto;
  background-color: #f5faf7;
  box-shadow: -5px 6px 0px #c8e0d0;
  padding: 0px 15px 10px 35px; /* 左侧留更多空间给大圆点（原 30px → 40px） */
  border-radius: 5px;
  position: relative;
  line-height: 35px; /* 横线间距基准 */
  transition: all 0.3s ease;
  display:inline-block;
  vertical-align: top;
  margin-bottom: 1.2em; /* 控制与 h3 之间的垂直距离 */
}

.note p{
  margin:0;
}

.note + p {
  margin-top: 0;  
}

.note:hover{
  transform: translateY(-3px);
  box-shadow: -7px 8px 0px #b0d8c4;
}

.note::before {
  content: "";
  position: absolute;
  left: 30px; 
  right: 10px;
  height: 100%;
  background: repeating-linear-gradient(
    to bottom,
    transparent,
    transparent 34px,
    #d0e8dc 34px,
    #d0e8dc 35px
  );
  pointer-events: none;
}
.note::after {
  content: "";
  position: absolute;
  left: 10px; /* 圆点离左边缘更远（原 12px → 15px） */
  top: 1px;
  bottom: 10px;
  width: 10px; /* 圆点列更宽（原 8px → 10px） */
  background: 
    radial-gradient(circle, white 5px, transparent 5.5px) /* 圆点变大（原 3px → 4px） */
    0 0 / 100% 35px; /* 间距与 line-height 同步（原 18px → 35px） */
  background-repeat: repeat-y;
  filter: drop-shadow(-1px 1px 0px #c8e0d0);
}
.category-item {
  display: inline-block;
  padding: 0.3rem 0.8rem;
  background: #f0f0f0;
  border-radius: 1rem;
  margin: 0.2rem;
  font-size:0.9rem;
}
/* links */
.container {
  display: flex;
  gap: 50px;
  line-height: 1.8;
}

.column {
  flex: 1;
  display:block;
}
.column p {
    margin: 0;
}
.column a {
  display: block;
  text-decoration: none;
  padding: 6px 0px;
  transition: all 0.25s ease;
  position: relative;
  overflow: hidden;
}
.column a::before {
  content: "* ";
  font-weight:bold;
  color: #52b788;
}
.column a::after {
     content: "";
    display: block;
    border-bottom: 1px dashed #ccc;
    width: calc(100% - 1em);
    margin-top: 10px;
    margin-left: 1.2em;
    height: auto;
    background: none;
    mask: none;

}
.shuoshuo {
  font-size: 14px;
  padding: 2px 15px 2px 15px;
  background: #e8f4ee;
  border-radius: 10px;
  width: auto;
  max-width: 400px;
  box-sizing: border-box;
  max-height: 170px;
  overflow-y: auto;
  box-shadow: 5px 6px 0px #c0daca;
  position: relative;
  /* 调整滚动条位置 */
  padding-right: 10px; /* 减少右侧padding */
  margin-right: 5px; /* 添加负边距补偿 */
  margin-bottom: 10px;
}


.shuoshuo-container {
  display: flex;
  align-items: center;
  gap: 10px; /* 框和文字的间距 */
}

.shuoshuo-label {
  color: #888;
  font-size: 0.9rem;
  white-space: nowrap;
  text-align: center;
}

/* 自定义滚动条样式 */
.shuoshuo::-webkit-scrollbar {
  width: 8px;
}

.shuoshuo::-webkit-scrollbar-track {
  background: transparent;
  margin-top: 5px;
  margin-bottom: 5px;
}

.shuoshuo::-webkit-scrollbar-thumb {
  background: #888888;
  border-radius: 4px;
}

.shuoshuo::-webkit-scrollbar-thumb:hover {
  background: #657362;
}

p.statuscafe-username {
  border-bottom: 1px solid #d9caca;
  color: #52b788;
  font-size: 0.9em;
  margin-bottom: 6px;
  margin-top: 6px;
  padding-bottom:2px;
}

p.statuscafe-content {
  margin-bottom: 10px;
  margin-top: 2px;
  font-size: 0.9rem;
}
times {
  color: #52b788;
  font-size: 0.9em;
  display:block;
}
@media screen and (max-width: 480px)
{  
.container {
    flex-direction: column;
     gap: 0;
  }

  main{
	width: auto;
	padding-left:20px;
padding-right:20px
}

    h1 {
             margin-top: 0.5em;
    }
.toc {
        display: none;
    }
.shuoshuo-container {
    display: block;
}

 .polaroid {
        display: block; /* 改为block使margin:auto生效 */
        width: fit-content; /* 宽度适应内容 */
       margin:30px auto;
       max-width: 100%;
       
      }
    
}
@media screen and (min-width:481px) and (max-width:768px)
{	
main{
	width: auto;
	padding-left:30px;
padding-right:30px
}

.toc {
        display: none;
    }
h1 {
      margin-top: 0.5em;}

}
@media screen and (min-width:769px) and (max-width:1024px)
{

main{
	width: auto;
}


.toc {
        display: none;
    }

	}

@media (orientation: landscape) {
  body {
    font-size: 15px !important;
    -webkit-text-size-adjust: 100% !important;
  }
}

/* lightbox */
body.lb-disable-scrolling {
  overflow: hidden;
}

.lightboxOverlay {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  background-color: black;
  opacity: 0.8;
  display: none;
}

.lightbox {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 10000;
  text-align: center;
  line-height: 0;
  font-weight: normal;
  outline: none;
}

.lightbox .lb-image {
  display: block;
  height: auto;
  max-width: inherit;
  max-height: none;
  border-radius: 3px;

  /* Image border */
  border: 4px solid white;
  padding:0;

}

.lightbox a img {
  border: none;
}

.lb-outerContainer {
  position: relative;
  width: 250px;
  height: 250px;
  margin: 0 auto;
  border-radius: 4px;

  /* Background color behind image.
     This is visible during transitions. */
  background-color: white;
}

.lb-outerContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-loader {
  position: absolute;
  top: 43%;
  left: 0;
  height: 25%;
  width: 100%;
  text-align: center;
  line-height: 0;
}

.lb-cancel {
  display: block;
  width: 32px;
  height: 32px;
  margin: 0 auto;
  background: url(https://img.juroku.net/images/loading.gif) no-repeat;
}

.lb-nav {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

.lb-container > .nav {
  left: 0;
}

.lb-nav a {
  outline: none;
  background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev, .lb-next {
  height: 100%;
  cursor: pointer;
  display: block;
}

.lb-nav a.lb-prev {
  width: 34%;
  left: 0;
  float: left;
  background: url(https://img.juroku.net/images/prev.png) left 48% no-repeat;
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover {
  opacity: 1;
}

.lb-nav a.lb-next {
  width: 64%;
  right: 0;
  float: right;
  background: url(https://img.juroku.net/images/next.png) right 48% no-repeat;
  opacity: 0;
  -webkit-transition: opacity 0.6s;
  -moz-transition: opacity 0.6s;
  -o-transition: opacity 0.6s;
  transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover {
  opacity: 1;
}

.lb-dataContainer {
  margin: 0 auto;
  padding-top: 5px;
  width: 100%;
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lb-dataContainer:after {
  content: "";
  display: table;
  clear: both;
}

.lb-data {
  padding: 0 4px;
  color: #ccc;
}

.lb-data .lb-details {
  width: 85%;
  float: left;
  text-align: left;
  line-height: 1.1em;
}

.lb-data .lb-caption {
  font-size: 13px;
  font-weight: bold;
  line-height: 1em;
}

.lb-data .lb-caption a {
  color: #4ae;
}

.lb-data .lb-number {
  display: block;
  clear: left;
  padding-bottom: 1em;
  font-size: 12px;
  color: #999999;
}

.lb-data .lb-close {
  display: block;
  float: right;
  width: 30px;
  height: 30px;
  background: url(https://img.juroku.net/images/close.png) top right no-repeat;
  text-align: right;
  outline: none;
  opacity: 0.7;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.lb-data .lb-close:hover {
  cursor: pointer;
  opacity: 1;
}


/*!
 * Twikoo v1.6.44
 * (c) 2020-2025 iMaeGoo
 * Released under the MIT License.
 * Last Update: 5/23/2025, 1:58:10 AM
 */

#twikoo *{
  font-size: 13px;
   font-family: 'Roboto Mono', "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", monospace, sans-serif;
}
#twikoo .tk-comments .tk-comment p {
    font-size: 1rem;
}
.tk-avatar {
  flex-shrink: 0;
  height: 2.5rem;
  width: 2.5rem;
  overflow: hidden;
  text-align: center;
  border-radius: 50%;
  margin-right: 1rem;
}
.tk-comment .tk-submit .tk-avatar,
.tk-replies .tk-avatar {
  height: 2.5rem;
  width: 2.5rem;
}
.tk-avatar.tk-has-avatar {
  background-color:#fff;
}
.tk-avatar.tk-clickable {
  cursor: pointer;
}
.tk-avatar .tk-avatar-img {
  height: 2.5rem;
  color: #c0c4cc;
  border-radius: 50%;
  padding:2px;
}
.tk-comment .tk-submit .tk-avatar .tk-avatar-img,
.tk-replies .tk-avatar .tk-avatar-img {
  height: 2.5rem;
}


.tk-meta {
    font-size: 0.9rem;
}
.tk-meta-input {
  display: flex;
}
.tk-meta-input .el-input {
  width: auto;
  width: calc((100% - 1rem) / 3); /* Fix Safari */
  flex: 1;
}
.tk-meta-input .el-input + .el-input {
  margin-left: 0.5rem;
}
.tk-meta-input .el-input .el-input-group__prepend {
  padding: 0 0.6rem;
}
.tk-meta-input .el-input input:invalid {
  border: 1px solid #f56c6c;
  box-shadow: none;
}
@media screen and (max-width: 767px) {
.tk-meta-input {
    flex-direction: column;
}
.tk-meta-input .el-input {
    width: auto;
}
.tk-meta-input .el-input + .el-input {
    margin-left: 0;
    margin-top: 0.5rem;
}
}


.tk-submit {
  display: flex;
  flex-direction: column;
}
.tk-row {
  display: flex;
  flex-direction: row;
}
.tk-col {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.tk-meta-input {
  margin-bottom: 0.5rem;
}
.tk-row.actions {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 1rem;
  align-items: center;
  justify-content: flex-end;
}
.tk-row-actions-start {
  flex: 1;
  display: flex;
  align-items: center;
}
.tk-submit-action-icon {
  align-self: center;
  display: inline-block;
  width: 1.25em;
  line-height: 0;
  margin-right: 10px;
  cursor: pointer;
  flex-shrink: 0;
}
.tk-submit-action-icon svg:hover {
  opacity: 0.8;
}
.tk-submit-action-icon.__markdown {
  color: #909399;
}
.tk-error-message {
  word-break: break-all;
  color: #ff0000;
  font-size: 0.75em;
  flex-shrink: 1;
}
.tk-input-image {
  display: none;
}
.tk-input {
  flex: 1;
}
.tk-input .el-textarea__inner {
  background-position: right bottom;
  background-repeat: no-repeat;
}
.tk-turnstile-container {
  position: absolute;
  right: 0;
  bottom: -75px;
  z-index: 1;
}
.tk-turnstile {
  display: flex;
  flex-direction: column;
}
.tk-preview-container {
  margin-left: 3rem;
  margin-bottom: 1rem;
  padding: 5px 15px;
  border: 1px solid rgba(128,128,128,0.31);
  border-radius: 4px;
  word-break: break-word;
}
.tk-fade-in {
  animation: tkFadeIn .3s;
}
@keyframes tkFadeIn {
0% {
    opacity: 0
}
to {
    opacity: 1
}
}


.tk-action {
  display: flex;
  align-items: center;
}
.tk-action-link {
  margin-left: 0.5rem;
  color: #a8d8be;
  text-decoration: none;
  display: flex;
  align-items: center;
}
.tk-action-link .tk-action-icon-solid {
  display: none;
}
.tk-action-link.tk-liked .tk-action-icon,
.tk-action-link:hover .tk-action-icon {
  display: none;
}
.tk-action-link.tk-liked .tk-action-icon-solid,
.tk-action-link:hover .tk-action-icon-solid {
  display: block;
}
.tk-action-count {
  margin-left: 0.25rem;
  font-size: 0.75rem;
  height: 1.5rem;
  line-height: 1.5rem;
}
.tk-action-icon {
  display: inline-block;
  height: 1em;
  width: 1em;
  line-height: 0;
  color: #a8d8be;
}


.tk-main {
  flex: 1;
  width: 0;
}
.tk-row {
  flex: 1;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.tk-nick {
    color: #657362;
}
.tk-nick-link {
  color: inherit;
  text-decoration: none;
}
.tk-replies .tk-nick-link {
  font-size: 1em;
}
.tk-nick-link:hover {
  color: #a8d8be;
}
.tk-actions {
  display: none;
  margin-left: 1em;
}
.tk-comment:hover .tk-actions {
  display: inline;
}
.tk-extras {
  color: #999999;
  font-size: 0.875em;
  display: flex;
  flex-wrap: wrap;
}
.tk-extra {
  margin-top: 0.5rem;
  margin-right: 0.75rem;
  display: flex;
  align-items: center;
}
.tk-icon.__comment {
  height: 1em;
  width: 1em;
  line-height: 1;
}
.tk-extra-text {
  line-height: 1;
}
.tk-tag {
  display: inline-block;
 /* padding: 0 0.5em;*/
  font-size: 0.9em;
 /*  background-color: #efe0e0;*/
}
.tk-tag-green {
 /*  background-color: #efe0e0;*/
    border-radius: 5px;
    color: #635c5c;
}
.tk-tag-yellow {
  background-color: rgba(230,162,60,0.13);
  border: 1px solid rgba(230,162,60,0.50);
  border-radius: 2px;
  color: #e6a23c;
}
.tk-tag-blue {
  background-color: rgba(64,158,255,0.13);
  border: 1px solid rgba(64,158,255,0.50);
  border-radius: 2px;
  color: #ee99bd;
}
.tk-tag-red {
  background-color: rgba(245,108,108,0.13);
  border: 1px solid rgba(245,108,108,0.50);
  border-radius: 2px;
  color: #f56c6c;
}
.tk-comment {
  margin-top: 1rem;
  display: flex;
  flex-direction: row;
  word-break: break-all;
}
.tk-content {
  overflow: hidden;
  max-height: 500px;
  position: relative;
  border-bottom: 1px dashed #efe0e0;
}
.tk-content-expand {
  max-height: none;
}
.tk-content.tk-content-expand p {
    margin: 2px 0 10px 0px;
}
.tk-replies .tk-content {
  font-size: 1em;
}
.tk-comment .vemoji {
  max-height: 2em;
  vertical-align: middle;
}
.tk-replies {
  max-height: 200px;
  overflow: hidden; 
  position: relative;
}
.tk-replies-expand {
  max-height: none;
  overflow: unset;
}
.tk-submit {
  margin-top: 1rem;
}
.tk-expand {
  font-size: 0.75em;
}
.tk-lightbox {
  display: block;
  position: fixed;
  background-color: rgba(0, 0, 0, 0.3);
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
}
.tk-lightbox-image {
  min-width: 100px;
  min-height: 30px;
  width: auto;
  height: auto;
  max-width: 95%;
  max-height: 95%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: linear-gradient(90deg, #eeeeee 50%, #e3e3e3 0);
  background-size: 40px 100%;
}


.tk-comments-title {
  font-size: 1rem;
  font-weight: bold;
  margin-bottom: 1rem;
  display: flex;
  align-items: baseline;
  justify-content: space-between;
}
.tk-comments-count.__hidden {
  visibility: hidden;
}
.tk-comments-container {
  min-height: 10rem;
  display: flex;
  flex-direction: column;
}
.tk-comments-no {
  flex: 1;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tk-comments-error {
  font-size: 0.75em;
  color: #ff0000;
}
.tk-icon.__comments {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: sub;
  margin-left: 0.5em;
  height: 0.75em;
  width: 0.75em;
  line-height: 0;
  cursor: pointer;
  color: #a8d8be;;
}
.twikoo div.code-toolbar {
  position: relative;
  border-radius: .3em
}
.twikoo div.code-toolbar>.toolbar {
  position: absolute;
  right: 4px;
  top: 4px;
  font-size: .8125rem;
  font-weight: 500;
  display: flex;
}
.twikoo div.code-toolbar>.toolbar>.toolbar-item {
  margin-left: .3em
}
.twikoo div.code-toolbar>.toolbar>.toolbar-item>a,
.twikoo div.code-toolbar>.toolbar>.toolbar-item>button,
.twikoo div.code-toolbar>.toolbar>.toolbar-item>span {
  padding: 2px 4px;
  border-radius: .3em;
}
.twikoo div.code-toolbar>.toolbar>.toolbar-item>button {
  border: 1px solid rgba(128, 128, 128, 0.31);
}
.twikoo div.code-toolbar>.toolbar>.toolbar-item>button:hover {
  cursor: pointer;
}


.tk-footer {
  width: 100%;
  text-align: end;
  font-size: 0.75em;
  color: #999999;
  margin-top: 1em;
}


.tk-pagination,
.tk-pagination-pagers {
  display: flex;
}
.tk-pagination {
  width: 100%;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
}
.tk-pagination-options {
  display: flex;
  align-items: center;
}
.tk-pagination-pager {
  width: 2em;
  height: 2em;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.tk-pagination-pager.__current {
  background-color: #a8d8be;
  pointer-events: none;
}
.tk-pagination .el-input {
  width: 50px;
}
.tk-pagination .el-input .el-input__inner {
  padding: 0;
  height: 28px;
  text-align: center;
  -moz-appearance: textfield;
  appearance: textfield;
}
.tk-pagination .el-input .el-input__inner::-webkit-inner-spin-button,
.tk-pagination .el-input .el-input__inner::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
  margin: 0;
}


.tk-admin-comment {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.tk-admin-comment a {
  color: currentColor;
  text-decoration: underline;
}
.tk-admin-warn {
  margin-bottom: 1em;
}
.tk-admin-comment-filter {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.tk-admin-comment-filter-keyword {
  flex: 1;
}
.tk-admin-comment-filter-type {
  height: 32px;
  margin: 0 0.5em;
  padding: 0 0.5em;
  color: #ffffff;
  background: none;
  border: 1px solid rgba(144,147,153,0.31);
  border-radius: 4px;
  position: relative;
  -moz-appearance: none;
  -webkit-appearance: none;
}
.tk-admin-comment-filter-type:focus {
  border-color: #a8d8be;
}
.tk-admin-comment-filter-type option {
  color: initial;
}
.tk-admin-comment-list {
  margin-top: 1em;
}
.tk-admin-comment-list,
.tk-admin-comment-item {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
}
.tk-admin-comment-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  margin-bottom: 0.5em;
}
.tk-admin-comment .tk-avatar {
  margin-right: 0.5em;
}
.tk-admin-comment .tk-content {
  max-height: none;
}
.tk-admin-actions {
  display: flex;
  margin-bottom: 1em;
  border-bottom: 1px solid rgba(255,255,255,0.5);
}


.tk-admin-config-groups {
  overflow-y: auto;
  padding-right: 0.5em;
}
.tk-admin-config-groups .tk-admin-config-group,
.tk-admin-config-groups .tk-admin-config-group-title {
  background: transparent;
}
.tk-admin-config-group-title {
  margin-top: 1em;
  font-size: 1.25rem;
  font-weight: bold;
}
.tk-admin-config-item {
  display: grid;
  align-items: center;
  grid-template-columns: 30% 70%;
  margin-top: 1em;
}
.tk-admin-config-title {
  text-align: right;
  margin-right: 1em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tk-admin-config-desc {
  margin-top: 0.5em;
  font-size: 0.75em;
  overflow-wrap: break-word;
}
.tk-admin-config-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1em;
}
.tk-admin-config-message {
  margin-top: 0.5em;
  text-align: center;
}
.tk-admin-config-email-test-desc {
  margin: 1em 0;
}


.tk-admin-import {
  display: flex;
  flex-direction: column;
}
.tk-admin-import-label {
  margin-top: 1em;
  font-size: 1.25rem;
  font-weight: bold;
}
.tk-admin-import select,
.tk-admin-import input,
.tk-admin-import .el-button,
.tk-admin-import .el-textarea {
  margin-top: 1em;
}


.tk-admin-container {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}
.tk-admin {
  position: absolute;
  top: 0;
  left: 100%;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  pointer-events: all;
  color: #ffffff;
  background-color: rgba(0,0,0,0.60);
  backdrop-filter: blur(5px);
  transition: all 0.5s ease;
  visibility: hidden;
}
.tk-admin::-webkit-scrollbar {
  width: 5px;
  background-color: transparent;
}
.tk-admin::-webkit-scrollbar-track {
  background-color: transparent;
}
.tk-admin::-webkit-scrollbar-thumb {
  background-color: rgba(255,255,255,0.31);
}
.tk-admin.__show {
  left: 0;
  visibility: visible;
}
.tk-admin-close {
  position: sticky;
  float: right;
  display: block;
  top: 0;
  right: 0;
  width: 1rem;
  height: 1rem;
  padding: 1rem;
  box-sizing: content-box;
  color: #ffffff;
}
.tk-login,
.tk-regist {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding: 0 2rem;
}
.tk-login-title {
  color: #ffffff;
  font-size: 1.25rem;
  text-align: center;
  margin-top: 10rem;
}
.tk-password,
.tk-login-msg {
  color: #ffffff;
  width: 80%;
  text-align: center;
  margin-top: 1rem;
}
.tk-password .el-input__inner {
  min-width: 100px;
}
.tk-login-msg a {
  color: #ffffff;
  margin-left: 1em;
  text-decoration: underline;
}
.tk-regist-button {
  margin-top: 1rem;
}
.tk-panel {
  color: #ffffff;
  padding: 2rem;
}
.tk-panel-title {
  font-size: 1.5rem;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}
.tk-panel-logout {
  color: #ffffff;
  font-size: 1rem;
  text-decoration: underline;
}
.tk-panel .tk-tabs {
  display: flex;
  margin-bottom: 1em;
  border-bottom: 2px solid #c0c4cc;
}
.tk-panel .tk-tab {
  color: #c0c4cc;
  cursor: pointer;
  line-height: 2em;
  margin-right: 2em;
  margin-bottom: -2px;
}
.tk-panel .tk-tab.__active {
  color: #ffffff;
  border-bottom: 2px solid #ffffff;
}


.twikoo {
  position: relative;
}
.twikoo svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
}

/* 全局 CSS */
.tk-expand {
   cursor: pointer;
  padding: 0.75em;
  text-align: center;
  transition: all 0.5s;
}
.tk-expand:hover {
  background-color: #efe0e0;
}
.tk-expand:active {
  background-color: #efe0e0;
}
.tk-content img {
  max-width: 300px;
  max-height: 300px;
  vertical-align: middle;
}
.tk-owo-emotion,
.twikoo .OwO-item img {
  width: 3em;
  height: auto;
}

/* element-ui overwrite */
.twikoo .el-input__inner,
.twikoo .el-textarea__inner {
  color: currentColor;
  background-color: transparent;
  border-color: rgba(144,147,153,0.31);
}
.twikoo .el-input__inner:hover,
.twikoo .el-textarea__inner:hover {
  border-color: rgba(144,147,153,0.50);
}
.twikoo .el-input__inner:focus,
.twikoo .el-textarea__inner:focus {
  border-color: #a8d8be;
}
.twikoo .el-input-group__append,
.twikoo .el-input-group__prepend {
  color: currentColor;
  background-clip: padding-box;
  background-color: rgba(144,147,153,0.13);
  border-color: rgba(144,147,153,0.31);
}
.twikoo .el-button:not(.el-button--primary):not(.el-button--text) {
  color: currentColor;
  background-color: rgba(144,147,153,0.063);
  border-color: rgba(144,147,153,0.31);
}
.twikoo .el-button:not(.el-button--primary):not(.el-button--text):active,
.twikoo .el-button:not(.el-button--primary):not(.el-button--text):focus,
.twikoo .el-button:not(.el-button--primary):not(.el-button--text):hover {
  color: #a8d8be;
  background-color: rgb(255, 255, 255);
  border-color: rgba(187, 125, 151, 0.788);
}
.twikoo .el-button--primary.is-disabled,
.twikoo .el-button--primary.is-disabled:active,
.twikoo .el-button--primary.is-disabled:focus,
.twikoo .el-button--primary.is-disabled:hover {
  color: rgba(255,255,255,0.63);
  background-color: rgba(187, 125, 151, 0.788);
  border-color: transparent;
}
.twikoo .el-loading-mask {
  background-color: transparent;
  backdrop-filter: opacity(20%);
}
.twikoo .el-textarea .el-input__count {
  color: currentColor;
  background: transparent;
}
.tk-admin-warn {
  padding: 1rem 1.5rem;
  background-color: #fff7d0;
  border-left: 0.5rem solid #e7c000;
  color: #6b5900;
  align-self: stretch;
}

.el-button{
  display:inline-block;
  line-height:1;
  white-space:nowrap;
  cursor:pointer;
  background:#FFF;
  border:1px solid #DCDFE6;
  color:#606266;
  -webkit-appearance:none;
  text-align:center;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
  outline:0;
  margin:0;
  -webkit-transition:.1s;
  transition:.1s;
  font-weight:500;
  -moz-user-select:none;
  -webkit-user-select:none;
  -ms-user-select:none;
  padding:12px 20px;
  font-size:14px;
  border-radius:4px
}
  
.el-button+.el-button{
  margin-left:10px
}

.el-button:focus,.el-button:hover{
  color:#52b788;
  border-color:#b0d8c4;
  background-color:#d0ede0
}

.el-button:active{
  color:#52b788;
  border-color:#b0d8c4;
  outline:0
}

.el-button::-moz-focus-inner{
  border:0
}

.el-button [class*=el-icon-]+span{
    margin-left:5px
}

.el-button.is-plain:focus,.el-button.is-plain:hover{
  background:#FFF;
  border-color:#3a9d72;
  color:#3a9d72
}

.el-button.is-active,.el-button.is-plain:active{
  color:#3a9d72;
  border-color:#3a9d72
}

.el-button.is-plain:active{
  background:#FFF;
  outline:0
}

.el-button.is-disabled,.el-button.is-disabled:focus,.el-button.is-disabled:hover{
  color:#C0C4CC;
  cursor:not-allowed;
  background-image:none;
  background-color:#FFF;
  border-color:#EBEEF5
}

.el-button.is-disabled.el-button--text{
  background-color:transparent
}
.el-button.is-disabled.is-plain,.el-button.is-disabled.is-plain:focus,.el-button.is-disabled.is-plain:hover{
  background-color:#FFF;
  border-color:#EBEEF5;
  color:#C0C4CC

}

.el-button.is-loading{
  position:relative;
  pointer-events:none
}
.el-button.is-loading:before{
  pointer-events:none;
  content:'';
  position:absolute;
  left:-1px;
  top:-1px;
  right:-1px;
  bottom:-1px;
  border-radius:inherit;
  background-color:rgba(255,255,255,.35)
}

.el-button.is-round{
  border-radius:20px;
  padding:12px 23px
}

.el-button.is-circle{
  border-radius:50%;
  padding:12px
}

.el-button--primary{
  color:#FFF;
  background-color:#52b788;
  border-color:#52b788
}

.el-button--primary:focus,.el-button--primary:hover{
  background:#a8d8be;
  border-color:#a8d8be;
  color:#FFF
}

.el-button--primary:active{
  background:#a8d8be;
  border-color:#a8d8be;
  color:#FFF;
  outline:0
}

.el-button--primary.is-active{
  background:#3a9d72;
  border-color:#3a9d72;
  color:#FFF
}

.el-button--primary.is-disabled,.el-button--primary.is-disabled:active,.el-button--primary.is-disabled:focus,.el-button--primary.is-disabled:hover{
  color:#FFF;
  background-color:#a8d8be;
  border-color:#a8d8be
}

.el-button--primary.is-plain{
  color:#52b788;
  background:#ecf5ff;
  border-color:#a8d8be
}

.el-button--primary.is-plain:focus,.el-button--primary.is-plain:hover{
  background:#52b788;
  border-color:#52b788;
  color:#FFF
}

.el-button--primary.is-plain:active{
  background:#3a9d72;
  border-color:#3a9d72;
  color:#FFF;
  outline:0
}

.el-button--primary.is-plain.is-disabled,.el-button--primary.is-plain.is-disabled:active,.el-button--primary.is-plain.is-disabled:focus,.el-button--primary.is-plain.is-disabled:hover{color:#a8d8be;background-color:#ecf5ff;border-color:#e7d8de}.el-button--success{color:#FFF;background-color:#67C23A;border-color:#67C23A}.el-button--success:focus,.el-button--success:hover{background:#85ce61;border-color:#85ce61;color:#FFF}.el-button--success.is-active,.el-button--success:active{background:#5daf34;border-color:#5daf34;color:#FFF}.el-button--success:active{outline:0}.el-button--success.is-disabled,.el-button--success.is-disabled:active,.el-button--success.is-disabled:focus,.el-button--success.is-disabled:hover{color:#FFF;background-color:#b3e19d;border-color:#b3e19d}.el-button--success.is-plain{color:#67C23A;background:#f0f9eb;border-color:#c2e7b0}.el-button--success.is-plain:focus,.el-button--success.is-plain:hover{background:#67C23A;border-color:#67C23A;color:#FFF}.el-button--success.is-plain:active{background:#5daf34;border-color:#5daf34;color:#FFF;outline:0}.el-button--success.is-plain.is-disabled,.el-button--success.is-plain.is-disabled:active,.el-button--success.is-plain.is-disabled:focus,.el-button--success.is-plain.is-disabled:hover{color:#a4da89;background-color:#f0f9eb;border-color:#e1f3d8}.el-button--warning{color:#FFF;background-color:#E6A23C;border-color:#E6A23C}.el-button--warning:focus,.el-button--warning:hover{background:#ebb563;border-color:#ebb563;color:#FFF}.el-button--warning.is-active,.el-button--warning:active{background:#cf9236;border-color:#cf9236;color:#FFF}.el-button--warning:active{outline:0}.el-button--warning.is-disabled,.el-button--warning.is-disabled:active,.el-button--warning.is-disabled:focus,.el-button--warning.is-disabled:hover{color:#FFF;background-color:#f3d19e;border-color:#f3d19e}.el-button--warning.is-plain{color:#E6A23C;background:#fdf6ec;border-color:#f5dab1}.el-button--warning.is-plain:focus,.el-button--warning.is-plain:hover{background:#E6A23C;border-color:#E6A23C;color:#FFF}.el-button--warning.is-plain:active{background:#cf9236;border-color:#cf9236;color:#FFF;outline:0}.el-button--warning.is-plain.is-disabled,.el-button--warning.is-plain.is-disabled:active,.el-button--warning.is-plain.is-disabled:focus,.el-button--warning.is-plain.is-disabled:hover{color:#f0c78a;background-color:#fdf6ec;border-color:#faecd8}.el-button--danger{color:#FFF;background-color:#F56C6C;border-color:#F56C6C}.el-button--danger:focus,.el-button--danger:hover{background:#f78989;border-color:#f78989;color:#FFF}.el-button--danger.is-active,.el-button--danger:active{background:#dd6161;border-color:#dd6161;color:#FFF}.el-button--danger:active{outline:0}.el-button--danger.is-disabled,.el-button--danger.is-disabled:active,.el-button--danger.is-disabled:focus,.el-button--danger.is-disabled:hover{color:#FFF;background-color:#fab6b6;border-color:#fab6b6}.el-button--danger.is-plain{color:#F56C6C;background:#fef0f0;border-color:#fbc4c4}.el-button--danger.is-plain:focus,.el-button--danger.is-plain:hover{background:#F56C6C;border-color:#F56C6C;color:#FFF}.el-button--danger.is-plain:active{background:#dd6161;border-color:#dd6161;color:#FFF;outline:0}.el-button--danger.is-plain.is-disabled,.el-button--danger.is-plain.is-disabled:active,.el-button--danger.is-plain.is-disabled:focus,.el-button--danger.is-plain.is-disabled:hover{color:#f9a7a7;background-color:#fef0f0;border-color:#fde2e2}.el-button--info{color:#FFF;background-color:#909399;border-color:#909399}.el-button--info:focus,.el-button--info:hover{background:#a6a9ad;border-color:#a6a9ad;color:#FFF}.el-button--info.is-active,.el-button--info:active{background:#82848a;border-color:#82848a;color:#FFF}.el-button--info:active{outline:0}.el-button--info.is-disabled,.el-button--info.is-disabled:active,.el-button--info.is-disabled:focus,.el-button--info.is-disabled:hover{color:#FFF;background-color:#c8c9cc;border-color:#c8c9cc}.el-button--info.is-plain{color:#909399;background:#f4f4f5;border-color:#d3d4d6}.el-button--info.is-plain:focus,.el-button--info.is-plain:hover{background:#909399;border-color:#909399;color:#FFF}.el-button--info.is-plain:active{background:#82848a;border-color:#82848a;color:#FFF;outline:0}.el-button--info.is-plain.is-disabled,.el-button--info.is-plain.is-disabled:active,.el-button--info.is-plain.is-disabled:focus,.el-button--info.is-plain.is-disabled:hover{color:#bcbec2;background-color:#f4f4f5;border-color:#e9e9eb}.el-button--medium{padding:10px 20px;font-size:14px;border-radius:4px}.el-button--mini,.el-button--small{font-size:12px;border-radius:3px}.el-button--medium.is-round{padding:10px 20px}.el-button--medium.is-circle{padding:10px}.el-button--small,.el-button--small.is-round{padding:9px 15px}.el-button--small.is-circle{padding:9px}.el-button--mini,.el-button--mini.is-round{padding:7px 15px}.el-button--mini.is-circle{padding:7px}.el-button--text{border-color:transparent;color:#52b788;background:0 0;padding-left:0;padding-right:0}.el-button--text:focus,.el-button--text:hover{color:#66b1ff;border-color:transparent;background-color:transparent}.el-button--text:active{color:#3a9d72;border-color:transparent;background-color:transparent}.el-button--text.is-disabled,.el-button--text.is-disabled:focus,.el-button--text.is-disabled:hover{border-color:transparent}.el-button-group .el-button--danger:last-child,.el-button-group .el-button--danger:not(:first-child):not(:last-child),.el-button-group .el-button--info:last-child,.el-button-group .el-button--info:not(:first-child):not(:last-child),.el-button-group .el-button--primary:last-child,.el-button-group .el-button--primary:not(:first-child):not(:last-child),.el-button-group .el-button--success:last-child,.el-button-group .el-button--success:not(:first-child):not(:last-child),.el-button-group .el-button--warning:last-child,.el-button-group .el-button--warning:not(:first-child):not(:last-child),.el-button-group>.el-dropdown>.el-button{border-left-color:rgba(255,255,255,.5)}.el-button-group .el-button--danger:first-child,.el-button-group .el-button--danger:not(:first-child):not(:last-child),.el-button-group .el-button--info:first-child,.el-button-group .el-button--info:not(:first-child):not(:last-child),.el-button-group .el-button--primary:first-child,.el-button-group .el-button--primary:not(:first-child):not(:last-child),.el-button-group .el-button--success:first-child,.el-button-group .el-button--success:not(:first-child):not(:last-child),.el-button-group .el-button--warning:first-child,.el-button-group .el-button--warning:not(:first-child):not(:last-child){border-right-color:rgba(255,255,255,.5)}.el-button-group{display:inline-block;vertical-align:middle}.el-button-group::after,.el-button-group::before{display:table;content:""}.el-button-group::after{clear:both}.el-button-group>.el-button{float:left;position:relative}.el-button-group>.el-button+.el-button{margin-left:0}.el-button-group>.el-button.is-disabled{z-index:1}.el-button-group>.el-button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.el-button-group>.el-button:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.el-button-group>.el-button:first-child:last-child{border-radius:4px}.el-button-group>.el-button:first-child:last-child.is-round{border-radius:20px}.el-button-group>.el-button:first-child:last-child.is-circle{border-radius:50%}.el-button-group>.el-button:not(:first-child):not(:last-child){border-radius:0}.el-button-group>.el-button:not(:last-child){margin-right:-1px}.el-button-group>.el-button.is-active,.el-button-group>.el-button:not(.is-disabled):active,.el-button-group>.el-button:not(.is-disabled):focus,.el-button-group>.el-button:not(.is-disabled):hover{z-index:1}

.el-button-group>.el-dropdown>.el-button{
  border-top-left-radius:0;border-bottom-left-radius:0
}
.el-input__inner,.el-textarea__inner{
  background-image:none;
  -webkit-box-sizing:border-box;
  -webkit-transition:border-color .2s cubic-bezier(.645,.045,.355,1)
}

.el-textarea{
    position:relative;
    display:inline-block;
    width:100%;
    vertical-align:bottom;
    font-size:14px
}

.el-textarea__inner{
    display:block;
    resize:vertical;
    padding:5px 10px;
    line-height:1.5;
    box-sizing:border-box;
    width:100%;
    font-size:inherit;
    color:#606266;
    background-color:#FFF;
    border:1px solid #DCDFE6;
    border-radius:4px;transition:border-color .2s cubic-bezier(.645,.045,.355,1)}
    
.el-textarea__inner::-webkit-input-placeholder{color:#C0C4CC}
.el-textarea__inner:-ms-input-placeholder{color:#C0C4CC}
.el-textarea__inner::-ms-input-placeholder{color:#C0C4CC}
.el-textarea__inner::placeholder{color:#C0C4CC}
.el-textarea__inner:hover{border-color:#C0C4CC}
.el-textarea__inner:focus{outline:0;border-color:#52b788}
.el-textarea .el-input__count{color:#909399;background:#FFF;position:absolute;font-size:12px;bottom:5px;right:10px}
.el-textarea.is-disabled .el-textarea__inner{background-color:#F5F7FA;border-color:#E4E7ED;color:#C0C4CC;cursor:not-allowed}
.el-textarea.is-disabled .el-textarea__inner::-webkit-input-placeholder{color:#C0C4CC}
.el-textarea.is-disabled .el-textarea__inner:-ms-input-placeholder{color:#C0C4CC}
.el-textarea.is-disabled .el-textarea__inner::-ms-input-placeholder{color:#C0C4CC}
.el-textarea.is-disabled .el-textarea__inner::placeholder{color:#C0C4CC}
.el-textarea.is-exceed .el-textarea__inner{border-color:#F56C6C}
.el-textarea.is-exceed .el-input__count{color:#F56C6C}
.el-input{position:relative;font-size:14px;display:inline-block;width:100%}
.el-input::-webkit-scrollbar{z-index:11;width:6px}
.el-input::-webkit-scrollbar:horizontal{height:6px}
.el-input::-webkit-scrollbar-thumb{border-radius:5px;width:6px;background:#b4bccc}
.el-input::-webkit-scrollbar-corner{background:#fff}
.el-input::-webkit-scrollbar-track{background:#fff}
.el-input::-webkit-scrollbar-track-piece{background:#fff;width:6px}
.el-input .el-input__clear{
  color:#C0C4CC;
  font-size:14px;
  cursor:pointer;
  -webkit-transition:color .2s cubic-bezier(.645,.045,.355,1);
  transition:color .2s cubic-bezier(.645,.045,.355,1)}
  
.el-input .el-input__clear:hover{color:#909399}
.el-input .el-input__count{
  height:100%;
  display:-webkit-inline-box;
  display:-ms-inline-flexbox;
  display:inline-flex;
  -webkit-box-align:center;
  -ms-flex-align:center;
  align-items:center;
  color:#909399;
  font-size:12px}

.el-input-group__append .el-button,.el-input-group__append .el-input,.el-input-group__prepend .el-button,.el-input-group__prepend .el-input,.el-input__inner{font-size:inherit}
.el-input .el-input__count .el-input__count-inner{background:#FFF;line-height:initial;display:inline-block;padding:0 5px}
    
.el-input__inner{
  -webkit-appearance:none;
  background-color:#FFF;
  border-radius:4px;
  border:1px solid #DCDFE6;
  box-sizing:border-box;
  color:#606266;
  display:inline-block;
  height:40px;
  line-height:40px;
  outline:0;padding:0 0.6em;
  transition:border-color .2s cubic-bezier(.645,.045,.355,1);width:100%}
.el-input__prefix,.el-input__suffix{position:absolute;top:0;-webkit-transition:all .3s;text-align:center;height:100%;color:#C0C4CC}
.el-input__inner::-ms-reveal{display:none}
.el-input__inner::-webkit-input-placeholder{color:#C0C4CC}
.el-input__inner:-ms-input-placeholder{color:#C0C4CC}
.el-input__inner::-ms-input-placeholder{color:#C0C4CC}
.el-input__inner::placeholder{color:#C0C4CC}
.el-input__inner:hover{border-color:#C0C4CC}
.el-input.is-active .el-input__inner,.el-input__inner:focus{border-color:#52b788;outline:0}
.el-input__suffix{right:5px;transition:all .3s;pointer-events:none}
.el-input__suffix-inner{pointer-events:all}
.el-input__prefix{left:5px;transition:all .3s}
.el-input__icon{height:100%;width:25px;text-align:center;-webkit-transition:all .3s;transition:all .3s;line-height:40px}
.el-input__icon:after{content:'';height:100%;width:0;display:inline-block;vertical-align:middle}
.el-input__validateIcon{pointer-events:none}
.el-input.is-disabled .el-input__inner{background-color:#F5F7FA;border-color:#E4E7ED;color:#C0C4CC;cursor:not-allowed}
.el-input.is-disabled .el-input__inner::-webkit-input-placeholder{color:#C0C4CC}
.el-input.is-disabled .el-input__inner:-ms-input-placeholder{color:#C0C4CC}
.el-input.is-disabled .el-input__inner::-ms-input-placeholder{color:#C0C4CC}
.el-input.is-disabled .el-input__inner::placeholder{color:#C0C4CC}
.el-input.is-disabled .el-input__icon{cursor:not-allowed}
.el-input.is-exceed .el-input__inner{border-color:#F56C6C}
.el-input.is-exceed .el-input__suffix .el-input__count{color:#F56C6C}
.el-input--suffix .el-input__inner{padding-right:30px}
.el-input--prefix .el-input__inner{padding-left:30px}
.el-input--medium{font-size:14px}
.el-input--medium .el-input__inner{height:36px;line-height:36px}
.el-input--medium .el-input__icon{line-height:36px}
.el-input--small{font-size:13px}
.el-input--small .el-input__inner{height:32px;line-height:32px}
.el-input--small .el-input__icon{line-height:32px}
.el-input--mini{font-size:12px}
.el-input--mini .el-input__inner{height:28px;line-height:28px}
.el-input--mini .el-input__icon{line-height:28px}
.el-input-group{line-height:normal;display:inline-table;width:100%;border-collapse:separate;border-spacing:0}
.el-input-group>.el-input__inner{vertical-align:middle;display:table-cell}
.el-input-group__append,.el-input-group__prepend{
  background-color:#F5F7FA;
  color:#909399;
  vertical-align:middle;
  display:table-cell;
  position:relative;
  border:1px solid #DCDFE6;
  border-radius:4px;
  padding:0 20px;
  width:1px;
  white-space:nowrap}
  
.el-input-group--prepend .el-input__inner,.el-input-group__append{border-top-left-radius:0;border-bottom-left-radius:0}
.el-input-group--append .el-input__inner,.el-input-group__prepend{border-top-right-radius:0;border-bottom-right-radius:0}
      
.el-input-group__append:focus,.el-input-group__prepend:focus{outline:0}
.el-input-group__append .el-button,.el-input-group__append .el-select,.el-input-group__prepend .el-button,.el-input-group__prepend .el-select{display:inline-block;margin:-10px -20px}
.el-input-group__append button.el-button,.el-input-group__append div.el-select .el-input__inner,.el-input-group__append div.el-select:hover .el-input__inner,.el-input-group__prepend button.el-button,.el-input-group__prepend div.el-select .el-input__inner,.el-input-group__prepend div.el-select:hover .el-input__inner{border-color:transparent;background-color:transparent;color:inherit;border-top:0;border-bottom:0}
.el-input-group__prepend{border-right:0}
.el-input-group__append{border-left:0}
.el-input-group--append .el-select .el-input.is-focus .el-input__inner,.el-input-group--prepend .el-select .el-input.is-focus .el-input__inner{border-color:transparent}.el-input__inner::-ms-clear{display:none;width:0;height:0}
.el-loading-parent--relative{position:relative!important}
.el-loading-parent--hidden{overflow:hidden!important}
.el-loading-mask{
  position:absolute;
  z-index:2000;
  background-color:rgba(255,255,255,.9);
  margin:0;top:0;right:0;bottom:0;left:0;
  -webkit-transition:opacity .3s;transition:opacity .3s}
.el-loading-mask.is-fullscreen{position:fixed}
.el-loading-mask.is-fullscreen .el-loading-spinner{margin-top:-25px}
.el-loading-mask.is-fullscreen .el-loading-spinner .circular{height:50px;width:50px}
.el-loading-spinner{top:50%;margin-top:-21px;width:100%;text-align:center;position:absolute}
.el-loading-spinner .el-loading-text{color:#52b788;margin:3px 0;font-size:14px}
.el-loading-spinner .circular{height:42px;width:42px;-webkit-animation:loading-rotate 2s linear infinite;animation:loading-rotate 2s linear infinite}
.el-loading-spinner .path{-webkit-animation:loading-dash 1.5s ease-in-out infinite;animation:loading-dash 1.5s ease-in-out infinite;stroke-dasharray:90,150;stroke-dashoffset:0;stroke-width:2;stroke:#52b788;stroke-linecap:round}
.el-loading-spinner i{color:#52b788}
.el-loading-fade-enter,.el-loading-fade-leave-active{opacity:0}@-webkit-keyframes loading-rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes loading-rotate{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-40px}100%{stroke-dasharray:90,150;stroke-dashoffset:-120px}}@keyframes loading-dash{0%{stroke-dasharray:1,200;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-40px}100%{stroke-dasharray:90,150;stroke-dashoffset:-120px}}


.external-link {
  text-decoration: underline solid;    /* 点线下划线 */
  text-underline-offset: 3px;           /* 下划线离文字远一点 */
  position: relative;
}

.external-link::after {
  content: "";
  display: inline-block;
  width: 0.75em;
  height: 0.75em;
  margin-left: 1px;
  background: currentColor;             /* 用当前文字颜色填充 */
  -webkit-mask: url('/images/external-link.svg') no-repeat center;
  mask: url('/images/external-link.svg') no-repeat center;
  -webkit-mask-size: contain;
  mask-size: contain;
 }

pink{
  background-color: var(--bordercl);
  padding:0.2rem 0.3rem;
  border-radius: 0.3rem;
  color:#fff;
  margin-right:0.3rem;
  font-size:0.9rem;
}

/* 主页分类标签分隔符 */
.category-link:not(:last-child)::after {
  content: "&";
  margin: 0 0.3em;
}

/* ========== Chroma 语法高亮 - Rainbow 配色 ========== */
.chroma { color: #333; background-color: rgb(247,247,247); }
.chroma .err { color: #a61717; background-color: #e3d2d2; }

/* 行号 */
.chroma .lnt, .chroma .ln { color: rgb(212,212,212); margin-right: 0.5em; padding: 0 0.4em; user-select: none; }

/* 关键字 - 红色 */
.chroma .k, .chroma .kc, .chroma .kd, .chroma .kn,
.chroma .kp, .chroma .kr, .chroma .kv { color: rgb(204,35,35); }
.chroma .kt { color: rgb(204,35,35); }

/* 数字 - 蓝色 */
.chroma .m, .chroma .mb, .chroma .mf, .chroma .mh,
.chroma .mi, .chroma .mo, .chroma .il { color: rgb(27,57,226); }

/* 字符串 - 绿色 */
.chroma .s, .chroma .s1, .chroma .s2, .chroma .sa,
.chroma .sb, .chroma .sc, .chroma .dl, .chroma .sd,
.chroma .se, .chroma .sh, .chroma .si, .chroma .sx,
.chroma .sr, .chroma .ld { color: rgb(18,129,18); }
.chroma .ss { color: rgb(27,57,226); }

/* 注释 - 绿色斜体 */
.chroma .c, .chroma .c1, .chroma .ch, .chroma .cm,
.chroma .cs, .chroma .cp, .chroma .cpf { color: rgb(18,129,18); font-style: italic; }

/* 运算符 - 红色 */
.chroma .o, .chroma .ow { color: rgb(204,35,35); }

/* 函数/类名 - 紫色 */
.chroma .nf, .chroma .fm { color: rgb(146,50,255); }
.chroma .nc, .chroma .nn { color: rgb(146,50,255); }

/* 内置函数 - 橙色 */
.chroma .nb, .chroma .bp { color: rgb(218,135,12); }

/* 装饰器 - 橙色 */
.chroma .nd { color: rgb(218,135,12); }

/* 标签 - 深红 */
.chroma .nt { color: rgb(139,10,10); }

/* 属性 / 变量 - 蓝色 */
.chroma .na { color: rgb(38,129,219); }
.chroma .nv, .chroma .vc, .chroma .vg, .chroma .vi, .chroma .vm { color: rgb(38,129,219); }

/* Generic */
.chroma .ge { font-style: italic; }
.chroma .gs { }
.chroma .gd { color: #a00000; }
.chroma .gi { color: #006400; }
.chroma .go { color: #888; }
.chroma .gp { color: #c65d09; }
.chroma .gr { color: #ff0000; }
.chroma .gh { color: #000080; }
.chroma .gu { color: #800080; }
.chroma .gt { color: #0040d0; }