:root {
  --lyf-cyan: #51d6c3;
  --lyf-amber: #f4bd50;
  --lyf-coral: #ef7b72;
  --lyf-ink: #10171b;
  --lyf-panel: rgba(14, 20, 24, .93);
}

#blog-particles {
  position: fixed;
  inset: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: .9;
  mix-blend-mode: normal;
  filter: saturate(1.12) contrast(1.04);
  transition: opacity .25s ease;
}

body.lyf-particles-off #blog-particles {
  opacity: 0;
}

#body-wrap {
  position: relative;
  z-index: 1;
}

#oml2d-stage,
.oml2d-stage {
  left: 12px !important;
  right: auto !important;
  bottom: 0 !important;
  width: 340px !important;
  height: 500px !important;
  max-width: calc(100vw - 16px);
  max-height: calc(100vh - 8px);
  overflow: visible !important;
  touch-action: none;
  user-select: none;
  transform-origin: left bottom;
  transition: opacity .2s ease, filter .2s ease !important;
  filter: drop-shadow(0 14px 18px rgba(0, 0, 0, .16));
}

#oml2d-stage:hover,
.oml2d-stage:hover {
  filter: drop-shadow(0 16px 24px rgba(81, 214, 195, .22));
}

#oml2d-stage.lyf-live2d-grabbed,
.oml2d-stage.lyf-live2d-grabbed {
  filter: drop-shadow(0 18px 28px rgba(81, 214, 195, .32));
}

#oml2d-tips,
.oml2d-tips,
#oml2d-tips.lyf-ai-speaking,
.oml2d-tips.lyf-ai-speaking {
  box-sizing: border-box !important;
  max-width: min(250px, calc(100vw - 32px)) !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

#oml2d-tips.lyf-ai-speaking,
.oml2d-tips.lyf-ai-speaking {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: #263230 !important;
  border: 1px solid rgba(81, 214, 195, .38) !important;
  background: rgba(255, 255, 255, .96) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .2), 0 0 18px rgba(81, 214, 195, .16) !important;
}

#oml2d-tips-content {
  word-break: normal !important;
  overflow-wrap: anywhere !important;
}

.lyf-cursor {
  display: none;
}

