/*
 * Oyiso Halo visual layer
 * Keep the original Oyiso layout rules and replace only the light palette
 * plus the few typography rules that materially improve long-form reading.
 */
:root {
  --theme-color-pri: #c87552;
  --theme-color-sub: #b48668;
  --theme-color-op70: rgba(200, 117, 82, .70);
  --theme-color-op50: rgba(200, 117, 82, .50);
  --theme-color-op30: rgba(200, 117, 82, .30);
  --theme-color-op20: rgba(200, 117, 82, .20);
  --theme-color-op15: rgba(200, 117, 82, .15);
  --theme-color-op10: rgba(200, 117, 82, .10);
  --theme-color-op05: rgba(200, 117, 82, .05);
  --html: #f5f0e8;
  --container: #fbf8f3;
  --header: rgba(251, 248, 243, .84);
  --header-m: #fbf8f3;
  --border-header: #ebe4da;
  --border-menu: #e8e0d6;
  --border-box: #e7dfd5;
  --border-pagination: #fffdf9;
  --border-hr: rgba(76, 62, 51, .16);
  --border-table: #ded4c8;
  --border-copyright: #e2d8cc;
  --bgc-box: #fffdf9;
  --bgc-single: #f8f4ee;
  --bgc-footer: #f0ebe3;
  --bgc-search-m: #f0ebe3;
  --bgc-menu: #fffdf9;
  --bgc-comment-bubble: #fffdf9;
  --text: #2e2924;
  --text-menu: #4d453e;
  --text-menu-hover: #776b61;
  --text-excerpt: #796f67;
  --text-footer: #81776e;
  --text-cc: #4d453e;
  --text-cc-logo: #e4dbd0;
  --text-svg: #71665d;
  --text-quote: #5d5148;
  --font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --halo-search-widget-base-font-family: var(--font-family);
  --halo-search-widget-base-rounded: 14px;
  --halo-search-widget-base-bg-color: #fffdf9;
  --halo-search-widget-primary-color: #c87552;
  --halo-search-widget-muted-color: #81776e;
  --halo-search-widget-content-color: #2e2924;
  --halo-search-widget-modal-bg-color: #fffdf9;
  --halo-search-widget-modal-layer-color: rgba(46, 41, 36, .42);
  --halo-search-widget-hit-bg-color: #f5f0e8;
  --halo-search-widget-divider-color: #e2d8cc;
  --halo-search-widget-kbd-border-color: #ded4c8;
  --halo-search-widget-kbd-shadow: 0 2px 0 #ded4c8;
}

html,
body,
button,
input,
textarea {
  font-family: var(--font-family);
}

/* The original mobile header relies on a CSS reset that WordPress supplied.
 * Halo still applies the browser button face, which is why the hamburger and
 * account controls otherwise show as pale square buttons in the preview. */
.oyiso-halo header .menu-btn,
.oyiso-halo header .search-trigger,
.oyiso-halo header .nav-menu .user .box,
.oyiso-halo header .nav-menu .toc-btn {
  appearance: none;
  -webkit-appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
}

.oyiso-halo header .menu-btn > * {
  background-color: var(--text);
}

.oyiso-halo header .right > * svg {
  color: var(--text-menu);
}

.oyiso-halo {
  --theme-color-op70: color-mix(in srgb, var(--theme-color-pri) 70%, transparent);
  --theme-color-op50: color-mix(in srgb, var(--theme-color-pri) 50%, transparent);
  --theme-color-op30: color-mix(in srgb, var(--theme-color-pri) 30%, transparent);
  --theme-color-op20: color-mix(in srgb, var(--theme-color-pri) 20%, transparent);
  --theme-color-op15: color-mix(in srgb, var(--theme-color-pri) 15%, transparent);
  --theme-color-op10: color-mix(in srgb, var(--theme-color-pri) 10%, transparent);
  --theme-color-op05: color-mix(in srgb, var(--theme-color-pri) 5%, transparent);
}

