/* 站点维护页 — 精致卡片 */
.site-offline {
  --offline-primary: #00bb61;
  --offline-deep: color-mix(in srgb, var(--offline-primary) 72%, #0a0a0a);
  --offline-soft: color-mix(in srgb, var(--offline-primary) 7%, #ffffff);
  --offline-line: color-mix(in srgb, var(--offline-primary) 16%, #dde3df);
  --offline-ink: #3d4650;
  --offline-muted: #8b949e;
  min-height: 100vh;
  margin: 0;
  display: grid;
  place-items: center;
  padding: 40px 18px;
  background:
    radial-gradient(1200px 600px at 50% -10%, color-mix(in srgb, var(--offline-primary) 12%, transparent), transparent 60%),
    #e8ecf0;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Segoe UI", sans-serif;
  color: var(--offline-ink);
  -webkit-font-smoothing: antialiased;
  box-sizing: border-box;
}
.site-offline *,
.site-offline *::before,
.site-offline *::after { box-sizing: border-box; }

.site-offline-card {
  width: 100%;
  max-width: 580px;
  border-radius: 3px;
  overflow: hidden;
  background: #fff;
  box-shadow:
    0 1px 0 rgba(255,255,255,.7) inset,
    0 18px 48px rgba(15, 23, 42, 0.1),
    0 4px 12px rgba(15, 23, 42, 0.04);
}

/* —— 顶栏 —— */
.site-offline-head {
  background: var(--offline-primary);
  color: #fff;
  text-align: center;
  padding: 34px 40px 32px;
  position: relative;
}
.site-offline-head::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 1px;
  background: rgba(255,255,255,.12);
}
.site-offline-brand {
  display: flex;
  justify-content: center;
  margin: 0;
}
.site-offline-logo {
  display: block;
  height: 56px;
  width: auto;
  max-width: 320px;
  object-fit: contain;
  /* 彩色 Logo 映射为白色 */
  filter: brightness(0) invert(1);
}
.site-offline-brand-text {
  align-items: center;
  gap: 12px;
  width: fit-content;
  margin: 0 auto;
  text-align: left;
}
.site-offline-mark {
  width: 42px;
  height: 42px;
  border-radius: 3px;
  background: rgba(255,255,255,.16);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.site-offline-mark svg { width: 22px; height: 22px; }
.site-offline-name {
  font-size: 1.28rem;
  font-weight: 700;
  letter-spacing: 0.03em;
  line-height: 1.2;
}
.site-offline-domain {
  margin-top: 5px;
  font-size: 12px;
  opacity: .82;
  font-weight: 400;
  letter-spacing: 0.02em;
}
/* —— 正文 —— */
.site-offline-body {
  background: #fff;
  padding: 34px 44px 30px;
  text-align: center;
}
.site-offline-message {
  margin: 0 auto;
  max-width: 36em;
  font-size: 15px;
  line-height: 1.85;
  color: var(--offline-ink);
}
.site-offline-message p {
  margin: 0 0 0.45em;
  color: #5c6670;
}
.site-offline-message p:first-child {
  font-size: 15.5px;
  font-weight: 600;
  color: #3a434c;
}
.site-offline-message p:not(:first-child) {
  font-size: 13.5px;
  color: var(--offline-muted);
  font-weight: 400;
}
.site-offline-message p:last-child { margin-bottom: 0; }

.site-offline-sep {
  border: 0;
  height: 0;
  margin: 24px auto 22px;
  max-width: 200px;
  border-top: 1px dashed var(--offline-line);
}

.site-offline-actions {
  display: flex;
  justify-content: center;
  gap: 12px;
}
.site-offline-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 112px;
  height: 38px;
  padding: 0 18px;
  border-radius: 3px;
  text-decoration: none;
  font-size: 13.5px;
  font-weight: 600;
  letter-spacing: 0.02em;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease, color .15s ease;
}
.site-offline-actions .btn-primary {
  background: var(--offline-primary);
  border: 1px solid transparent;
  color: #fff;
  box-shadow: 0 6px 16px color-mix(in srgb, var(--offline-primary) 35%, transparent);
}
.site-offline-actions .btn-primary:hover {
  transform: translateY(-1px);
  filter: brightness(1.04);
}
.site-offline-actions .btn-ghost {
  background: #fff;
  border: 1px solid #e2e6ea;
  color: #4a5560;
}
.site-offline-actions .btn-ghost:hover {
  border-color: color-mix(in srgb, var(--offline-primary) 45%, #e2e6ea);
  color: var(--offline-primary);
}

/* —— 联系方式：单行 —— */
.site-offline-foot {
  background: var(--offline-soft);
  border-top: 1px solid color-mix(in srgb, var(--offline-primary) 10%, #eef1ef);
  padding: 14px 24px 16px;
}
.site-offline-contacts {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  align-items: center;
  gap: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.site-offline-contacts::-webkit-scrollbar { display: none; }
.contact {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  padding: 0 16px;
  color: #4a5560;
  text-decoration: none;
  font-size: 12.5px;
  line-height: 1;
  white-space: nowrap;
  flex: 0 0 auto;
  position: relative;
}
.contact + .contact::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 14px;
  background: color-mix(in srgb, var(--offline-primary) 18%, #d5dcd8);
}
a.contact:hover {
  color: var(--offline-primary);
}
.contact em {
  font-style: normal;
  color: var(--offline-muted);
  font-size: 12px;
  flex-shrink: 0;
}
.contact span {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.contact-ico {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  flex-shrink: 0;
  background: color-mix(in srgb, var(--offline-primary) 12%, #fff) center / 11px 11px no-repeat;
}
.contact-wechat {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M9.5 8.2c.4-2.4 2.8-4.2 5.6-4.2 3.2 0 5.7 2.2 5.7 5.1 0 2.8-2.5 5.1-5.7 5.1-.5 0-1-.1-1.5-.2l-2.1 1.2.4-2c-1.4-1-2.3-2.5-2.4-4z' stroke='%23000' stroke-opacity='.5' stroke-width='1.5'/%3E%3Cpath d='M3.2 15.2c0-2.5 2.2-4.5 5-4.5.4 0 .8 0 1.2.1 0 2.6 2.3 4.8 5.3 5.2-.3 1.8-2.3 3.2-4.7 3.2-.6 0-1.2-.1-1.7-.3l-2.4 1.3.5-2.1c-1.9-1-3.2-2.7-3.2-4.9z' stroke='%23000' stroke-opacity='.5' stroke-width='1.5'/%3E%3C/svg%3E");
}
.contact-qq {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M12 4.5c2.4 0 4.2 1.7 4.2 4.3 0 .3 0 .6-.1.9 1.5.7 2.5 1.9 2.5 3.4 0 1.2-.7 2.2-1.8 2.9.4 1.3 1.2 2.4 1.2 2.4s-1.5-.3-2.6-1.1c-.4.1-.9.2-1.4.2s-1-.1-1.4-.2c-1.1.8-2.6 1.1-2.6 1.1s.8-1.1 1.2-2.4C8.1 15.3 7.4 14.3 7.4 13.1c0-1.5 1-2.7 2.5-3.4-.1-.3-.1-.6-.1-.9 0-2.6 1.8-4.3 4.2-4.3z' stroke='%23000' stroke-opacity='.5' stroke-width='1.5'/%3E%3C/svg%3E");
}
.contact-email {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Crect x='3.5' y='5.5' width='17' height='13' rx='2' stroke='%23000' stroke-opacity='.5' stroke-width='1.6'/%3E%3Cpath d='M4.5 7.5 12 13l7.5-5.5' stroke='%23000' stroke-opacity='.5' stroke-width='1.6'/%3E%3C/svg%3E");
}

@media (max-width: 560px) {
.site-offline {
  padding: 24px 14px;
}

.site-offline-card {
  max-width: 100%;
}

.site-offline-head {
  padding: 26px 22px 24px;
}

.site-offline-body {
  padding: 26px 22px 22px;
}

.site-offline-actions a {
  min-width: 0; flex: 1;
}

.site-offline-actions {
  width: 100%;
}

.site-offline-foot {
  padding-left: 12px; padding-right: 12px;
}

.contact {
  padding: 0 12px; font-size: 12px;
}
}

html.dark body,html.dark .site-offline{background:#0c0f0e!important;color:#e8eeeb}
html.dark .site-offline-card{background:#141918!important;color:#e8eeeb;border-color:#2a3330}
