@media (min-width: 1200px) {
  .post-container,
  .sidebar-container {
    padding-right: 5%;
  }
}
@media (min-width: 768px) {
  .post-container {
    padding-right: 5%;
  }
}
.sidebar-container {
  color: #adb8d0;
  font-size: 14px;
}
.sidebar-container h5 {
  color: #7e90b2;
  padding-bottom: 1em;
}
.sidebar-container h5 a {
  color: #7e90b2 !important;
  text-decoration: none;
}
.sidebar-container a {
  color: #adb8d0 !important;
}
.sidebar-container a:hover,
.sidebar-container a:active {
  color: #5080b0 !important;
}
.sidebar-container .tags a {
  border-color: #adb8d0;
}
.sidebar-container .tags a:hover,
.sidebar-container .tags a:active {
  border-color: #5080b0;
}
.sidebar-container .short-about img {
  width: 80%;
  display: block;
  border-radius: 5px;
  margin-bottom: 20px;
}
.sidebar-container .short-about p {
  margin-top: 0px;
  margin-bottom: 20px;
}
.sidebar-container .short-about .list-inline > li {
  padding-left: 0px;
}
.catalog-container {
  padding: 0px;
}
.side-catalog {
  display: block;
  overflow-y: auto;
  height: 100%;
  padding-bottom: 40px;
  width: 195px;
  scrollbar-width: thin;
  scrollbar-color: rgba(114, 168, 216, 0.3) rgba(155, 180, 218, 0.05);
}
.side-catalog.fixed {
  position: fixed;
  top: 40px;
}
.side-catalog.fold .catalog-toggle::before {
  content: "+";
}
.side-catalog.fold .catalog-body {
  display: none;
}
.side-catalog .catalog-toggle::before {
  content: "−";
  position: relative;
  margin-right: 5px;
  bottom: 1px;
}
.side-catalog::-webkit-scrollbar {
  width: 4px;
}
.side-catalog::-webkit-scrollbar-track {
  background: rgba(155, 180, 218, 0.05);
  border-radius: 2px;
}
.side-catalog::-webkit-scrollbar-thumb {
  background: rgba(114, 168, 216, 0.3);
  border-radius: 2px;
}
.side-catalog::-webkit-scrollbar-thumb:hover {
  background: rgba(114, 168, 216, 0.5);
}
.side-catalog .catalog-body {
  position: relative;
  list-style: none;
  height: auto;
  overflow: hidden;
  padding-left: 0px;
  padding-right: 5px;
  text-indent: 0;
}
.side-catalog .catalog-body li {
  position: relative;
  list-style: none;
}
.side-catalog .catalog-body li a {
  padding-left: 10px;
  max-width: 180px;
  display: inline-block;
  vertical-align: middle;
  height: 30px;
  line-height: 30px;
  overflow: hidden;
  text-decoration: none;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: #adb8d0;
  transition: color 0.2s;
}
.side-catalog .catalog-body li a:hover {
  color: #72a8d8;
}
.side-catalog .catalog-body .h1_nav,
.side-catalog .catalog-body .h2_nav {
  margin-left: 0;
  font-size: 13px;
  font-weight: bold;
}
.side-catalog .catalog-body .h3_nav {
  margin-left: 6px;
  font-size: 13px;
  font-weight: bold;
}
.side-catalog .catalog-body .h4_nav {
  margin-left: 12px;
  font-size: 12px;
}
.side-catalog .catalog-body .h4_nav a {
  max-width: 170px;
}
.side-catalog .catalog-body .h5_nav,
.side-catalog .catalog-body .h6_nav {
  margin-left: 18px;
  font-size: 12px;
}
.side-catalog .catalog-body .h5_nav a,
.side-catalog .catalog-body .h6_nav a {
  max-width: 170px;
}
.side-catalog .catalog-body .active {
  border-radius: 4px;
  background-color: rgba(114, 168, 216, 0.1);
}
.side-catalog .catalog-body .active a {
  color: #72a8d8 !important;
}
.side-catalog h5 {
  font-family: 'Cormorant Garamond', 'Noto Serif SC', 'Times New Roman', serif;
  font-style: italic;
  font-weight: 300;
  color: #b2c0d8;
  font-size: 0.85rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(165, 188, 230, 0.2);
  margin-bottom: 8px;
}
.side-catalog h5 .catalog-toggle {
  color: #adb8d0;
  text-decoration: none;
}
.side-catalog h5 .catalog-toggle:hover {
  color: #72a8d8;
}
@media (max-width: 1200px) {
  .side-catalog {
    display: none;
  }
}
/* snackbar.less — 液态玻璃风格通知弹窗（右下角，最上层）*/
.paper-snackbar {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 100002;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  min-width: 240px;
  max-width: 420px;
  padding: 14px 20px;
  border-radius: 16px;
  background: rgba(25, 38, 65, 0.55);
  border: 1px solid rgba(175, 195, 228, 0.2);
  backdrop-filter: blur(20px) saturate(1.4);
  -webkit-backdrop-filter: blur(20px) saturate(1.4);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3), 0 2px 8px rgba(132, 162, 210, 0.1);
  font-family: 'Noto Sans SC', 'Helvetica Neue', sans-serif;
  font-size: 0.82rem;
  font-weight: 300;
  color: #e0e6f2;
  line-height: 1.4;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.4s cubic-bezier(0.32, 1, 0.23, 1), transform 0.4s cubic-bezier(0.32, 1, 0.23, 1);
}
.paper-snackbar .snackbar-text {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.paper-snackbar .action {
  background: rgba(114, 168, 216, 0.2);
  border: 1px solid rgba(114, 168, 216, 0.35);
  border-radius: 8px;
  padding: 5px 14px;
  font-family: inherit;
  font-size: 0.72rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #72a8d8;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
  transition: background 0.2s, color 0.2s, border-color 0.2s;
}
.paper-snackbar .action:hover {
  background: rgba(114, 168, 216, 0.35);
  color: #e0e6f2;
  border-color: rgba(114, 168, 216, 0.5);
}
.paper-snackbar .action:focus,
.paper-snackbar .action:active {
  outline: none;
  box-shadow: none;
}
@media (max-width: 640px) {
  .paper-snackbar {
    left: 16px;
    right: 16px;
    max-width: none;
  }
}
.highlight,
pre.highlight {
  background: #282c34;
  color: #abb2bf;
}
.highlight pre {
  background: #282c34;
}
.highlight .hll {
  background: #282c34;
}
.highlight .c {
  color: #5c6370;
  font-style: italic;
}
.highlight .err {
  color: #960050;
  background-color: #1e0010;
}
.language-coq .highlight .err {
  background-color: transparent;
}
.highlight .k,
.language-coq .highlight .err {
  color: #c678dd;
}
.highlight .l {
  color: #98c379;
}
.highlight .n {
  color: #abb2bf;
}
.highlight .o {
  color: #abb2bf;
}
.highlight .p {
  color: #abb2bf;
}
.highlight .cm {
  color: #5c6370;
  font-style: italic;
}
.highlight .cp {
  color: #5c6370;
  font-style: italic;
}
.highlight .c1 {
  color: #5c6370;
  font-style: italic;
}
.highlight .cs {
  color: #5c6370;
  font-style: italic;
}
.highlight .ge {
  font-style: italic;
}
.highlight .gs {
  font-weight: 700;
}
.highlight .kc {
  color: #c678dd;
}
.highlight .kd {
  color: #c678dd;
}
.highlight .kn {
  color: #c678dd;
}
.highlight .kp {
  color: #c678dd;
}
.highlight .kr {
  color: #c678dd;
}
.highlight .kt {
  color: #c678dd;
}
.highlight .ld {
  color: #98c379;
}
.highlight .m {
  color: #d19a66;
}
.highlight .s {
  color: #98c379;
}
.highlight .na {
  color: #d19a66;
}
.highlight .nb {
  color: #e5c07b;
}
.highlight .nc {
  color: #e5c07b;
}
.highlight .no {
  color: #e5c07b;
}
.highlight .nd {
  color: #e5c07b;
}
.highlight .ni {
  color: #e5c07b;
}
.highlight .ne {
  color: #e5c07b;
}
.highlight .nf {
  color: #abb2bf;
}
.highlight .nl {
  color: #e5c07b;
}
.highlight .nn {
  color: #abb2bf;
}
.highlight .nx {
  color: #abb2bf;
}
.highlight .py {
  color: #e5c07b;
}
.highlight .nt {
  color: #e06c75;
}
.highlight .nv {
  color: #e5c07b;
}
.highlight .ow {
  font-weight: 700;
}
.highlight .w {
  color: #f8f8f2;
}
.highlight .mf {
  color: #d19a66;
}
.highlight .mh {
  color: #d19a66;
}
.highlight .mi {
  color: #d19a66;
}
.highlight .mo {
  color: #d19a66;
}
.highlight .sb {
  color: #98c379;
}
.highlight .sc {
  color: #98c379;
}
.highlight .sd {
  color: #98c379;
}
.highlight .s2 {
  color: #98c379;
}
.highlight .se {
  color: #98c379;
}
.highlight .sh {
  color: #98c379;
}
.highlight .si {
  color: #98c379;
}
.highlight .sx {
  color: #98c379;
}
.highlight .sr {
  color: #56b6c2;
}
.highlight .s1 {
  color: #98c379;
}
.highlight .ss {
  color: #56b6c2;
}
.highlight .bp {
  color: #e5c07b;
}
.highlight .vc {
  color: #e5c07b;
}
.highlight .vg {
  color: #e5c07b;
}
.highlight .vi {
  color: #e06c75;
}
.highlight .il {
  color: #d19a66;
}
.highlight .gu {
  color: #75715e;
}
.highlight .gd {
  color: #f92672;
}
.highlight .gi {
  color: #a6e22e;
}
.highlighter-rouge .highlight {
  margin-bottom: 10px;
  border-radius: 6px;
}
.highlighter-rouge .highlight pre {
  font-size: 14px;
  line-height: 1.5;
  color: #555;
  background: transparent;
  border: 0;
  margin: 0;
  padding: 0;
  word-wrap: normal;
}
.highlighter-rouge .highlight .rouge-table .rouge-gutter,
.highlighter-rouge .highlight .rouge-table .rouge-code {
  border: 0 !important;
}
.highlighter-rouge .highlight .rouge-code pre {
  color: #abb2bf;
}
.highlighter-rouge .highlight .table-responsive {
  margin: 0px;
  border: 0px;
}
.highlighter-rouge .highlight .table {
  margin: 0px;
  table-layout: fixed;
}
.highlighter-rouge .highlight table > tbody > tr > td {
  margin: 0;
  border: 0;
  padding: 0;
}
.highlighter-rouge .highlight table > tbody > tr > td > pre {
  padding: 14px;
}
.highlighter-rouge .highlight td.rouge-gutter {
  width: 56px;
}
.highlighter-rouge .highlight .lineno {
  text-align: right;
  border-radius: 0px;
}
/* Landscape phones and down */
@media (max-width: 480px) {
  .highlighter-rouge .highlight {
    margin-left: -15px;
    margin-right: -15px;
    border-radius: 0px;
  }
  .highlighter-rouge .highlight td.rouge-gutter {
    width: 36px;
  }
  .highlighter-rouge .highlight table > tbody > tr > td > pre {
    padding: 14px 10px;
  }
}
.search-page {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 100;
  background: #fff;
  -webkit-transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1);
  transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1);
  -webkit-transform: translate(0, 100%);
  -ms-transform: translate(0, 100%);
  transform: translate(0, 100%);
  opacity: 0;
}
.search-page.search-active {
  opacity: 1;
  -webkit-transform: translate(0, 0) scale(1, 1);
  -ms-transform: translate(0, 0) scale(1, 1);
  transform: translate(0, 0) scale(1, 1);
}
.search-page.search-active .search-main {
  opacity: 1;
}
.search-page .search-main {
  padding-top: 80px;
  height: 100%;
  opacity: 0;
  -webkit-transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1) 250ms;
  transition: all 400ms cubic-bezier(0.32, 1, 0.23, 1) 250ms;
}
.search-page .search-main .row,
.search-page .search-main .row > div {
  height: 100%;
}
.search-page .search-icon-close-container {
  position: absolute;
  z-index: 100;
  padding: 12px;
  top: 0;
  right: 0;
}
.search-page .search-icon-close-container .search-icon-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.search-page .search-icon-close-container .search-icon-close i {
  font-size: 20px;
}
.search-page .search-icon-close-container .search-icon-close:active {
  opacity: 0.6;
}
.search-page #search-input {
  font-family: "Fira Code", Menlo, Monaco, Consolas, "Courier New", monospace;
  border: none;
  outline: none;
  padding: 0;
  margin: 0;
  width: 100%;
  font-size: 30px;
  font-weight: bold;
  color: #e0e6f2;
}
@media only screen and (min-width: 768px) {
  .search-page #search-input {
    margin-left: 20px;
  }
}
.search-page #search-results {
  overflow: auto;
  height: 100%;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 80px;
}
.search-icon a,
.search-icon-close {
  cursor: pointer;
  font-size: 30px;
  color: #311e3e;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
  background: none;
  border: none;
  padding: 0;
  -webkit-tap-highlight-color: transparent;
}
.search-icon a:hover,
.search-icon-close:hover {
  opacity: 0.8;
}
.search-icon,
.search-icon-close {
  font-size: 16px;
}
body {
  /* Hux learn from
     *     TypeIsBeautiful,
     *     [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
     */
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif;
  line-height: 1.7;
  font-weight: 300;
  font-size: 16px;
  color: #e0e6f2;
  background: #181e32;
  overflow-x: hidden;
  min-height: 100vh;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
}
p {
  margin: 30px 0;
}
@media screen and (max-width: 768px) {
  p {
    margin: 25px 0;
  }
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Cormorant Garamond', 'Noto Serif SC', 'Times New Roman', serif;
  font-style: italic;
  line-height: 1.1;
  font-weight: 300;
}
h4 {
  font-size: 21px;
}
a {
  color: #adb8d0;
}
a:hover,
a:focus {
  color: #72a8d8;
}
a img:hover,
a img:focus {
  cursor: zoom-in;
}
article {
  overflow: hidden;
}
blockquote {
  color: gray;
  font-style: italic;
  font-size: 0.95em;
  margin: 20px 0 20px;
}
blockquote p {
  margin: 0;
}
small.img-hint {
  display: block;
  margin-top: -20px;
  text-align: center;
}
br + small.img-hint {
  margin-top: -40px;
}
img.shadow {
  box-shadow: rgba(0, 0, 0, 0.258824) 0px 2px 5px 0px;
}
select {
  -webkit-appearance: none;
  margin-top: 15px;
  color: #337ab7;
  border-color: #337ab7;
  padding: 0em 0.4em;
  background: white;
}
select.sel-lang {
  min-height: 28px;
  font-size: 14px;
}
table {
  margin-top: 10px;
}
table.table > tbody th,
table.table > thead th,
table.table > tbody td,
table.table > thead td {
  border: 1px solid #eee !important;
}
@media screen and (max-width: 767px) {
  .table-responsive {
    border: 0;
  }
}
hr.small {
  max-width: 100px;
  margin: 15px auto;
  border-width: 4px;
  border-color: white;
}
pre,
.table-responsive {
  -webkit-overflow-scrolling: touch;
}
pre code {
  display: block;
  width: auto;
  white-space: pre;
  word-wrap: normal;
}
code,
kbd,
pre,
samp {
  font-family: "Fira Code", Menlo, Monaco, Consolas, "Courier New", monospace;
}
.postlist-container {
  margin-bottom: 15px;
}
.post-container a {
  color: #337ab7;
}
.post-container a:hover,
.post-container a:focus {
  color: #5080b0;
}
.post-container h1,
.post-container h2,
.post-container h3,
.post-container h4,
.post-container h5,
.post-container h6 {
  margin: 50px 0 20px;
  line-height: 1.4;
}
.post-container h1 + p,
.post-container h2 + p,
.post-container h3 + p,
.post-container h4 + p,
.post-container h5 + p,
.post-container h6 + p {
  margin-top: 20px;
}
.post-container h2::before {
  content: " ";
  display: block;
  border-bottom: 1px solid #ececec;
  margin-top: 44px;
  margin-bottom: 30px;
}
.post-container h4 {
  font-size: 22px;
  font-weight: 600;
  color: gray;
}
.post-container h4 + p {
  margin-top: 10px;
}
.post-container h5,
.post-container h6 {
  font-size: 20px;
  font-weight: 600;
  color: gray;
}
.post-container h5 + p,
.post-container h6 + p {
  margin-top: 10px;
}
@media screen and (max-width: 768px) {
  .post-container h1 {
    font-size: 30px;
  }
  .post-container h2 {
    font-size: 22px;
  }
  .post-container h3 {
    font-size: 20px;
  }
  .post-container h4 {
    font-size: 19px;
  }
  .post-container h5,
  .post-container h6 {
    font-size: 18px;
  }
}
.post-container ul,
.post-container ol {
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .post-container ul,
  .post-container ol {
    padding-left: 30px;
  }
}
@media screen and (max-width: 500px) {
  .post-container ul,
  .post-container ol {
    padding-left: 20px;
  }
}
.post-container ol ol,
.post-container ol ul,
.post-container ul ol,
.post-container ul ul {
  margin-bottom: 5px;
}
.post-container li p {
  margin: 0;
  margin-bottom: 5px;
}
.post-container li h1,
.post-container li h2,
.post-container li h3,
.post-container li h4,
.post-container li h5,
.post-container li h6 {
  line-height: 2;
  margin-top: 20px;
}
.post-container .pager li {
  width: 48%;
}
.post-container .pager li.next {
  float: right;
}
.post-container .pager li.previous {
  float: left;
}
.post-container .pager li > a {
  width: 100%;
}
.post-container .pager li > a > span {
  color: #7e90b2;
  font-weight: normal;
  letter-spacing: 0.5px;
}
.post-container .anchorjs-link {
  position: absolute;
  text-decoration: none !important;
}
@media only screen and (max-width: 767px) {
  /**
   * Layout
   * Since V1.6 we use absolute positioning to prevent to expand container-fluid
   * which would cover tags. A absolute positioning make a new layer.
   */
  .navbar-default .navbar-collapse {
    position: absolute;
    right: 0;
    border: none;
    background: white;
    box-shadow: 0px 5px 10px 2px rgba(0, 0, 0, 0.2);
    box-shadow: rgba(0, 0, 0, 0.117647) 0px 1px 6px, rgba(0, 0, 0, 0.239216) 0px 1px 4px;
    border-radius: 2px;
    width: 170px;
  }
  /**
   * Animation
   * HuxBlog-Navbar using genuine Material Design Animation
   */
  #huxblog_navbar {
    /**
     * Sharable code and 'out' function
     */
    opacity: 0;
    transform: scaleX(0);
    transform-origin: top right;
    transition: all 200ms cubic-bezier(0.47, 0, 0.4, 0.99) 0ms;
    -webkit-transform: scaleX(0);
    -webkit-transform-origin: top right;
    -webkit-transition: all 200ms cubic-bezier(0.47, 0, 0.4, 0.99) 0ms;
    /**
     *'In' Animation
     */
  }
  #huxblog_navbar a {
    font-size: 13px;
    line-height: 28px;
  }
  #huxblog_navbar .navbar-collapse {
    height: 0px;
    transform: scaleY(0);
    transform-origin: top right;
    transition: transform 400ms cubic-bezier(0.32, 1, 0.23, 1) 0ms;
    -webkit-transform: scaleY(0);
    -webkit-transform-origin: top right;
    -webkit-transition: -webkit-transform 400ms cubic-bezier(0.32, 1, 0.23, 1) 0ms;
  }
  #huxblog_navbar li {
    opacity: 0;
    transition: opacity 100ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
    -webkit-transition: opacity 100ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  }
  #huxblog_navbar.in {
    transform: scaleX(1);
    -webkit-transform: scaleX(1);
    opacity: 1;
    transition: all 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
    -webkit-transition: all 250ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
  }
  #huxblog_navbar.in .navbar-collapse {
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transition: transform 500ms cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transition: -webkit-transform 500ms cubic-bezier(0.23, 1, 0.32, 1);
  }
  #huxblog_navbar.in li {
    opacity: 1;
    transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 205ms;
    -webkit-transition: opacity 450ms cubic-bezier(0.23, 1, 0.32, 1) 205ms;
  }
}
.navbar-custom {
  background: none;
  border: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 3;
  /* Hux learn from
     *     TypeIsBeautiful,
     *     [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
     */
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif;
  line-height: 1.7;
}
.navbar-custom .navbar-brand {
  font-weight: 800;
  color: white;
  height: 56px;
  line-height: 25px;
}
.navbar-custom .navbar-brand:hover {
  color: rgba(255, 255, 255, 0.8);
}
.navbar-custom .nav li a {
  text-transform: uppercase;
  font-size: 12px;
  line-height: 20px;
  font-weight: 800;
  letter-spacing: 1px;
}
.navbar-custom .nav li a:active {
  background: rgba(0, 0, 0, 0.12);
}
@media only screen and (min-width: 768px) {
  .navbar-custom {
    background: transparent;
    border-bottom: 1px solid transparent;
  }
  .navbar-custom body {
    font-size: 20px;
  }
  .navbar-custom .navbar-brand {
    color: white;
    padding: 20px;
    line-height: 20px;
  }
  .navbar-custom .navbar-brand:hover,
  .navbar-custom .navbar-brand:focus {
    color: rgba(239, 242, 250, 0.8);
  }
  .navbar-custom .nav li a {
    color: white;
    padding: 20px;
  }
  .navbar-custom .nav li a:hover,
  .navbar-custom .nav li a:focus {
    color: rgba(239, 242, 250, 0.8);
  }
  .navbar-custom .nav li a:active {
    background: none;
  }
}
.navbar-custom.invert .navbar-toggle:active {
  background-color: rgba(0, 0, 0, 0.05);
}
.navbar-custom.invert .navbar-toggle .icon-bar {
  background-color: #e0e6f2;
}
.navbar-custom.invert .navbar-brand {
  color: #e0e6f2;
}
.navbar-custom.invert .navbar-brand:hover,
.navbar-custom.invert .navbar-brand:focus {
  color: #5080b0;
}
.navbar-custom.invert .nav li a {
  color: #e0e6f2;
}
.navbar-custom.invert .nav li a:hover,
.navbar-custom.invert .nav li a:focus {
  color: #5080b0;
}
@media only screen and (min-width: 1170px) {
  .navbar-custom {
    -webkit-transition: background-color 0.3s;
    -moz-transition: background-color 0.3s;
    transition: background-color 0.3s;
    /* Force Hardware Acceleration in WebKit */
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
  }
  .navbar-custom.is-fixed {
    /* when the user scrolls down, we hide the header right above the viewport */
    position: fixed;
    top: -61px;
    background-color: rgba(38, 48, 80, 0.9);
    border-bottom: 1px solid rgba(165, 188, 230, 0.2);
    -webkit-transition: -webkit-transform 0.3s;
    -moz-transition: -moz-transform 0.3s;
    transition: transform 0.3s;
  }
  .navbar-custom.is-fixed .navbar-brand {
    color: #e0e6f2;
  }
  .navbar-custom.is-fixed .navbar-brand:hover,
  .navbar-custom.is-fixed .navbar-brand:focus {
    color: #5080b0;
  }
  .navbar-custom.is-fixed .nav li a {
    color: #e0e6f2;
  }
  .navbar-custom.is-fixed .nav li a:hover,
  .navbar-custom.is-fixed .nav li a:focus {
    color: #5080b0;
  }
  .navbar-custom.is-visible {
    /* if the user changes the scrolling direction, we show the header */
    -webkit-transform: translate3d(0, 100%, 0);
    -moz-transform: translate3d(0, 100%, 0);
    -ms-transform: translate3d(0, 100%, 0);
    -o-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0);
  }
}
.intro-header {
  background: no-repeat center center;
  background-color: #263050;
  background-attachment: scroll;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  background-size: cover;
  -o-background-size: cover;
  margin-bottom: 0px;
  /* 0 on mobile, modify by Hux */
}
.intro-header.style-text {
  background: none;
}
.intro-header.style-text .site-heading,
.intro-header.style-text .post-heading,
.intro-header.style-text .page-heading {
  padding: 85px 0 20px;
  color: #e0e6f2;
}
.intro-header.style-text .site-heading .subheading,
.intro-header.style-text .post-heading .subheading,
.intro-header.style-text .page-heading .subheading {
  margin-bottom: 15px;
}
.intro-header.style-text .tags a,
.intro-header.style-text .tags .tag {
  border-color: #e0e6f2;
  color: #e0e6f2;
}
.intro-header.style-text .tags a:hover,
.intro-header.style-text .tags .tag:hover,
.intro-header.style-text .tags a:active,
.intro-header.style-text .tags .tag:active {
  background-color: rgba(0, 0, 0, 0.05);
}
@media only screen and (min-width: 768px) {
  .intro-header {
    margin-bottom: 20px;
    /* response on desktop */
  }
}
.intro-header .site-heading,
.intro-header .post-heading,
.intro-header .page-heading {
  padding: 85px 0 55px;
  color: white;
}
@media only screen and (min-width: 768px) {
  .intro-header .site-heading,
  .intro-header .post-heading,
  .intro-header .page-heading {
    padding: 150px 0;
  }
}
.intro-header .site-heading {
  padding: 95px 0 70px;
}
@media only screen and (min-width: 768px) {
  .intro-header .site-heading {
    padding: 150px 0;
  }
}
.intro-header .site-heading,
.intro-header .page-heading {
  text-align: center;
}
.intro-header .site-heading h1,
.intro-header .page-heading h1 {
  margin-top: 0;
  font-size: 50px;
}
.intro-header .site-heading .subheading,
.intro-header .page-heading .subheading {
  /* Hux learn from
     *     TypeIsBeautiful,
     *     [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
     */
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif;
  line-height: 1.7;
  font-size: 18px;
  line-height: 1.1;
  display: block;
  font-weight: 300;
  margin: 10px 0 0;
}
@media only screen and (min-width: 768px) {
  .intro-header .site-heading h1,
  .intro-header .page-heading h1 {
    font-size: 80px;
  }
}
.intro-header .post-heading h1 {
  font-size: 30px;
  margin-bottom: 24px;
}
.intro-header .post-heading .subheading,
.intro-header .post-heading .meta {
  line-height: 1.1;
  display: block;
}
.intro-header .post-heading .subheading {
  /* Hux learn from
     *     TypeIsBeautiful,
     *     [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
     */
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif;
  line-height: 1.7;
  font-size: 17px;
  line-height: 1.4;
  font-weight: normal;
  margin: 10px 0 30px;
  margin-top: -5px;
}
.intro-header .post-heading .meta {
  font-family: 'Noto Serif SC', 'Spectral', 'Lora', 'Times New Roman', serif;
  font-style: italic;
  font-weight: 300;
  font-size: 16px;
}
.intro-header .post-heading .meta a {
  color: white;
}
@media only screen and (min-width: 768px) {
  .intro-header .post-heading h1 {
    font-size: 55px;
  }
  .intro-header .post-heading .subheading {
    font-size: 30px;
  }
  .intro-header .post-heading .meta {
    font-size: 20px;
  }
}
.intro-header .header-img-credit {
  position: absolute;
  bottom: 6px;
  right: 9px;
  color: white;
  opacity: 0.3;
  font-size: 10px;
  z-index: 1;
}
.intro-header .header-img-credit a {
  color: white;
}
@media only screen and (min-width: 768px) {
  .intro-header .header-img-credit {
    font-size: 12px;
    bottom: 10px;
    right: 15px;
  }
}
.post-preview > a {
  color: #e0e6f2;
}
.post-preview > a:hover,
.post-preview > a:focus {
  text-decoration: none;
  color: #5080b0;
}
.post-preview > a > .post-title {
  font-size: 21px;
  line-height: 1.3;
  margin-top: 30px;
  margin-bottom: 8px;
}
.post-preview > a > .post-subtitle {
  font-size: 15px;
  line-height: 1.3;
  margin: 0;
  font-weight: 300;
  margin-bottom: 10px;
}
.post-preview > .post-meta {
  font-family: 'Noto Serif SC', 'Spectral', 'Lora', 'Times New Roman', serif;
  color: #7e90b2;
  font-size: 16px;
  font-style: italic;
  margin-top: 0;
}
.post-preview > .post-meta > a {
  text-decoration: none;
  color: #e0e6f2;
}
.post-preview > .post-meta > a:hover,
.post-preview > .post-meta > a:focus {
  color: #5080b0;
  text-decoration: underline;
}
@media only screen and (min-width: 768px) {
  .post-preview > a > .post-title {
    font-size: 26px;
    line-height: 1.3;
    margin-bottom: 10px;
  }
  .post-preview > a > .post-subtitle {
    font-size: 16px;
  }
  .post-preview .post-meta {
    font-size: 18px;
  }
}
.post-content-preview {
  font-size: 13px;
  font-style: italic;
  color: #7e90b2;
}
.post-content-preview:hover {
  color: #5080b0;
}
@media only screen and (min-width: 768px) {
  .post-content-preview {
    font-size: 14px;
  }
}
.section-heading {
  font-size: 36px;
  margin-top: 60px;
  font-weight: 700;
}
.caption {
  text-align: center;
  font-size: 14px;
  padding: 10px;
  font-style: italic;
  margin: 0;
  display: block;
  border-bottom-right-radius: 5px;
  border-bottom-left-radius: 5px;
}
footer {
  font-size: 20px;
  padding: 50px 0 65px;
}
footer .list-inline {
  margin: 0;
  padding: 0;
}
footer .copyright {
  font-size: 14px;
  text-align: center;
  margin-bottom: 0;
}
footer .copyright a {
  color: #337ab7;
}
footer .copyright a:hover,
footer .copyright a:focus {
  color: #5080b0;
}
.btn {
  /* Hux learn from
     *     TypeIsBeautiful,
     *     [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
     */
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif;
  line-height: 1.7;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: 800;
  letter-spacing: 1px;
  border-radius: 0;
  padding: 15px 25px;
}
.btn-lg {
  font-size: 16px;
  padding: 25px 35px;
}
.btn-default:hover,
.btn-default:focus {
  background-color: #5080b0;
  border: 1px solid #5080b0;
  color: white;
}
.pager {
  margin: 20px 0 0 !important;
  padding: 0px !important;
}
.pager li > a,
.pager li > span {
  /* Hux learn from
     *     TypeIsBeautiful,
     *     [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
     */
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif;
  line-height: 1.7;
  text-transform: uppercase;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 1px;
  padding: 10px;
  background-color: white;
  border-radius: 0;
}
@media only screen and (min-width: 768px) {
  .pager li > a,
  .pager li > span {
    font-size: 14px;
    padding: 15px 25px;
  }
}
.pager li > a {
  color: #e0e6f2;
}
.pager li > a:hover,
.pager li > a:focus {
  color: white;
  background-color: #5080b0;
  border: 1px solid #5080b0;
}
.pager li > a:hover > span,
.pager li > a:focus > span {
  color: white;
}
.pager .disabled > a,
.pager .disabled > a:hover,
.pager .disabled > a:focus,
.pager .disabled > span {
  color: #7e90b2;
  background-color: #e0e6f2;
  cursor: not-allowed;
}
::-moz-selection {
  color: white;
  text-shadow: none;
  background: #5080b0;
}
::selection {
  color: white;
  text-shadow: none;
  background: #5080b0;
}
img::selection {
  color: white;
  background: transparent;
}
img::-moz-selection {
  color: white;
  background: transparent;
}
/* Hux add tags support */
.d-none {
  display: none !important;
}
.tags {
  margin-bottom: -5px;
}
.tags.tags-sup a,
.tags.tags-sup .tag {
  padding: 0 10px 0 12px;
}
.tags a,
.tags .tag {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 999em;
  padding: 0 10px 0 10px;
  color: #ffffff;
  line-height: 24px;
  font-size: 12px;
  text-decoration: none;
  margin: 0 1px;
  margin-bottom: 6px;
  cursor: pointer;
}
.tags a > sup,
.tags .tag > sup {
  margin-left: -2px;
  font-weight: 700;
}
.tags a:hover,
.tags .tag:hover,
.tags a:active,
.tags .tag:active {
  color: white;
  border-color: white;
  background-color: rgba(255, 255, 255, 0.4);
  text-decoration: none;
}
@media only screen and (min-width: 768px) {
  .tags a,
  .tags .tag {
    margin-right: 5px;
  }
}
#tag-heading {
  padding: 70px 0 60px;
}
@media only screen and (min-width: 768px) {
  #tag-heading {
    padding: 55px 0;
  }
}
#tag_cloud {
  margin: 20px 0 15px 0;
}
#tag_cloud a,
#tag_cloud .tag {
  transition-property: all;
  transition-duration: 0.4s;
  transition-timing-function: ease;
  font-size: 14px;
  border: none;
  line-height: 28px;
  margin: 0 2px;
  margin-bottom: 8px;
  background: #f3f5f5;
}
#tag_cloud a:hover,
#tag_cloud .tag:hover,
#tag_cloud a:active,
#tag_cloud .tag:active,
#tag_cloud a.focus,
#tag_cloud .tag.focus {
  background-color: #0085a1 !important;
}
#tag_cloud a.focus,
#tag_cloud .tag.focus {
  box-shadow: rgba(0, 0, 0, 0.117647) 0 1px 6px, rgba(0, 0, 0, 0.239216) 0 1px 4px;
}
#tag_cloud a.tag-button--all,
#tag_cloud .tag.tag-button--all {
  font-weight: 700;
  color: #0085a1 !important;
}
#tag_cloud a.tag-button--all:hover,
#tag_cloud .tag.tag-button--all:hover,
#tag_cloud a.tag-button--all:active,
#tag_cloud .tag.tag-button--all:active,
#tag_cloud a.tag-button--all.focus,
#tag_cloud .tag.tag-button--all.focus {
  background-color: #e4e4e4 !important;
}
@media only screen and (min-width: 768px) {
  #tag_cloud {
    margin-bottom: 25px;
  }
}
.tag-comments {
  font-size: 12px;
}
@media only screen and (min-width: 768px) {
  .tag-comments {
    font-size: 14px;
  }
}
.t:first-child {
  margin-top: 0px;
}
.listing-seperator {
  color: #0085a1;
  font-size: 21px !important;
}
.listing-seperator::before {
  margin-right: 5px;
}
@media only screen and (min-width: 768px) {
  .listing-seperator {
    font-size: 20px !important;
    line-height: 2 !important;
  }
}
.mini-post-list {
  margin: 20px 0 15px 0;
}
.mini-post-list .tag-text {
  font-weight: 200;
  /* Hux learn from
     *     TypeIsBeautiful,
     *     [This Post](http://zhuanlan.zhihu.com/ibuick/20186806) etc.
     */
  font-family: "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Arial", "PingFang SC", "Hiragino Sans GB", "STHeiti", "Microsoft YaHei", "Microsoft JhengHei", "Source Han Sans SC", "Noto Sans CJK SC", "Source Han Sans CN", "Source Han Sans TC", "Noto Sans CJK TC", "WenQuanYi Micro Hei", SimSun, sans-serif;
  line-height: 1.7;
}
.mini-post-list .post-preview {
  position: relative;
}
.mini-post-list .post-preview > a .post-title {
  font-size: 16px;
  font-weight: 500;
  margin-top: 20px;
}
.mini-post-list .post-preview > a .post-subtitle {
  font-size: 13px;
}
.mini-post-list .post-preview > .post-meta {
  position: absolute;
  right: 5px;
  bottom: 0px;
  margin: 0px;
  font-size: 12px;
  line-height: 12px;
}
@media only screen and (min-width: 768px) {
  .mini-post-list .post-preview {
    margin-left: 20px;
  }
  .mini-post-list .post-preview > a > .post-title {
    font-size: 18px;
    line-height: 1.3;
  }
  .mini-post-list .post-preview > a > .post-subtitle {
    font-size: 14px;
  }
  .mini-post-list .post-preview .post-meta {
    font-size: 18px;
  }
}
/* Tags support End*/
/* Hux make all img responsible in post-container */
.post-container img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 1.5em auto 1.6em auto;
}
/* Hux Optimize UserExperience */
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
  background-color: inherit;
}
.navbar-default .navbar-toggle:active {
  background-color: rgba(255, 255, 255, 0.25);
}
/* Hux customize Style for navBar button */
.navbar-default .navbar-toggle {
  border-color: transparent;
  padding: 19px 16px;
  margin-top: 2px;
  margin-right: 2px;
  margin-bottom: 2px;
  border-radius: 50%;
}
.navbar-default .navbar-toggle .icon-bar {
  width: 18px;
  border-radius: 0px;
  background-color: white;
}
.navbar-default .navbar-toggle .icon-bar + .icon-bar {
  margin-top: 3px;
}
.page-fullscreen .intro-header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.page-fullscreen #tag-heading {
  position: fixed;
  left: 0;
  top: 0;
  padding-bottom: 150px;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-box-pack: center;
  -webkit-box-align: center;
  display: -webkit-flex;
  -webkit-align-items: center;
  -webkit-justify-content: center;
  -webkit-flex-direction: column;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.page-fullscreen footer {
  position: absolute;
  width: 100%;
  bottom: 0;
  padding-bottom: 20px;
  opacity: 0.6;
  color: #fff;
}
.page-fullscreen footer .copyright {
  color: #fff;
}
.page-fullscreen footer .copyright a {
  color: #fff;
}
.page-fullscreen footer .copyright a:hover {
  color: #ddd;
}
.MathJax_SVG_Display {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.no-scroll {
  overflow-y: hidden;
}
#preloader {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background: radial-gradient(ellipse 90% 70% at 50% 45%, rgba(30, 44, 72, 0.98), rgba(18, 28, 50, 0.99));
  transition: opacity 1.2s ease-out, visibility 1.2s ease-out;
}
#preloader.fade-out {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#preloader .preloader-text {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 20px;
  color: rgba(225, 235, 250, 0.85);
  letter-spacing: 0.15em;
  text-shadow: 0 0 10px rgba(180, 200, 240, 0.25), 0 1px 8px rgba(0, 0, 0, 0.4);
  animation: loadPulse 1.5s ease-in-out infinite;
}
#preloader .preloader-sub {
  font-family: 'Raleway', 'Noto Sans SC', sans-serif;
  font-weight: 300;
  font-size: 11px;
  color: rgba(180, 200, 230, 0.4);
  letter-spacing: 0.12em;
  margin-top: 18px;
}
@keyframes loadPulse {
  0% {
    opacity: 0.6;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0.6;
  }
}
#bg-internal-img,
#bg-infernal-img {
  position: fixed;
  inset: 0;
  z-index: 0;
  background-size: cover;
  background-position: center 40%;
  background-repeat: no-repeat;
  transition: opacity 4s cubic-bezier(0.4, 0, 0.2, 1);
}
#bg-internal-img {
  background-image: url("/img/bg-canvas.png");
}
#bg-infernal-img {
  background-image: url("/img/bg-infernal.jpg");
  opacity: 0;
}
#bg-overlay {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 80% 36% at 50% 90%, rgba(26, 37, 56, 0.22) 0%, transparent 70%), linear-gradient(to bottom, rgba(26, 37, 48, 0.1) 0%, rgba(26, 37, 48, 0) 25%, rgba(26, 37, 48, 0.05) 50%, rgba(26, 37, 48, 0.22) 80%, rgba(26, 37, 48, 0.38) 100%);
}
#rain-container {
  opacity: 0;
  transition: opacity 2s ease-out;
  z-index: 5;
  pointer-events: none;
}
#rain-container.rain-visible {
  opacity: 1;
}
#rain-container canvas {
  position: fixed;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  width: 100vw;
  height: 100vh;
}
#ripple-canvas {
  position: fixed;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  width: 100vw;
  height: 100vh;
  opacity: 0.85;
}
#noise-overlay {
  position: fixed;
  inset: 0;
  z-index: 7;
  pointer-events: none;
  mix-blend-mode: overlay;
  opacity: 0.05;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/></svg>");
}
.navbar-custom {
  position: fixed !important;
  top: 10px !important;
  left: 28px !important;
  right: 28px !important;
  z-index: 100 !important;
  max-width: calc(100vw - 56px) !important;
  height: 44px;
  border-radius: 14px !important;
  background: rgba(25, 38, 65, 0.12) !important;
  backdrop-filter: blur(24px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.15) !important;
  border: 1px solid rgba(175, 195, 228, 0.15) !important;
  box-shadow: 0 3px 16px rgba(0, 0, 0, 0.1), 0 1px 6px rgba(132, 162, 210, 0.08) !important;
  opacity: 0;
  transform: translateY(-30px);
  transition: opacity 0.5s ease, transform 0.5s ease !important;
}
.navbar-custom.nav-visible {
  opacity: 1;
  transform: translateY(0);
}
.navbar-custom .container-fluid {
  padding: 0 16px;
  max-width: 100%;
}
.navbar-custom .navbar-brand {
  font-family: 'Cormorant Garamond', serif !important;
  font-style: normal;
  font-weight: 400 !important;
  font-size: 2.2rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em;
  color: #e0e6f2 !important;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
  padding: 10px 14px !important;
  outline: none !important;
}
.navbar-custom .navbar-brand:hover,
.navbar-custom .navbar-brand:focus,
.navbar-custom .navbar-brand:active {
  outline: none !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
.navbar-custom .nav li a {
  font-family: 'Cormorant Garamond', serif !important;
  font-size: 2rem !important;
  font-weight: 400 !important;
  letter-spacing: 0.08em;
  text-transform: none !important;
  color: #adb8d0 !important;
  padding: 6px 14px !important;
  line-height: 1.4;
  outline: none !important;
}
.navbar-custom .nav li a:hover,
.navbar-custom .nav li a:focus {
  color: #eff2fa !important;
  outline: none !important;
  box-shadow: none !important;
}
.navbar-custom .nav li a:active {
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
}
.navbar-custom .navbar-toggle {
  outline: none !important;
}
.navbar-custom .navbar-toggle:focus,
.navbar-custom .navbar-toggle:active {
  outline: none !important;
  box-shadow: none !important;
}
.navbar-custom .search-icon a {
  outline: none !important;
}
.navbar-custom .search-icon a:focus,
.navbar-custom .search-icon a:active {
  outline: none !important;
  box-shadow: none !important;
}
.post-view-title-wrap {
  text-align: center;
  padding: 120px 0 40px;
}
.post-view-title-wrap .tags {
  margin-bottom: 16px;
}
.post-view-title-wrap .tags a,
.post-view-title-wrap .tags .tag {
  border-color: rgba(165, 188, 230, 0.2);
  color: #adb8d0;
}
.post-view-title-wrap .tags a:hover,
.post-view-title-wrap .tags .tag:hover {
  border-color: #72a8d8;
  color: #eff2fa;
}
.post-view-title-wrap .post-view-title {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.4rem;
  color: #e0e6f2;
  margin-top: 0;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.4), 0 0 18px rgba(255, 255, 255, 0.25), 0 0 32px rgba(255, 255, 255, 0.1);
}
@media only screen and (min-width: 768px) {
  .post-view-title-wrap .post-view-title {
    font-size: 3rem;
  }
}
.post-view-title-wrap .subheading {
  font-family: 'Noto Serif SC', 'Spectral', serif;
  font-size: 1.1rem;
  font-weight: 300;
  color: #adb8d0;
  margin: 10px 0 0;
}
.post-view-title-wrap .meta {
  font-family: 'Noto Serif SC', 'Spectral', serif;
  font-style: italic;
  font-size: 0.9rem;
  color: #7e90b2;
  display: block;
  margin-top: 10px;
}
.page-title-wrap {
  text-align: center;
  padding: 120px 0 30px;
}
.page-title-wrap .page-view-title {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 300;
  font-size: 2.8rem;
  color: #e0e6f2;
  margin: 0;
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.4), 0 0 18px rgba(255, 255, 255, 0.25), 0 0 32px rgba(255, 255, 255, 0.1);
}
@media only screen and (min-width: 768px) {
  .page-title-wrap .page-view-title {
    font-size: 3.5rem;
  }
}
.page-title-wrap .page-view-subtitle {
  display: block;
  font-family: 'Noto Serif SC', 'Spectral', serif;
  font-style: italic;
  font-size: 1rem;
  font-weight: 300;
  color: #adb8d0;
  margin-top: 12px;
}
.glass-card {
  background: rgba(155, 180, 218, 0.1);
  border: 1px solid rgba(165, 188, 230, 0.2);
  border-radius: 16px;
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.glass-card:hover {
  border-color: rgba(175, 195, 228, 0.3);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.22);
}
@supports not (backdrop-filter: blur(1px)) {
  .glass-card {
    background: rgba(155, 180, 218, 0.25);
  }
}
nav,
article,
footer,
.container,
.intro-header {
  position: relative;
  z-index: 10;
}
a:focus,
button:focus,
[role="button"]:focus,
input:focus,
select:focus,
textarea:focus,
.btn:focus,
.p-btn:focus,
.gw-cbtn:focus,
.gw-therm:focus,
.navbar-toggle:focus,
.navbar-brand:focus,
.nav li a:focus,
.search-icon a:focus,
.panel-close:focus,
.catalog-toggle:focus,
a:active,
button:active,
[role="button"]:active,
input:active,
select:active,
textarea:active,
.btn:active,
.p-btn:active,
.gw-cbtn:active,
.gw-therm:active,
.navbar-toggle:active,
.navbar-brand:active,
.nav li a:active,
.search-icon a:active,
.panel-close:active,
.catalog-toggle:active,
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.btn:focus-visible,
.p-btn:focus-visible,
.gw-cbtn:focus-visible,
.gw-therm:focus-visible,
.navbar-toggle:focus-visible,
.navbar-brand:focus-visible,
.nav li a:focus-visible,
.search-icon a:focus-visible,
.panel-close:focus-visible,
.catalog-toggle:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
body:not(.home-page) #bg-internal-img {
  filter: brightness(0.35) saturate(0.6);
}
body:not(.home-page) #bg-overlay {
  background: radial-gradient(ellipse 80% 36% at 50% 90%, rgba(10, 16, 32, 0.5) 0%, transparent 70%), linear-gradient(to bottom, rgba(10, 16, 32, 0.55) 0%, rgba(10, 16, 32, 0.45) 30%, rgba(10, 16, 32, 0.6) 60%, rgba(10, 16, 32, 0.75) 100%);
}
body:not(.home-page) #ripple-canvas {
  opacity: 0.5;
}
.intro-header .site-heading h1,
.intro-header .post-heading h1,
.intro-header .page-heading h1,
.post-preview .post-title,
.post-view-title {
  text-shadow: 0 0 8px rgba(255, 255, 255, 0.4), 0 0 18px rgba(255, 255, 255, 0.25), 0 0 32px rgba(255, 255, 255, 0.1);
}
#music-mini {
  position: fixed;
  bottom: 24px;
  left: 24px;
  z-index: 90;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-radius: 28px;
  background: rgba(155, 180, 218, 0.1);
  border: 1px solid rgba(165, 188, 230, 0.2);
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  cursor: pointer;
  max-width: 220px;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