@media (pointer: fine) {
  body.lyf-cursor-ready,
  body.lyf-cursor-ready a,
  body.lyf-cursor-ready button,
  body.lyf-cursor-ready input,
  body.lyf-cursor-ready textarea,
  body.lyf-cursor-ready select,
  body.lyf-cursor-ready [role="button"] {
    cursor: none !important;
  }

  .lyf-cursor {
    position: fixed;
    inset: 0;
    z-index: 20000;
    display: block;
    pointer-events: none;
  }

  .lyf-cursor {
    opacity: 0;
    transition: opacity .15s ease;
  }

  .lyf-cursor.is-visible {
    opacity: 1;
  }

  .lyf-cursor-tail {
    position: fixed;
    left: 0;
    top: 0;
    display: block;
    width: 38px;
    height: 50px;
    border: 0;
    background: center / contain no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 72'%3E%3Cpath d='M8 64C3 53 6 39 15 28C25 16 39 6 51 7C61 8 65 18 60 28C56 37 46 42 36 46C28 49 24 54 27 59C30 64 36 63 41 59C38 70 17 75 8 64Z' fill='%23ef833c' stroke='%23fff0d5' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M51 7C59 8 64 16 61 24C59 29 55 33 50 36C47 29 42 23 36 19C41 13 46 9 51 7Z' fill='%23fff7e8'/%3E%3Cpath d='M12 61C8 51 11 40 19 31C27 22 38 15 47 13C38 18 31 24 25 32C18 41 16 51 20 60C22 65 26 68 31 68C22 72 14 68 12 61Z' fill='%23d85f2d' opacity='.72'/%3E%3Cpath d='M28 58C31 63 37 62 42 57' fill='none' stroke='%23fff0d5' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
    filter: drop-shadow(0 0 6px rgba(240, 138, 54, .75)) drop-shadow(0 0 11px rgba(81, 214, 195, .28));
    transform: translate(-16%, -54%) rotate(-8deg);
    transform-origin: 16% 54%;
    transition: width .14s ease, height .14s ease, clip-path .14s ease, border-radius .14s ease, filter .14s ease;
    will-change: left, top;
  }

  .lyf-cursor-tail::before {
    content: '';
    position: absolute;
    left: 3px;
    top: 15px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #dffffa;
    box-shadow: 0 0 8px #51d6c3;
  }

  .lyf-cursor-spark {
    position: fixed;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    opacity: 0;
    background: #ffe1a6;
    box-shadow: 0 0 7px rgba(244, 189, 80, .9), 0 0 12px rgba(81, 214, 195, .4);
    will-change: transform, opacity;
  }

  .lyf-cursor.is-hover .lyf-cursor-tail {
    width: 39px;
    height: 52px;
    filter: brightness(1.1) saturate(1.12);
  }

  .lyf-cursor.is-down .lyf-cursor-tail {
    width: 25px;
    height: 25px;
    background: #7af4df;
    box-shadow: 0 0 16px rgba(81, 214, 195, .9);
  }

  .lyf-cursor.shape-star .lyf-cursor-tail {
    clip-path: polygon(50% 0, 61% 34%, 98% 35%, 68% 56%, 79% 94%, 50% 72%, 21% 94%, 32% 56%, 2% 35%, 39% 34%);
  }

  .lyf-cursor.shape-paw .lyf-cursor-tail {
    clip-path: polygon(18% 8%, 34% 4%, 42% 31%, 52% 1%, 67% 8%, 64% 34%, 83% 17%, 95% 31%, 77% 54%, 74% 84%, 50% 100%, 25% 84%, 22% 55%, 5% 31%);
  }

  .lyf-cursor.shape-diamond .lyf-cursor-tail {
    clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  }
}

.lyf-reading-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10002;
  width: 100%;
  height: 3px;
  pointer-events: none;
}

.lyf-reading-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: var(--lyf-cyan);
  box-shadow: 0 0 12px rgba(81, 214, 195, .72);
}

.lyf-experience {
  position: fixed;
  right: 18px;
  bottom: 18px;
  z-index: 1000;
  width: min(410px, calc(100vw - 36px));
  color: #f4f7f7;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.lyf-player {
  min-height: 100px;
  padding: 10px;
  display: grid;
  grid-template-columns: 44px 34px minmax(0, 1fr) 34px auto;
  grid-template-rows: 34px 22px 18px;
  align-items: center;
  gap: 5px 10px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 7px;
  background: var(--lyf-panel);
  box-shadow: 0 12px 34px rgba(0, 0, 0, .28);
  backdrop-filter: blur(16px);
}

.lyf-player-cover {
  grid-column: 1;
  grid-row: 1 / 4;
  width: 44px;
  height: 44px;
  border-radius: 5px;
  object-fit: cover;
  background: #232d31;
}

.lyf-player-copy {
  grid-column: 2 / 5;
  grid-row: 1;
  min-width: 0;
}

.lyf-player-controls {
  grid-column: 5;
  grid-row: 1;
}