.oyiso-halo main .post-content .content {
  font-size: 17px;
  line-height: 1.9;
  letter-spacing: .012em;
}

.oyiso-halo main .post-content .content > p {
  margin-top: 1.15em;
  margin-bottom: 1.15em;
}

.oyiso-halo main .post-content .content h1,
.oyiso-halo main .post-content .content h2,
.oyiso-halo main .post-content .content h3,
.oyiso-halo main .post-content .content h4 {
  color: var(--text);
  letter-spacing: -.018em;
}

.oyiso-halo main .post-content .content blockquote {
  border-left-color: var(--theme-color-pri);
  background-color: var(--theme-color-op05);
}

.oyiso-halo main .post-content .content pre {
  border: 1px solid var(--border-box);
  box-shadow: 0 12px 30px rgba(74, 57, 43, .06);
}

.oyiso-halo main .post-content .content img {
  border-radius: 12px;
  max-width: 100%;
  height: auto;
}

.oyiso-halo main .post-content .content pre {
  max-width: 100%;
  overflow-x: auto;
}

.oyiso-halo main .post-info .category a {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.oyiso-halo main .popular ul li .cover .pic-box {
  width: 100%;
  height: 100%;
}

.oyiso-halo main .popular ul li .cover .pic-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.oyiso-halo .halo-comment-slot {
  width: 400px;
  margin: 0;
  padding: 0;
}

.oyiso-halo .post-comments .comment-top .close {
  border: 0;
  padding: 0;
  background: transparent;
  font: inherit;
}

.oyiso-halo .post-comments .halo-comment-content {
  position: relative;
  width: 100%;
  height: 100%;
}

.oyiso-halo .post-comments comment-widget {
  display: block;
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.oyiso-halo main .post-comments .comment-container .comment-body {
  height: calc(100% - 70px);
}

.oyiso-halo .post-comments .comment-container {
  background: rgba(255, 253, 249, .72);
  border: 1px solid rgba(74, 57, 43, .12);
  box-shadow: 0 18px 42px rgba(74, 57, 43, .12);
  -webkit-backdrop-filter: blur(24px) saturate(1.08);
  backdrop-filter: blur(24px) saturate(1.08);
}

.oyiso-halo .post-comments .comment-body {
  overflow: hidden;
}

.oyiso-halo .comment-policy-hint {
  margin: 0;
  padding: 10px 20px;
  border-bottom: 1px solid var(--border-hr);
  color: var(--text-excerpt);
  font-size: 12px;
  line-height: 1.65;
}

/* The comment widget renders inside a shadow root. These variables are the
 * widget's public theme contract; map them to the theme palette so text and
 * controls remain readable when the site switches to dark mode. */
.oyiso-halo .halo-comment-slot {
  --halo-cw-primary-1-color: #c87552;
  --halo-cw-primary-2-color: #a95d3f;
  --halo-cw-primary-3-color: #f0c1aa;
  --halo-cw-text-1-color: #2b2520;
  --halo-cw-text-2-color: #4e443c;
  --halo-cw-text-3-color: #766a60;
  --halo-cw-muted-1-color: #d8cec3;
  --halo-cw-muted-2-color: #e8dfd5;
  --halo-cw-muted-3-color: #f4efe9;
  --halo-cw-emoji-picker-rgb-color: 43, 37, 32;
  --halo-cw-emoji-picker-rgb-accent: 200, 117, 82;
  --halo-cw-emoji-picker-rgb-background: 255, 252, 248;
  --halo-cw-emoji-picker-rgb-input: 255, 252, 248;
  --halo-cw-emoji-picker-color-border: rgba(74, 57, 43, .12);
  --halo-cw-emoji-picker-color-border-over: rgba(74, 57, 43, .22);
}

html[data-theme-mode="dark"] .oyiso-halo .halo-comment-slot {
  --halo-cw-primary-1-color: #e39a78;
  --halo-cw-primary-2-color: #c87552;
  --halo-cw-primary-3-color: #6d4335;
  --halo-cw-text-1-color: #f5eee6;
  --halo-cw-text-2-color: #ded2c5;
  --halo-cw-text-3-color: #b9aa9c;
  --halo-cw-muted-1-color: #65584d;
  --halo-cw-muted-2-color: #4c433c;
  --halo-cw-muted-3-color: #302b27;
  --halo-cw-emoji-picker-rgb-color: 245, 238, 230;
  --halo-cw-emoji-picker-rgb-accent: 227, 154, 120;
  --halo-cw-emoji-picker-rgb-background: 35, 31, 27;
  --halo-cw-emoji-picker-rgb-input: 35, 31, 27;
  --halo-cw-emoji-picker-color-border: rgba(245, 238, 230, .14);
  --halo-cw-emoji-picker-color-border-over: rgba(245, 238, 230, .26);
  color-scheme: dark;
}

.oyiso-halo .halo-empty {
  color: var(--text-excerpt);
  text-align: center;
  padding: 48px 20px;
}

.oyiso-halo .post-meta .screen {
  padding-top: 0;
  padding-bottom: 10px;
}

.oyiso-halo .meta-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.oyiso-halo .meta-item {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 5px 10px;
  border-radius: 999px;
  background: var(--theme-color-op10);
  color: var(--theme-color-pri);
  font-size: 13px;
}

.oyiso-halo .post-tool .likes > .like-action {
  display: flex;
  align-items: center;
  flex-direction: row;
  padding: 8px 12px;
  border-radius: 999px;
  border: 0;
  background: transparent;
  color: var(--text-menu-hover);
  font-size: 12px;
  line-height: 1.4;
  cursor: pointer;
  transition: color .2s ease, background-color .2s ease, transform .2s ease;
}

.oyiso-halo .post-tool .likes > .like-action:hover,
.oyiso-halo .post-tool .likes > .like-action.active {
  color: var(--theme-color-pri);
}

.oyiso-halo .post-tool .likes > .like-action:hover {
  background: var(--theme-color-op10);
  transform: translateY(-1px);
}

.oyiso-halo .post-tool .likes > .like-action:disabled {
  cursor: default;
}

.oyiso-halo .post-tool .likes > .like-action svg {
  font-size: 20px;
}

.oyiso-halo .post-tool .likes > .like-action p {
  margin: 0;
  font-size: 12px;
  padding: 0 2px 0 4px;
}

.oyiso-halo .post-tool .likes .like-feedback {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

html[data-theme-mode="dark"] .oyiso-halo .post-comments .comment-container {
  background: rgba(35, 31, 27, .70);
  border-color: rgba(245, 238, 230, .12);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .26);
}

.oyiso-halo .halo-comment-unavailable p {
  color: var(--text-excerpt);
  line-height: 1.8;
}

@media screen and (max-width: 650px) {
  .oyiso-halo .halo-comment-slot {
    width: 100%;
  }

  .oyiso-halo main .post-comments .comment-container .comment-body {
    height: calc(100% - 60px);
  }
}

@media screen and (max-width: 765px) {
  /* The legacy mobile stylesheet caps every .screen at 368/700px. The
   * welcome composition is the exception: it must still be edge-to-edge. */
  .oyiso-halo main .home1-bannar .screen {
    width: 100vw;
    max-width: none;
  }
}

header .nav-menu .search-trigger {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}

header .nav-menu .search-trigger:hover {
  background-color: var(--theme-color-op20);
}

.oyiso-halo .archive-description {
  max-width: 760px;
  margin: -22px auto 35px;
  color: var(--text-excerpt);
  text-align: center;
  line-height: 1.8;
}

.oyiso-halo .category-children {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0 20px 20px;
}

.oyiso-halo .category-children a {
  color: var(--theme-color-pri);
  font-size: 14px;
}

/* Home1 keeps the original full-screen welcome composition while using the
 * Halo palette for everything below the fold. */
.oyiso-halo main.home1.active header .navbar {
  border-bottom-color: transparent;
}

.oyiso-halo main.home1.active header .title a,
.oyiso-halo main.home1.active header .nav-menu .menu > li > a,
.oyiso-halo main.home1.active header .nav-menu .right > * svg {
  color: rgba(255, 255, 255, .96);
  text-shadow: 0 1px 12px rgba(0, 0, 0, .28);
}

.oyiso-halo main.home1.active header .nav-menu .menu a:hover,
.oyiso-halo main.home1.active header .nav-menu .menu > li:hover > a,
.oyiso-halo main.home1.active header .nav-menu .menu .current-menu-item > a,
.oyiso-halo main.home1.active header .nav-menu .right > *:hover svg {
  color: var(--theme-color-pri);
}

.oyiso-halo main.home1.active header .menu-btn span {
  background-color: #fff;
}

.oyiso-halo header .navbar.navbar-animated {
  animation: oyiso-navbar-drop .65s cubic-bezier(.22, 1, .36, 1) both;
}

@keyframes oyiso-navbar-drop {
  from { opacity: 0; transform: translateY(-18px); }
  to { opacity: 1; transform: translateY(0); }
}

.oyiso-halo main.home1 .home1-bannar .screen .imgbox::before {
  background: linear-gradient(to bottom, rgba(0, 0, 0, .72), transparent);
}

.oyiso-halo main.home1 .home1-bannar .screen .imgbox::after {
  background: rgba(0, 0, 0, .28);
}

.oyiso-halo main.home1 .home1-bannar .screen .imgbox .nav-news .text {
  text-shadow: 0 2px 24px rgba(0, 0, 0, .26);
}

.oyiso-halo main.home1 .home1-bannar .screen .imgbox .nav-news .text > h1,
.oyiso-halo main.home1 .home1-bannar .screen .imgbox .nav-news .text > p {
  font-family: Georgia, "Songti SC", "STSong", "Noto Serif CJK SC", serif;
}

.oyiso-halo main.home1 .home1-newest .home1-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.oyiso-halo main.home1 .home1-newest .home1-links a,
.oyiso-halo main.home1 .home1-entry-card > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 34px;
  padding: 6px 14px;
  border-radius: 999px;
  color: var(--theme-color-pri);
  background: var(--theme-color-op10);
  transition: background-color .25s, color .25s;
}

.oyiso-halo main.home1 .home1-newest .home1-links a:hover,
.oyiso-halo main.home1 .home1-entry-card > a:hover {
  color: #fff;
  background: var(--theme-color-pri);
}

.oyiso-halo main.home1 .home1-entry {
  width: 100%;
}

.oyiso-halo main.home1 .home1-entry-card {
  min-height: 100px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  border: 1px solid var(--border-box);
  border-radius: 16px;
  background: var(--bgc-box);
}

.oyiso-halo main.home1 .home1-entry-card > div {
  flex: 1;
  min-width: 0;
}

.oyiso-halo main.home1 .home1-entry-card h3 {
  color: var(--text);
  font-size: 18px;
}

.oyiso-halo main.home1 .home1-entry-card p {
  margin-top: 4px;
  color: var(--text-excerpt);
  font-size: 14px;
}

.oyiso-halo main.home1 .home1-entry-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  flex: 0 0 58px;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(135deg, var(--theme-color-pri), var(--theme-color-sub));
  font-size: 13px;
}