#music-mini.visible {
  opacity: 1;
  transform: translateY(0);
}
#music-mini:hover {
  background: rgba(175, 195, 228, 0.15);
}
#music-mini .mini-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
  color: #72a8d8;
  line-height: 1;
}
#music-mini .mini-title {
  font-size: 0.72rem;
  color: #adb8d0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#music-panel {
  position: fixed;
  bottom: 24px;
  left: 24px;
  z-index: 91;
  width: 320px;
  max-width: calc(100vw - 48px);
  padding: 20px;
  box-sizing: border-box;
  border-radius: 20px;
  background: rgba(155, 180, 218, 0.1);
  border: 1px solid rgba(165, 188, 230, 0.2);
  backdrop-filter: blur(24px) saturate(1.5);
  -webkit-backdrop-filter: blur(24px) saturate(1.5);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px) scale(0.95);
  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1), transform 0.35s cubic-bezier(0.4, 0, 0.2, 1), visibility 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  text-align: center;
}
#music-panel.show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.panel-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}
.panel-header h4 {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 300;
  font-size: 1.05rem;
  color: #b2c0d8;
  margin: 0;
}
.panel-close {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid rgba(165, 188, 230, 0.2);
  background: none;
  color: #adb8d0;
  cursor: pointer;
  padding: 0;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: color 0.2s, border-color 0.2s;
}
.panel-close:hover {
  color: #eff2fa;
  border-color: #72a8d8;
}
.panel-close svg {
  display: block;
}
#visualizer-canvas {
  width: 100%;
  height: 48px;
  border-radius: 8px;
  margin-bottom: 12px;
  background: rgba(0, 0, 0, 0.12);
  display: block;
}
.now-playing {
  font-size: 0.8rem;
  color: #cdd6ea;
  text-align: center;
  margin-bottom: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-family: 'Raleway', 'Noto Sans SC', sans-serif;
}
.progress-bar {
  width: 100%;
  height: 6px;
  border-radius: 3px;
  background: rgba(175, 195, 228, 0.12);
  margin-bottom: 4px;
  cursor: pointer;
  position: relative;
  transition: height 0.2s;
}
.progress-bar:hover {
  height: 8px;
}
.progress-fill {
  height: 100%;
  border-radius: 3px;
  background: linear-gradient(90deg, #5080b0, #72a8d8);
  width: 0%;
  transition: width 0.1s linear;
  position: relative;
}
.progress-handle {
  position: absolute;
  right: -6px;
  top: 50%;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #eff2fa;
  border: 2px solid #72a8d8;
  transform: translateY(-50%) scale(0);
  transition: transform 0.2s;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
  pointer-events: none;
}
.progress-bar:hover .progress-handle,
.progress-bar:active .progress-handle {
  transform: translateY(-50%) scale(1);
}
.player-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  box-sizing: border-box;
  margin-top: 14px;
  margin-bottom: 8px;
}
.player-controls .p-btn {
  margin: 0 6px;
}
.player-controls .p-btn:first-child {
  margin-left: 0;
}
.player-controls .p-btn:last-child {
  margin-right: 0;
}
@supports (gap: 1px) {
  .player-controls {
    gap: 12px;
  }
  .player-controls .p-btn {
    margin: 0;
  }
}
.p-btn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(165, 188, 230, 0.2);
  background: rgba(155, 180, 218, 0.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #e0e6f2;
  cursor: pointer;
  padding: 0;
  margin: 0;
  flex-shrink: 0;
  box-sizing: border-box;
  -webkit-appearance: none;
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  transition: background 0.2s, border-color 0.2s, color 0.2s;
}
.p-btn:hover {
  background: rgba(175, 195, 228, 0.2);
  color: #eff2fa;
  border-color: rgba(175, 195, 228, 0.3);
}
.p-btn:focus,
.p-btn:active,
.p-btn:focus-visible {
  outline: none;
  box-shadow: none;
}
.p-btn svg {
  display: block;
  pointer-events: none;
}
.p-btn.play-btn {
  width: 42px;
  height: 42px;
  background: rgba(114, 168, 216, 0.25);
  border-color: rgba(114, 168, 216, 0.4);
}
.p-btn.play-btn:hover {
  background: rgba(114, 168, 216, 0.4);
}
.playlist-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 0.7rem;
  color: #7e90b2;
  letter-spacing: 0.05em;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid rgba(175, 195, 228, 0.1);
}
.playlist-count {
  font-family: monospace;
}
.playlist {
  max-height: 160px;
  overflow-y: auto;
  margin-top: 6px;
}
.playlist::-webkit-scrollbar {
  width: 4px;
}
.playlist::-webkit-scrollbar-track {
  background: transparent;
}
.playlist::-webkit-scrollbar-thumb {
  background: rgba(175, 195, 228, 0.2);
  border-radius: 2px;
}
.playlist-empty {
  text-align: center;
  font-size: 0.72rem;
  color: #7e90b2;
  padding: 16px 0;
  font-style: italic;
}
.playlist-item {
  padding: 7px 10px;
  border-radius: 8px;
  font-size: 0.75rem;
  color: #adb8d0;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
  display: flex;
  align-items: center;
  gap: 8px;
}
.playlist-item:hover {
  background: rgba(175, 195, 228, 0.08);
  color: #eff2fa;
}
.playlist-item.active {
  color: #72a8d8;
  background: rgba(114, 168, 216, 0.1);
}
.playlist-item .pl-idx {
  width: 20px;
  text-align: center;
  font-size: 0.65rem;
  font-family: monospace;
  color: #7e90b2;
  flex-shrink: 0;
}
.playlist-item.active .pl-idx {
  color: #72a8d8;
}
.playlist-item .pl-name {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.playlist-item .pl-icon {
  font-size: 0.5rem;
  color: #72a8d8;
  flex-shrink: 0;
  letter-spacing: 1px;
}
.post-preview {
  background: rgba(155, 180, 218, 0.1);
  border: 1px solid rgba(165, 188, 230, 0.2);
  border-radius: 16px;
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  padding: 22px 26px;
  margin-bottom: 16px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.post-preview:hover {
  border-color: rgba(175, 195, 228, 0.3);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.22);
}
.post-preview > a {
  text-decoration: none;
}
.post-preview > a > .post-title {
  font-family: 'Cormorant Garamond', 'Noto Serif SC', 'Times New Roman', serif;
  font-weight: 300;
  font-style: italic;
  font-size: 2rem;
}
.post-preview > a > .post-subtitle {
  color: #adb8d0;
  margin-top: 6px;
}
.post-preview > .post-title {
  font-family: 'Cormorant Garamond', 'Noto Serif SC', 'Times New Roman', serif;
  font-weight: 300;
  font-style: italic;
  font-size: 2rem;
  color: #e0e6f2;
}
.post-preview > .post-subtitle {
  color: #adb8d0;
  margin-top: 6px;
  font-size: 15px;
}
@media only screen and (min-width: 768px) {
  .post-preview > .post-subtitle {
    font-size: 16px;
  }
}
.post-preview > .post-meta {
  color: #7e90b2;
  font-size: 1.05rem;
  font-style: italic;
  margin-top: 8px;
  margin-bottom: 0;
  text-align: left;
}
.post-preview hr {
  border-color: rgba(165, 188, 230, 0.2);
  margin: 10px 0 0;
}
.post-preview:hover {
  background: rgba(114, 168, 216, 0.15);
  border-color: #72a8d8;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3), 0 0 20px rgba(114, 168, 216, 0.2);
  transform: translateY(-2px);
}
.post-preview:hover > .post-title,
.post-preview:hover > a > .post-title {
  color: #eff2fa;
}
.mini-post-list .post-preview {
  padding: 18px 22px;
}
.mini-post-list .post-preview > a > .post-title,
.mini-post-list .post-preview > .post-title {
  font-size: 2rem;
}
.mini-post-list .post-preview > .post-subtitle {
  font-size: 13px;
}
@media only screen and (min-width: 768px) {
  .mini-post-list .post-preview > .post-subtitle {
    font-size: 14px;
  }
}
.mini-post-list .post-preview > .post-meta {
  font-size: 1.05rem;
  text-align: left;
}
.mini-post-list .post-preview hr {
  border-color: rgba(165, 188, 230, 0.2);
  margin: 10px 0 0;
}
.search-result-card,
.search-page .post-preview {
  padding: 16px 20px;
}
.search-result-card > .post-title,
.search-page .post-preview > .post-title {
  font-size: 1.3rem;
}
.search-result-card > .post-subtitle,
.search-page .post-preview > .post-subtitle {
  font-size: 0.9rem;
}
.search-result-card hr,
.search-page .post-preview hr {
  display: none;
}
#tag_cloud a,
#tag_cloud .tag {
  background: rgba(155, 180, 218, 0.1) !important;
  border: 1px solid rgba(165, 188, 230, 0.2) !important;
  color: #adb8d0 !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
#tag_cloud a:hover,
#tag_cloud .tag:hover,
#tag_cloud a:active,
#tag_cloud .tag:active,
#tag_cloud a.focus,
#tag_cloud .tag.focus {
  background: #5080b0 !important;
  color: #eff2fa !important;
  border-color: #72a8d8 !important;
}
#tag_cloud a.tag-button--all,
#tag_cloud .tag.tag-button--all {
  color: #72a8d8 !important;
}
#tag_cloud a.tag-button--all:hover,
#tag_cloud .tag.tag-button--all:hover,
#tag_cloud a.tag-button--all:active,
#tag_cloud .tag.tag-button--all:active,
#tag_cloud a.tag-button--all.focus,
#tag_cloud .tag.tag-button--all.focus {
  background: #5080b0 !important;
  color: #eff2fa !important;
}
.pager li > a,
.pager li > span {
  background: rgba(155, 180, 218, 0.1) !important;
  border: 1px solid rgba(165, 188, 230, 0.2) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  color: #adb8d0 !important;
}
.pager li > a:hover,
.pager li > a:focus {
  background: #5080b0 !important;
  border: 1px solid #5080b0 !important;
  color: #eff2fa !important;
}
.pager li.disabled > a,
.pager li.disabled > span {
  background: rgba(155, 180, 218, 0.05) !important;
  color: #7e90b2 !important;
}
@media only screen and (max-width: 767px) {
  .navbar-default .navbar-collapse {
    background: rgba(25, 38, 65, 0.55) !important;
    backdrop-filter: blur(24px) saturate(1.4) !important;
    -webkit-backdrop-filter: blur(24px) saturate(1.4) !important;
    border: 1px solid rgba(175, 195, 228, 0.2) !important;
    border-radius: 14px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2) !important;
    padding: 10px 16px !important;
    margin-top: 6px !important;
  }
  .navbar-default .navbar-collapse .nav li a {
    color: #e0e6f2 !important;
    font-size: 1.1rem !important;
    padding: 10px 14px !important;
  }
  .navbar-default .navbar-collapse .nav li a:hover,
  .navbar-default .navbar-collapse .nav li a:focus {
    color: #eff2fa !important;
    background: rgba(114, 168, 216, 0.15) !important;
    border-radius: 8px;
  }
  .navbar-default .navbar-collapse .search-icon a {
    color: #e0e6f2 !important;
  }
}
pre {
  background: rgba(20, 28, 48, 0.6) !important;
  border: 1px solid rgba(165, 188, 230, 0.2);
  border-radius: 8px;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
code {
  background: rgba(80, 128, 176, 0.15);
  color: #72a8d8;
  border-radius: 3px;
  padding: 1px 5px;
}
pre code {
  background: transparent;
  color: #e0e6f2;
  padding: 0;
}
blockquote {
  border-left: 3px solid #5080b0;
  color: #adb8d0;
  background: rgba(80, 128, 176, 0.08);
  padding: 10px 20px;
  border-radius: 0 8px 8px 0;
}
select.sel-lang {
  background: rgba(155, 180, 218, 0.1) !important;
  color: #e0e6f2 !important;
  border-color: rgba(165, 188, 230, 0.2) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
select.sel-lang option {
  background: #263050;
  color: #e0e6f2;
}
table.table > tbody th,
table.table > tbody td,
table.table > thead th,
table.table > thead td {
  border-color: rgba(165, 188, 230, 0.2) !important;
}
hr.small {
  border-color: #72a8d8;
}
.search-page {
  z-index: 100001 !important;
  background: rgba(18, 28, 48, 0.88) !important;
  backdrop-filter: blur(24px) saturate(1.2);
  -webkit-backdrop-filter: blur(24px) saturate(1.2);
  pointer-events: none;
  transition: transform 400ms cubic-bezier(0.32, 1, 0.23, 1), opacity 400ms cubic-bezier(0.32, 1, 0.23, 1) !important;
}
.search-page.search-active {
  pointer-events: auto;
  transform: translate(0, 0) scale(1, 1) !important;
  opacity: 1 !important;
}
.search-page #search-input {
  color: #e0e6f2 !important;
  background: transparent;
}
.search-page #search-input::placeholder {
  color: #7e90b2;
}
.search-page .search-result-list a,
.search-page #search-results a {
  color: #e0e6f2;
}
.search-page .search-result-list a:hover,
.search-page #search-results a:hover {
  color: #72a8d8;
}
.search-page .search-icon-close-container {
  z-index: 100 !important;
}
.search-page .search-icon-close {
  color: #e0e6f2 !important;
  pointer-events: auto !important;
  -webkit-tap-highlight-color: rgba(114, 168, 216, 0.3);
}
.search-page .search-icon-close:active {
  background: rgba(114, 168, 216, 0.2);
}
.search-page #search-results {
  padding-top: 18px;
}
.search-page #search-results .post-preview {
  background: rgba(155, 180, 218, 0.1);
  border: 1px solid rgba(165, 188, 230, 0.2);
  border-radius: 16px;
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.18);
  transition: border-color 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1), background 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  padding: 16px 20px;
  margin-bottom: 10px;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.search-page #search-results .post-preview:hover {
  border-color: rgba(175, 195, 228, 0.3);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.22);
}
.search-page #search-results .post-preview hr {
  display: none;
}
.search-page #search-results .post-preview .post-title {
  color: #e0e6f2;
  font-size: 1.3rem;
  font-family: 'Cormorant Garamond', 'Noto Serif SC', 'Times New Roman', serif;
  font-weight: 300;
  font-style: italic;
}
.search-page #search-results .post-preview .post-subtitle {
  color: #adb8d0;
}
.search-page #search-results .post-preview:hover {
  background: rgba(114, 168, 216, 0.15);
  border-color: #72a8d8;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3), 0 0 20px rgba(114, 168, 216, 0.2);
  transform: translateY(-1px);
}
.search-page #search-results .post-preview:hover .post-title {
  color: #eff2fa;
}
footer .copyright {
  color: #7e90b2;
}
footer .copyright a {
  color: #72a8d8 !important;
}
footer .list-inline a {
  color: #adb8d0;
}
footer .list-inline a:hover {
  color: #72a8d8;
}
.navbar-brand {
  font-family: 'Cormorant Garamond', 'Noto Serif SC', 'Times New Roman', serif;
  font-style: italic;
  font-weight: 300;
}
.post-container a {
  color: #72a8d8;
  border-bottom: 1px dashed #5080b0;
}
.post-container a:hover,
.post-container a:focus {
  color: #eff2fa;
}
#splash {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  background: transparent;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.splash-glow {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: radial-gradient(ellipse 120% 95% at 74% 16%, rgba(186, 212, 247, 0.22) 0%, rgba(176, 204, 242, 0.1) 34%, transparent 66%), radial-gradient(ellipse 90% 40% at 50% 88%, rgba(130, 162, 210, 0.18) 0%, rgba(130, 162, 210, 0.07) 42%, transparent 72%), linear-gradient(to bottom, transparent 38%, rgba(148, 180, 228, 0.08) 66%, transparent 92%), linear-gradient(to bottom, rgba(150, 184, 234, 0.22) 0%, rgba(126, 162, 216, 0.18) 50%, rgba(106, 142, 200, 0.16) 100%);
  animation: splashDawn 58s ease-in-out infinite alternate;
}
@keyframes splashDawn {
  0% {
    opacity: 0.88;
    filter: brightness(1) saturate(1.03);
  }
  100% {
    opacity: 1;
    filter: brightness(1.08) saturate(1.06);
  }
}
.splash-content {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 2;
  pointer-events: none;
  width: 100%;
  height: 100%;
}
.splash-left {
  position: relative;
  z-index: 2;
  margin-left: clamp(60px, 8vw, 180px);
  max-width: 420px;
  pointer-events: auto;
}
.splash-left-rule {
  width: 36px;
  height: 0.5px;
  background: rgba(214, 232, 252, 0.65);
  margin-bottom: 26px;
  box-shadow: 0 0 8px rgba(160, 200, 250, 0.35), 0 0 16px rgba(120, 170, 240, 0.15);
  animation: splashSlideRight 1.2s ease-out both;
}
@keyframes splashSlideRight {
  from {
    opacity: 0;
    width: 0;
  }
  to {
    opacity: 1;
    width: 36px;
  }
}
.splash-sign {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 12px;
  font-weight: 300;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(214, 229, 250, 0.82);
  margin: 0 0 14px;
  position: relative;
  z-index: 1;
  text-shadow: 0 1px 10px rgba(0, 0, 0, 0.72), 0 0 20px rgba(0, 0, 0, 0.32), 0 0 4px rgba(140, 180, 240, 0.22);
  animation: splashFadeUp 1s ease-out 0.1s both;
}
.splash-sign-name {
  font-family: 'Great Vibes', cursive;
  font-style: normal;
  text-transform: none;
  font-size: 25px;
  line-height: 1;
  letter-spacing: 0.01em;
  color: rgba(234, 243, 255, 0.96);
  text-shadow: 0 1px 12px rgba(0, 0, 0, 0.55), 0 0 22px rgba(120, 160, 220, 0.35), 0 0 5px rgba(200, 225, 255, 0.18);
  vertical-align: -3px;
  margin-left: 2px;
}
@keyframes splashFadeUp {
  from {
    opacity: 0;
    transform: translateY(16px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
.home-title {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: 2.6rem;
  font-weight: 300;
  letter-spacing: 0.02em;
  color: rgba(242, 247, 255, 0.96);
  margin: 0 0 12px;
  text-shadow: 0 2px 14px rgba(4, 12, 34, 0.84), 0 0 22px rgba(150, 190, 245, 0.48), 0 0 36px rgba(120, 160, 230, 0.25);
  animation: splashFadeUp 1s ease-out 0.3s both;
}
.home-subtitle {
  font-family: 'Noto Serif SC', 'Spectral', serif;
  font-style: italic;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.8;
  color: rgba(228, 239, 252, 0.78);
  margin: 0 0 36px;
  letter-spacing: 0.03em;
  text-shadow: 0 1px 12px rgba(4, 10, 26, 0.76), 0 0 20px rgba(0, 0, 0, 0.32);
  animation: splashFadeUp 1s ease-out 0.5s both;
}
.home-recent {
  animation: splashFadeUp 1s ease-out 0.7s both;
}
.home-recent-label {
  font-family: 'Raleway', 'Noto Sans SC', sans-serif;
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: rgba(225, 238, 252, 0.45);
  margin: 0 0 12px;
  text-shadow: 0 1px 5px rgba(8, 16, 34, 0.5);
}
.home-recent-item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 8px 0;
  text-decoration: none;
  border-bottom: 1px solid rgba(175, 195, 228, 0.08);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.home-recent-item:hover {
  border-bottom-color: rgba(114, 168, 216, 0.3);
}
.home-recent-item:hover .home-recent-title {
  color: #f2f7ff;
}
.home-recent-title {
  font-family: 'Cormorant Garamond', 'Noto Serif SC', serif;
  font-size: 14px;
  font-weight: 400;
  font-style: italic;
  color: rgba(214, 229, 250, 0.82);
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.5);
  transition: color 0.3s;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 70%;
}
.home-recent-date {
  font-family: 'Raleway', sans-serif;
  font-size: 11px;
  font-weight: 300;
  letter-spacing: 0.08em;
  color: rgba(180, 200, 230, 0.5);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
:root {
  --gw-ar: 1.6;
  --gw-h: 100vh;
  --gw-w: 100vw;
  --gwfx: 0px;
  --gwfy: 0px;
}
#gw-slot {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: var(--gw-w);
  height: var(--gw-h);
  transition: opacity 0.5s ease, visibility 0.5s ease, filter 0.45s ease;
}
#gw-slot.gw-off {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
#gw-pane {
  position: absolute;
  inset: 0;
  overflow: hidden;
  cursor: crosshair;
  -webkit-mask-image: none;
  mask-image: none;
}
.gw-ly {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}
.gw-img {
  z-index: 1;
  background-size: cover;
  background-position: center;
  opacity: 0 !important;
  /* 不显示画窗自己的背景图，由全局 #bg-internal-img 提供 */
  transition: opacity 1.1s ease;
  filter: saturate(0.92) brightness(0.97);
}
#gw-slot.gw-has-img .gw-img {
  opacity: 0 !important;
}
#gw-ripple {
  z-index: 1;
  opacity: 0;
  transition: opacity 1.1s ease;
}
#gw-slot.gw-rippling #gw-ripple {
  opacity: 1;
}
#gw-slot.gw-gloss #gw-ripple {
  mix-blend-mode: overlay;
}
.gw-grade-c {
  z-index: 2;
  background: #3a5587;
  mix-blend-mode: color;
  opacity: 0 !important;
  transition: opacity 1.2s ease;
}
#gw-slot.gw-has-img .gw-grade-c {
  opacity: 0 !important;
}
.gw-grade-s {
  z-index: 2;
  background: linear-gradient(168deg, rgba(198, 218, 248, 0.16) 0%, rgba(14, 26, 50, 0.3) 80%);
  mix-blend-mode: soft-light;
  opacity: 0 !important;
  transition: opacity 1.2s ease;
}
#gw-slot.gw-has-img .gw-grade-s {
  opacity: 0 !important;
}
.gw-frost {
  z-index: 3;
  opacity: 0.55;
  transition: opacity 0.4s ease;
  background: linear-gradient(rgba(16, 28, 54, 0.06), rgba(16, 28, 54, 0.06)), linear-gradient(150deg, rgba(184, 204, 236, 0.07) 0%, rgba(112, 136, 178, 0.04) 52%, rgba(86, 108, 150, 0.07) 100%);
}
.gw-noise {
  z-index: 3;
  mix-blend-mode: overlay;
  opacity: 0.05;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='saturate' values='0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/></svg>");
}
.gw-depth {
  z-index: 3;
  background: radial-gradient(130% 160% at 50% 46%, rgba(12, 22, 44, 0) 46%, rgba(12, 22, 44, 0.18) 76%, rgba(12, 22, 44, 0.34) 100%);
}
#gw-fogwipe {
  z-index: 4;
}
#gw-draw {
  position: absolute;
  inset: 0;
  z-index: 6;
  width: 100%;
  height: 100%;
  touch-action: none;
  display: block;
}
.gw-ctrl {
  position: absolute;
  right: calc(28px);
  top: calc(80px);
  z-index: 8;
  display: flex;
  gap: 8px;
}
.gw-cbtn {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
  border: 1px solid rgba(190, 212, 244, 0.16);
  color: rgba(232, 242, 255, 0.78);
  background: rgba(160, 190, 235, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
  outline: none;
  transition: all 0.35s ease;
}
.gw-cbtn:hover {
  color: #fff;
  border-color: rgba(212, 230, 252, 0.34);
  background: rgba(190, 214, 248, 0.2);
  box-shadow: 0 0 12px rgba(170, 205, 250, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.gw-cbtn:active,
.gw-cbtn:focus {
  outline: none;
  border-color: rgba(190, 212, 244, 0.16);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
}
.gw-cbtn.active {
  color: rgba(255, 255, 255, 0.95);
  border-color: rgba(212, 230, 252, 0.34);
  background: rgba(190, 214, 248, 0.18);
  box-shadow: 0 0 12px rgba(170, 205, 250, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.18);
}
.gw-cbtn svg {
  width: 16px;
  height: 16px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
  position: relative;
  z-index: 1;
}
.gw-therm {
  outline: none;
}
.gw-therm:focus,
.gw-therm:active {
  outline: none;
}
.gw-therms {
  position: absolute;
  right: 28px;
  bottom: 24px;
  z-index: 8;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
}
.gw-therm {
  display: flex;
  align-items: center;
  gap: 11px;
  pointer-events: auto;
  cursor: ew-resize;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
}
.gw-therm-label {
  width: 46px;
  text-align: right;
  font-family: 'Raleway', 'Noto Sans SC', sans-serif;
  font-weight: 400;
  font-size: 9px;
  letter-spacing: 0.24em;
  color: rgba(225, 238, 252, 0.55);
  text-shadow: 0 1px 5px rgba(8, 16, 34, 0.5);
}
.gw-therm-body {
  position: relative;
  width: 152px;
  height: 16px;
  filter: drop-shadow(0 1px 4px rgba(8, 16, 34, 0.35));
}
.gw-therm-bulb {
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
  border-radius: 50%;
  border: 1px solid rgba(198, 220, 250, 0.32);
  background: radial-gradient(circle at 36% 32%, rgba(235, 246, 255, 0.85), rgba(186, 216, 252, 0.55) 55%, rgba(150, 185, 235, 0.35));
  box-shadow: 0 0 9px rgba(178, 212, 255, 0.5), inset 0 -1px 2px rgba(20, 40, 80, 0.25);
  transition: opacity 0.2s ease;
}
.gw-therm-tube {
  position: absolute;
  left: 12px;
  right: 0;
  top: 50%;
  height: 6px;
  transform: translateY(-50%);
  border-radius: 0 3px 3px 0;
  border: 1px solid rgba(190, 212, 244, 0.24);
  border-left: none;
  background: rgba(150, 180, 225, 0.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.1), inset 0 -1px 1px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}
.gw-therm-tube::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(90deg, transparent 0 27px, rgba(228, 242, 255, 0.3) 27px 28px);
}
.gw-therm-fill {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 35%;
  border-radius: 0 3px 3px 0;
  background: linear-gradient(90deg, rgba(186, 218, 255, 0.5), rgba(228, 243, 255, 0.88));
  box-shadow: 0 0 8px rgba(178, 212, 255, 0.65);
}
.gw-therm-val {
  min-width: 42px;
  font-family: 'Raleway', 'Noto Sans SC', sans-serif;
  font-weight: 300;
  font-size: 11px;
  letter-spacing: 0.1em;
  font-variant-numeric: tabular-nums;
  color: rgba(231, 242, 255, 0.78);
  text-shadow: 0 1px 6px rgba(8, 16, 34, 0.55), 0 0 12px rgba(160, 200, 255, 0.18);
}
.gw-therm:hover .gw-therm-bulb {
  box-shadow: 0 0 13px rgba(186, 218, 255, 0.75), inset 0 -1px 2px rgba(20, 40, 80, 0.25);
}
.gw-therm:hover .gw-therm-tube {
  border-color: rgba(212, 230, 252, 0.38);
}
@media (max-width: 900px) {
  #gw-slot {
    display: none;
  }
  .splash-left {
    margin-left: clamp(24px, 6%, 80px);
    max-width: 90%;
  }
  .home-title {
    font-size: 1.8rem;
  }
}