.lyf-player-lyric {
  grid-column: 2 / 6;
  grid-row: 2;
  min-width: 0;
  overflow: hidden;
  color: rgba(255, 255, 255, .78);
  font-size: .69rem;
  line-height: 22px;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lyf-player-time {
  align-self: center;
  color: rgba(255, 255, 255, .46);
  font: 500 .6rem ui-monospace, SFMono-Regular, Consolas, monospace;
}

.lyf-player-time[data-time="current"] {
  grid-column: 2;
  grid-row: 3;
}

.lyf-player-time[data-time="duration"] {
  grid-column: 4;
  grid-row: 3;
  text-align: right;
}

.lyf-player-title,
.lyf-player-artist {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lyf-player-title {
  font-size: .82rem;
  font-weight: 700;
}

.lyf-player-artist {
  margin-top: 2px;
  color: rgba(255, 255, 255, .55);
  font-size: .68rem;
}

.lyf-player-controls,
.lyf-tool-row {
  display: flex;
  align-items: center;
  gap: 3px;
}

.lyf-experience.is-collapsed {
  width: max-content;
}

.lyf-experience.is-collapsed .lyf-player,
.lyf-experience.is-collapsed .lyf-tool-label {
  display: none;
}

.lyf-experience.is-collapsed .lyf-tool-row {
  padding: 5px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 24px;
  background: var(--lyf-panel);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .28);
  backdrop-filter: blur(16px);
}

.lyf-icon-button {
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: rgba(255, 255, 255, .72);
  background: transparent;
}

.lyf-icon-button:hover,
.lyf-icon-button:focus-visible,
.lyf-icon-button.is-active {
  color: #fff;
  background: rgba(255, 255, 255, .12);
  outline: none;
}

.lyf-icon-button.lyf-play {
  color: var(--lyf-ink);
  background: var(--lyf-cyan);
}

.lyf-player-progress {
  grid-column: 3;
  grid-row: 3;
  width: 100%;
  height: 4px;
  margin: 0;
  accent-color: var(--lyf-cyan);
}

.lyf-site-home {
  position: fixed;
  top: 18px;
  left: 18px;
  z-index: 12000;
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  color: rgba(255, 255, 255, .86);
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: 50%;
  background: rgba(19, 26, 29, .78);
  box-shadow: 0 8px 26px rgba(0, 0, 0, .25);
  backdrop-filter: blur(12px);
  text-decoration: none;
}

.lyf-site-home:hover,
.lyf-site-home:focus-visible {
  color: #10201f;
  background: var(--lyf-cyan);
  outline: none;
}

.lyf-tool-row {
  justify-content: flex-end;
  padding: 6px 4px 0;
}

.lyf-tool-label {
  margin-right: auto;
  color: rgba(255, 255, 255, .5);
  font: 600 .68rem/1.2 ui-monospace, SFMono-Regular, Consolas, monospace;
  letter-spacing: .08em;
}

.lyf-reading-panel {
  position: fixed;
  top: 72px;
  right: 18px;
  z-index: 1001;
  width: min(390px, calc(100vw - 36px));
  max-height: calc(100vh - 96px);
  padding: 18px;
  overflow: auto;
  color: #f4f7f7;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 7px;
  background: var(--lyf-panel);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .34);
  backdrop-filter: blur(18px);
  transform: translateX(calc(100% + 32px));
  opacity: 0;
  pointer-events: none;
  transition: transform .24s ease, opacity .24s ease;
}

.lyf-account-panel {
  position: fixed;
  top: 72px;
  right: 18px;
  z-index: 1120;
  width: min(360px, calc(100vw - 36px));
  max-height: calc(100vh - 96px);
  overflow: auto;
  color: #f4f7f7;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 7px;
  background: var(--lyf-panel);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .36);
  backdrop-filter: blur(18px);
  transform: translateX(calc(100% + 32px));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform .24s ease, opacity .24s ease, visibility .24s ease;
}

.lyf-search-panel,
.lyf-admin-panel {
  position: fixed;
  top: 72px;
  right: 18px;
  z-index: 1130;
  width: min(520px, calc(100vw - 36px));
  max-height: calc(100vh - 96px);
  padding: 16px;
  overflow: auto;
  color: #f4f7f7;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 7px;
  background: var(--lyf-panel);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .36);
  backdrop-filter: blur(18px);
  transform: translateX(calc(100% + 32px));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform .24s ease, opacity .24s ease, visibility .24s ease;
}