.oyiso-halo main.home1 .home1-newest .content .notice .notify {
  border: 1px solid var(--border-box);
  border-radius: 16px;
  background: var(--bgc-box);
  overflow: hidden;
}

.oyiso-halo main.home1 .home1-newest .content .notice .notify-header {
  padding: 16px 20px;
  border-bottom: 1px solid var(--border-box);
  color: var(--theme-color-pri);
}

.oyiso-halo main.home1 .home1-newest .content .notice .notify-body {
  max-height: 260px;
  padding: 16px 20px;
  overflow: auto;
}

.oyiso-halo main.home1 .home1-newest .content .notice .notify-body p {
  color: var(--text);
  line-height: 1.8;
  white-space: pre-line;
}

.oyiso-halo footer .run-time,
.oyiso-halo footer .icp {
  text-align: center;
}

.oyiso-halo footer .upyun {
  margin-top: 12px;
  color: var(--text-footer);
  text-align: center;
  font-size: 13px;
}

.oyiso-halo footer .upyun img {
  height: 24px;
  vertical-align: middle;
}

@media screen and (max-width: 650px) {
  .oyiso-halo main.home1 .home1-entry-card {
    align-items: flex-start;
    gap: 10px;
    padding: 14px;
  }

  .oyiso-halo main.home1 .home1-entry-card > a {
    align-self: center;
    padding-left: 10px;
    padding-right: 10px;
  }

  .oyiso-halo main.home1 .home1-entry-icon {
    width: 46px;
    height: 46px;
    flex-basis: 46px;
    border-radius: 12px;
  }
}

@media screen and (max-width: 650px) {
  .oyiso-halo main .post-content .content {
    font-size: 16px;
    line-height: 1.85;
  }

  .oyiso-halo .halo-comment-slot {
    padding-left: 16px;
    padding-right: 16px;
  }
}

@media screen and (max-width: 765px) {
  .oyiso-halo main .screen,
  .oyiso-halo main .tpl-friend.post-content .screen {
    width: calc(100vw - 48px);
    max-width: 700px;
  }
}

[data-theme-mode="dark"] {
  --html: #161311;
  --container: #161311;
  --header: rgba(28, 24, 21, .86);
  --header-m: #1c1815;
  --border-header: #342b25;
  --border-menu: #342b25;
  --border-box: #342b25;
  --border-pagination: #342b25;
  --border-hr: rgba(255, 244, 233, .14);
  --border-table: #473a31;
  --border-copyright: #473a31;
  --bgc-box: #211c18;
  --bgc-single: #191512;
  --bgc-footer: #1d1916;
  --bgc-search-m: #302821;
  --bgc-menu: #211c18;
  --bgc-comment-bubble: #2a231e;
  --text: #f5eee7;
  --text-menu: #e8ddd3;
  --text-menu-hover: #cbbbae;
  --text-excerpt: #c4b5a8;
  --text-footer: #aa9b8f;
  --text-cc: #d8c9bc;
  --text-cc-logo: #3a2f28;
  --text-svg: #b9a99b;
  --text-quote: #d5c5b8;
  --halo-search-widget-base-bg-color: #211c18;
  --halo-search-widget-primary-color: #d58a68;
  --halo-search-widget-muted-color: #aa9b8f;
  --halo-search-widget-content-color: #f5eee7;
  --halo-search-widget-modal-bg-color: #211c18;
  --halo-search-widget-modal-layer-color: rgba(0, 0, 0, .58);
  --halo-search-widget-hit-bg-color: #302821;
  --halo-search-widget-divider-color: #473a31;
  --halo-search-widget-kbd-border-color: #57473b;
  --halo-search-widget-kbd-shadow: 0 2px 0 #57473b;
}

/* Explicit card/link colors keep the inherited browser blue out of broken
 * and dark-mode states, while preserving the original card layout. */
.oyiso-halo main .lastest ul li > a,
.oyiso-halo main .popular ul li > a {
  color: var(--text);
}

.oyiso-halo main .lastest ul li > a .title,
.oyiso-halo main .popular ul li > a .title {
  color: var(--text-menu);
}

.oyiso-halo main .home1-newest .tab ul li.active {
  color: var(--theme-color-pri);
}

.oyiso-halo main .home1-newest .content .bloger .n-d .desc {
  color: var(--text-excerpt);
}