.lyf-search-panel.is-open,
.lyf-admin-panel.is-open {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.lyf-panel-header small {
  display: block;
  margin-top: 2px;
  color: rgba(255, 255, 255, .46);
  font-size: .66rem;
}

.lyf-search-form {
  margin: 14px 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 42px;
  gap: 8px;
}

.lyf-search-form input,
.lyf-admin-form input,
.lyf-admin-form textarea,
.lyf-admin-form select {
  width: 100%;
  min-height: 40px;
  padding: 9px 11px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 4px;
  outline: none;
  background: rgba(255, 255, 255, .07);
  font: inherit;
  font-size: .78rem;
}

.lyf-search-form input:focus,
.lyf-admin-form :is(input, textarea, select):focus {
  border-color: var(--lyf-cyan);
}

.lyf-search-form button,
.lyf-admin-row button {
  min-width: 40px;
  border: 0;
  border-radius: 4px;
  color: #10201f;
  background: var(--lyf-cyan);
}

.lyf-search-results,
.lyf-admin-list {
  display: grid;
  gap: 8px;
}

.lyf-search-result {
  padding: 11px;
  color: rgba(255, 255, 255, .88);
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 5px;
  background: rgba(255, 255, 255, .035);
  text-decoration: none;
}

.lyf-search-result:hover {
  color: #fff;
  border-color: rgba(81, 214, 195, .4);
  background: rgba(81, 214, 195, .07);
}

.lyf-search-meta {
  display: block;
  margin-bottom: 4px;
  color: var(--lyf-cyan);
  font: 600 .61rem/1.3 ui-monospace, SFMono-Regular, Consolas, monospace;
  text-transform: uppercase;
}

.lyf-search-result strong {
  font-size: .84rem;
}

.lyf-search-result p {
  margin: 4px 0 0;
  color: rgba(255, 255, 255, .52);
  font-size: .7rem;
  line-height: 1.55;
}

.lyf-notification-section {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

.lyf-notification-section[hidden] {
  display: none;
}

.lyf-subsection-title {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
  font-size: .72rem;
}

.lyf-subsection-title span {
  color: rgba(255, 255, 255, .46);
}

.lyf-notification-list {
  display: grid;
}

.lyf-notification {
  padding: 9px 4px;
  display: block;
  text-align: left;
  color: rgba(255, 255, 255, .65);
  border: 0;
  border-bottom: 1px solid rgba(255, 255, 255, .08);
  background: transparent;
}

.lyf-notification.is-unread strong {
  color: var(--lyf-cyan);
}

.lyf-notification strong,
.lyf-notification span {
  display: block;
  font-size: .7rem;
}

.lyf-notification span {
  margin-top: 3px;
  opacity: .65;
}

.lyf-admin-entry {
  width: 100%;
  min-height: 40px;
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: #10201f;
  border: 0;
  border-radius: 4px;
  background: var(--lyf-amber);
  font: inherit;
  font-size: .76rem;
  font-weight: 700;
}

.lyf-admin-entry[hidden] {
  display: none;
}

.lyf-admin-form {
  margin: 14px 0 10px;
  display: grid;
  gap: 8px;
}

.lyf-admin-form textarea {
  resize: vertical;
  line-height: 1.5;
}

.lyf-admin-row {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr) auto;
  gap: 8px;
}

.lyf-admin-row button {
  padding: 0 12px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.lyf-admin-status {
  min-height: 20px;
  color: var(--lyf-cyan);
  font-size: .7rem;
}

.lyf-admin-item {
  min-height: 48px;
  padding: 8px 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 34px 34px;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid rgba(255, 255, 255, .09);
}

.lyf-admin-item strong,
.lyf-admin-item span {
  display: block;
}

.lyf-admin-item strong { font-size: .76rem; }
.lyf-admin-item span { margin-top: 2px; color: rgba(255, 255, 255, .46); font-size: .65rem; }
.lyf-admin-item button { width: 32px; height: 32px; border: 0; color: rgba(255,255,255,.7); background: transparent; }

.lyf-managed-post,
.lyf-managed-loading {
  width: 100%;
  padding: 32px;
  border-radius: 7px;
  background: var(--card-bg);
  box-shadow: var(--card-box-shadow);
}

.lyf-managed-post header {
  padding-bottom: 22px;
  border-bottom: 1px solid var(--lyf-line);
}

.lyf-managed-post header span {
  color: var(--lyf-accent);
  font: 700 .66rem/1.3 ui-monospace, SFMono-Regular, Consolas, monospace;
}

.lyf-managed-post h1 {
  margin: 8px 0;
  font-size: 1.72rem;
}

.lyf-managed-post header p {
  margin: 0;
  color: var(--font-color);
  opacity: .58;
}

.lyf-managed-post .post-content {
  padding-top: 22px;
  line-height: 1.9;
}

.lyf-managed-post pre {
  padding: 14px;
  overflow-x: auto;
  border-radius: 5px;
  color: #dff8f3;
  background: #111a1a;
}

.lyf-account-panel.is-open {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.lyf-account-panel .lyf-panel-header {
  padding: 13px 12px 11px 16px;
}

.lyf-account-body {
  padding: 16px;
}

.lyf-chat-panel {
  position: fixed;
  right: 18px;
  bottom: 154px;
  z-index: 1100;
  width: min(390px, calc(100vw - 36px));
  max-height: min(590px, calc(100vh - 190px));
  display: grid;
  grid-template-rows: auto minmax(140px, 1fr) auto;
  color: #f4f7f7;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 7px;
  background: var(--lyf-panel);
  box-shadow: 0 18px 48px rgba(0, 0, 0, .36);
  backdrop-filter: blur(18px);
  transform: translateY(18px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform .22s ease, opacity .22s ease, visibility .22s ease;
}

.lyf-chat-panel.is-open {
  transform: translateY(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.lyf-chat-header {
  min-height: 52px;
  padding: 8px 10px 8px 16px;
  display: flex;
  align-items: center;
  gap: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.lyf-chat-header strong {
  font-size: .9rem;
}

.lyf-chat-title {
  min-width: 0;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.lyf-chat-title span {
  overflow: hidden;
  color: rgba(255, 255, 255, .5);
  font-size: .62rem;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lyf-chat-status {
  color: rgba(255, 255, 255, .48);
  font-size: .68rem;
}

.lyf-chat-messages {
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  overflow-y: auto;
}

.lyf-chat-message {
  max-width: 86%;
  padding: 9px 11px;
  border-radius: 6px;
  color: rgba(255, 255, 255, .88);
  background: rgba(255, 255, 255, .1);
  font-size: .8rem;
  line-height: 1.65;
  white-space: pre-wrap;
}

.lyf-chat-message.is-user {
  align-self: flex-end;
  color: #10201f;
  background: var(--lyf-cyan);
}

.lyf-chat-message.is-pending {
  color: rgba(255, 255, 255, .52);
}

.lyf-chat-message.is-error {
  color: #ffd1cd;
  border: 1px solid rgba(239, 123, 114, .32);
  background: rgba(239, 123, 114, .12);
}

.lyf-chat-copy {
  white-space: pre-wrap;
}

.lyf-chat-sources {
  margin-top: 8px;
  padding-top: 7px;
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

.lyf-chat-sources a {
  max-width: 100%;
  padding: 3px 7px;
  overflow: hidden;
  color: #bff9ef;
  border: 1px solid rgba(81, 214, 195, .28);
  border-radius: 4px;
  background: rgba(81, 214, 195, .08);
  font-size: .62rem;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lyf-account-signed {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
}

.lyf-account-signed[hidden],
.lyf-account-guest[hidden] {
  display: none;
}

.lyf-account-avatar {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  color: #10201f;
  border-radius: 50%;
  background: var(--lyf-cyan);
}

.lyf-account-signed strong,
.lyf-account-signed span {
  display: block;
}

.lyf-account-signed strong {
  overflow: hidden;
  font-size: .84rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.lyf-account-signed span {
  margin-top: 2px;
  color: rgba(255, 255, 255, .48);
  font-size: .68rem;
}

.lyf-auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding: 3px;
  border: 1px solid rgba(255, 255, 255, .12);
  border-radius: 5px;
  background: rgba(255, 255, 255, .05);
}

.lyf-auth-tabs button,
.lyf-auth-submit,
.lyf-auth-secondary {
  min-height: 36px;
  border: 0;
  border-radius: 4px;
  color: rgba(255, 255, 255, .66);
  background: transparent;
  font: inherit;
  font-size: .76rem;
}

.lyf-auth-tabs button.is-active {
  color: #10201f;
  background: var(--lyf-cyan);
}

.lyf-auth-form {
  margin-top: 13px;
  display: grid;
  gap: 10px;
}

.lyf-auth-form label,
.lyf-auth-form label span {
  display: block;
}

.lyf-auth-form [data-auth-display][hidden] {
  display: none;
}

.lyf-auth-form label span {
  margin-bottom: 5px;
  color: rgba(255, 255, 255, .55);
  font-size: .68rem;
}

.lyf-auth-form input {
  width: 100%;
  height: 40px;
  padding: 0 10px;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 4px;
  outline: none;
  background: rgba(255, 255, 255, .07);
  font: inherit;
  font-size: .8rem;
}

.lyf-auth-form input:focus {
  border-color: var(--lyf-cyan);
}

.lyf-auth-submit {
  color: #10201f;
  background: var(--lyf-cyan);
  font-weight: 700;
}

.lyf-auth-secondary {
  padding: 0 10px;
  color: #ffd9d5;
  border: 1px solid rgba(239, 123, 114, .3);
}

.lyf-auth-note,
.lyf-auth-status {
  margin: 12px 0 0;
  color: rgba(255, 255, 255, .46);
  font-size: .68rem;
  line-height: 1.5;
}

.lyf-auth-status:not(:empty) {
  color: #bff9ef;
}

.lyf-icon-button.has-session {
  color: #10201f;
  background: var(--lyf-amber);
}

.lyf-chat-form {
  padding: 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 8px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}

.lyf-chat-form textarea {
  width: 100%;
  min-height: 42px;
  max-height: 110px;
  padding: 10px 11px;
  resize: vertical;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 5px;
  color: #fff;
  background: rgba(255, 255, 255, .07);
  font: inherit;
  font-size: .8rem;
}

.lyf-chat-form textarea:focus {
  border-color: var(--lyf-cyan);
  outline: none;
}

.lyf-chat-send {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 0;
  border-radius: 50%;
  color: #10201f;
  background: var(--lyf-cyan);
}

.lyf-chat-send:disabled {
  opacity: .45;
}

.lyf-focus-exit {
  position: fixed;
  top: 18px;
  right: 18px;
  z-index: 1200;
  min-height: 40px;
  padding: 0 14px;
  display: none;
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 5px;
  color: #10201f;
  background: var(--lyf-amber);
  box-shadow: 0 10px 28px rgba(0, 0, 0, .2);
  font: inherit;
  font-size: .78rem;
  font-weight: 700;
}

body.lyf-focus .lyf-focus-exit {
  display: inline-flex;
}

.lyf-control-toast {
  position: fixed;
  left: 50%;
  bottom: 26px;
  z-index: 1300;
  padding: 9px 13px;
  border-radius: 5px;
  color: #fff;
  background: rgba(14, 20, 24, .94);
  border: 1px solid rgba(255, 255, 255, .14);
  font-size: .76rem;
  transform: translate(-50%, 12px);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}

.lyf-control-toast.is-visible {
  transform: translate(-50%, 0);
  opacity: 1;
}

.lyf-reading-panel.is-open {
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}

.lyf-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.lyf-panel-header strong {
  font-size: .96rem;
}

.lyf-reading-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  padding: 16px 0;
}

.lyf-reading-stats div {
  padding-top: 8px;
  border-top: 2px solid rgba(255, 255, 255, .18);
}

.lyf-reading-stats strong,
.lyf-reading-stats span {
  display: block;
}

.lyf-reading-stats strong {
  color: var(--lyf-amber);
  font-size: 1.05rem;
}

.lyf-reading-stats span {
  margin-top: 3px;
  color: rgba(255, 255, 255, .5);
  font-size: .7rem;
}

.lyf-panel-section + .lyf-panel-section {
  margin-top: 18px;
}

.lyf-panel-section h3 {
  margin: 0 0 8px;
  font-size: .78rem;
  color: rgba(255, 255, 255, .58);
  text-transform: uppercase;
  letter-spacing: .08em;
}

.lyf-panel-list {
  display: grid;
}

.lyf-panel-list a,
.lyf-panel-empty {
  padding: 9px 0;
  color: rgba(255, 255, 255, .78);
  border-bottom: 1px solid rgba(255, 255, 255, .09);
  font-size: .8rem;
  text-decoration: none;
}

.lyf-panel-list a:hover {
  color: var(--lyf-cyan);
}

.lyf-panel-list a[data-level="3"] {
  padding-left: 14px;
}

.lyf-post-actions {
  margin: 18px 0 8px;
  padding: 10px 0;
  display: flex;
  align-items: center;
  gap: 8px;
  border-top: 1px solid var(--lyf-line);
  border-bottom: 1px solid var(--lyf-line);
}

.lyf-post-actions button {
  min-height: 34px;
  padding: 0 11px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--lyf-line);
  border-radius: 5px;
  color: var(--font-color);
  background: transparent;
  font: inherit;
  font-size: .78rem;
}

.lyf-post-actions button:hover,
.lyf-post-actions button.is-active {
  border-color: var(--lyf-accent);
  color: var(--lyf-accent);
}

body.lyf-focus #aside-content,
body.lyf-focus #page-header:not(.post-bg),
body.lyf-focus .relatedPosts,
body.lyf-focus .post-copyright,
body.lyf-focus #post-comment,
body.lyf-focus #footer {
  display: none !important;
}

body.lyf-focus #content-inner.layout {
  max-width: 920px;
}

body.lyf-focus #post {
  width: 100%;
}

body.lyf-live2d-off #oml2d-stage,
body.lyf-live2d-off .oml2d-stage,
body.lyf-live2d-off [class*="oml2d"] {
  display: none !important;
}

@media (max-width: 900px) {
  .lyf-experience {
    right: 10px;
    bottom: 10px;
    width: min(330px, calc(100vw - 20px));
  }

  .lyf-player {
    grid-template-columns: 38px 32px minmax(0, 1fr) 32px auto;
    gap: 4px 7px;
  }

  .lyf-player-cover {
    width: 38px;
    height: 38px;
  }

  .lyf-site-home {
    top: 10px;
    left: 10px;
    width: 38px;
    height: 38px;
  }

  .lyf-reading-panel {
    top: 62px;
    right: 10px;
    width: calc(100vw - 20px);
    max-height: calc(100svh - 76px);
  }

  .lyf-account-panel {
    top: 62px;
    right: 10px;
    width: calc(100vw - 20px);
    max-height: calc(100svh - 76px);
  }

  .lyf-search-panel,
  .lyf-admin-panel {
    top: 62px;
    right: 10px;
    width: calc(100vw - 20px);
    max-height: calc(100svh - 76px);
  }

  .lyf-chat-panel {
    right: 10px;
    bottom: 118px;
    width: calc(100vw - 20px);
    max-height: calc(100svh - 150px);
  }

  #oml2d-stage,
  .oml2d-stage,
  [class*="oml2d"] {
    display: none !important;
  }
}

@media (max-width: 520px) {
  .lyf-post-actions {
    overflow-x: auto;
  }

  .lyf-post-actions button {
    flex: none;
  }

  .lyf-admin-row {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lyf-reading-panel,
  .lyf-chat-panel,
  .lyf-account-panel,
  .lyf-search-panel,
  .lyf-admin-panel,
  .lyf-control-toast {
    transition: none;
  }
}

@media print {
  #blog-particles,
  .lyf-reading-progress,
  .lyf-experience,
  .lyf-reading-panel,
  .lyf-chat-panel,
  .lyf-account-panel,
  .lyf-search-panel,
  .lyf-admin-panel,
  .lyf-focus-exit,
  .lyf-control-toast,
  .lyf-site-home,
  #oml2d-stage,
  .oml2d-stage,
  [class*="oml2d"] {
    display: none !important;
  }
}