@font-face {
    font-family: "AlimamaFangYuanTiVF-Thin";
    src: url("fonts/AlimamaFangYuanTiVF-Thin.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    --fm-primary: #3f9e63;
    --fm-primary-dark: #348653;
    --fm-primary-light: #eaf6ee;
    --fm-bg: #f0ece1;
    --fm-page: #f7f5ef;
    --fm-card: #ffffff;
    --fm-soft: #faf9f4;
    --fm-soft-2: #f2f0e8;
    --fm-border: #e6e1d2;
    --fm-line: #f0ecdf;
    --fm-text: #35362f;
    --fm-text-sub: #8b8879;
    --fm-text-strong: #1f201b;
    --fm-muted: #a9a595;
    --fm-topbar: #ffffff;
    --fm-topbar-text: #35362f;
    --fm-tint-green: color-mix(in srgb, var(--fm-primary) 10%, var(--fm-card));
    --fm-tint-red: color-mix(in srgb, #d9534f 12%, var(--fm-card));
    --fm-tint-gold: color-mix(in srgb, #b98b1f 14%, var(--fm-card));
    --fm-tint-purple: color-mix(in srgb, #7c5bd1 12%, var(--fm-card));
    --fm-tint-blue: color-mix(in srgb, #3a7bd5 12%, var(--fm-card));
    --fm-radius: 0.25rem;
    --fm-shadow: 0 1px 2px rgba(90, 82, 60, .06), 0 6px 18px rgba(90, 82, 60, .05);
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    -webkit-text-size-adjust: 100%;
}

body.forum-body {
    background-color: var(--fm-page);
    background-image: url('../images/aotu_background.webp');
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
    background-attachment: fixed;
    color: var(--fm-text);
    font: 14px/1.65 "AlimamaFangYuanTiVF-Thin", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

@media (max-width: 768px) {
    body.forum-body {
        background-attachment: scroll;
    }
}

.forum-topbar,
.forum-footer {
    flex: 0 0 auto;
}

.forum-main {
    flex: 1 1 auto;
}

a {
    color: inherit;
    text-decoration: none;
    transition: color .15s;
}

a:hover {
    color: var(--fm-primary);
}

img {
    max-width: 100%;
    vertical-align: middle;
}

ul,
ol {
    list-style: none;
}

button,
input,
select,
textarea {
    font: inherit;
    color: inherit;
    outline: none;
}

.wrap {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 12px;
}

.dot {
    color: var(--fm-muted);
    margin: 0 5px;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    padding: 0 16px;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    font-size: 13px;
    cursor: pointer;
    background: var(--fm-soft-2);
    color: var(--fm-text);
    transition: all .15s;
    white-space: nowrap;
}

.btn-primary {
    background: var(--fm-primary);
    color: #fff;
}

.btn-primary:hover {
    background: var(--fm-primary-dark);
    color: #fff;
}

.btn-plain {
    background: var(--fm-card);
    border-color: var(--fm-border);
    color: var(--fm-text-sub);
}

.forum-topbar {
    position: sticky;
    top: 0;
    z-index: 60;
    background-color: rgba(255, 255, 255, .5);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    backdrop-filter: blur(14px) saturate(160%);
    color: var(--fm-topbar-text);
    border-bottom: 1px solid var(--fm-border);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.02);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .forum-topbar {
        background-color: var(--fm-card);
    }
}

.topbar-progress {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    overflow: hidden;
    pointer-events: none;
}

.topbar-progress-bar {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, var(--fm-primary), var(--fm-primary-dark));
    transform: scaleX(0);
    transform-origin: 0 50%;
    will-change: transform;
}

.topbar-in {
    display: flex;
    align-items: center;
    min-height: 54px;
}

.brand {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    margin-right: 14px;
    position: relative;
    overflow: hidden;
}

.brand::after {
    content: '';
    position: absolute;
    top: 0;
    left: -80%;
    width: 45%;
    height: 100%;
    background: linear-gradient(120deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, .9) 50%,
        rgba(255, 255, 255, 0) 100%);
    mix-blend-mode: screen;
    transform: skewX(-20deg);
    animation: brand-shine 4.5s ease-in-out 1s infinite;
    pointer-events: none;
}

@keyframes brand-shine {
    0% { left: -80%; }
    55%, 100% { left: 130%; }
}

@media (prefers-reduced-motion: reduce) {
    .brand::after { animation: none; }
}

.brand-text {
    font-size: 20px;
    font-weight: 700;
    color: var(--fm-text-strong);
    letter-spacing: .5px;
}

.brand-img {
    display: block;
    max-height: 34px;
}

.topbar-nav {
    flex: 1 1 auto;
    min-width: 0;
}

.topbar-nav .nav-list {
    display: flex;
    align-items: center;
    height: 54px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.topbar-nav .nav-list::-webkit-scrollbar {
    display: none;
}

.nav-item {
    position: relative;
    flex: 0 0 auto;
    height: 54px;
}

.nav-link {
    display: inline-flex;
    align-items: center;
    height: 54px;
    padding: 0 15px;
    font-size: 14px;
    color: var(--fm-topbar-text);
    white-space: nowrap;
}

.nav-link:hover {
    color: var(--fm-primary);
}

.nav-link.active {
    color: var(--fm-primary);
    font-weight: 600;
}

.nav-avatar {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin-right: 6px;
}

.nav-avatar.forum-letter-avatar,
.tool-avatar.forum-letter-avatar {
    font-size: 12px;
    border: 1px solid var(--fm-border);
}

.nav-caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 5px;
    border: 4px solid transparent;
    border-top-color: var(--fm-text-sub);
}

.nav-dropdown {
    position: absolute;
    top: 54px;
    left: 0;
    min-width: 140px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    box-shadow: var(--fm-shadow);
    padding: 6px 0;
    display: none;
    z-index: 60;
}

.nav-has-drop:hover .nav-dropdown,
.nav-user:hover .nav-dropdown {
    display: block;
}

.nav-dropdown a {
    display: block;
    padding: 8px 16px;
    font-size: 13px;
    color: var(--fm-text);
}

.nav-dropdown a:hover {
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.topbar-tools {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 3px;
    margin-left: 10px;
}

.tool-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 34px;
    padding: 0 11px;
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-topbar-text);
    white-space: nowrap;
}

.tool-btn svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.tool-btn:hover {
    color: var(--fm-primary);
}

.tool-user:hover,
.tool-user:hover span {
    color: var(--fm-primary);
    transition: color .15s;
}

.tool-avatar {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid var(--fm-border);
}

.tool-user .v-icon {
    margin: 0 0 0 3px;
    vertical-align: -3px;
}

button.tool-btn {
    border: 0;
    background: transparent;
    font-family: inherit;
    cursor: pointer;
}

.tool-more-wrap {
    position: relative;
}

.tool-menu {
    position: absolute;
    top: calc(100% + 9px);
    right: 0;
    z-index: 120;
    min-width: 152px;
    padding: 6px;
    border-radius: 8px;
    background: #4b423a;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .22);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .16s ease, transform .16s ease, visibility .16s;
}

.tool-menu::before {
    content: '';
    position: absolute;
    top: -5px;
    right: 28px;
    width: 10px;
    height: 10px;
    border-radius: 2px;
    background: #4b423a;
    transform: rotate(45deg);
}

.tool-more-wrap.open .tool-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.tool-menu a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-radius: 6px;
    font-size: 13px;
    color: rgba(255, 255, 255, .88);
    white-space: nowrap;
    transition: background-color .15s, color .15s;
}

.tool-menu a:hover {
    background: transparent;
    color: var(--fm-primary);
}

.tool-menu a i {
    width: 14px;
    font-size: 13px;
    text-align: center;
    opacity: .85;
}

.tool-menu a.tool-menu-user {
    display: none;
}

.search-overlay {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: none;
    padding: 108px 20px 60px;
    overflow-y: auto;
    background: rgba(248, 247, 242, .72);
    -webkit-backdrop-filter: blur(18px) saturate(1.3);
    backdrop-filter: blur(18px) saturate(1.3);
}

.search-overlay.open {
    display: block;
    animation: soFade .18s ease;
}

@keyframes soFade {
    from { opacity: 0; }
    to { opacity: 1; }
}

.so-close {
    position: fixed;
    top: 22px;
    right: 30px;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--fm-text);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: background-color .15s, color .15s;
}

.so-close:hover {
    background: rgba(0, 0, 0, .05);
    color: var(--fm-primary);
}

.so-inner {
    width: min(680px, 100%);
    margin: 0 auto;
}

.so-types {
    display: inline-flex;
    gap: 2px;
    padding: 4px;
    margin-bottom: 16px;
    border-radius: 0.25rem;
    background: rgba(255, 255, 255, .55);
}

.so-types label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.so-types label span {
    padding: 7px 15px;
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-text-sub);
    transition: background-color .15s, color .15s;
}

.so-types label:hover span {
    color: var(--fm-primary);
}

.so-types input[type="radio"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: 0;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

.so-types input[type="radio"]:checked + span {
    background: var(--fm-card);
    color: var(--fm-primary);
    font-weight: 600;
}

.so-types .so-ext {
    padding: 7px 15px;
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    font-size: 13px;
    color: var(--fm-text-sub);
    cursor: pointer;
    transition: background-color .15s, color .15s;
}

.so-types .so-ext:hover {
    background: var(--fm-card);
    color: var(--fm-primary);
}

.so-types .so-ext.active {
    background: var(--fm-card);
    color: var(--fm-primary);
    font-weight: 600;
}

.so-types.ext-mode input[type="radio"]:checked + span {
    background: transparent;
    color: var(--fm-text-sub);
    font-weight: 400;
}

.so-field {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 8px 8px 18px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 6px 20px rgba(60, 55, 40, .06);
    transition: border-color .15s, box-shadow .15s;
}

.so-field:focus-within {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .12);
}

.so-ico {
    flex: 0 0 auto;
    color: var(--fm-muted);
    font-size: 16px;
}

.so-field input {
    flex: 1 1 auto;
    min-width: 0;
    height: 42px;
    border: 0;
    outline: none;
    background: transparent;
    font-size: 15px;
    color: var(--fm-text);
}

.so-submit {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    transition: opacity .15s;
}

.so-submit:hover {
    opacity: .88;
}

.so-sec {
    margin-top: 26px;
}

.so-sec-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 12px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.so-sec-head i {
    margin-right: 4px;
}

.so-sec-head a {
    color: var(--fm-muted);
}

.so-sec-head a:hover {
    color: var(--fm-primary);
}

.so-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.so-tag {
    display: inline-block;
    padding: 7px 16px;
    border-radius: 0.25rem;
    background: rgba(255, 255, 255, .7);
    color: var(--fm-text);
    font-size: 13px;
    transition: background-color .15s, color .15s;
}

.so-tag:hover {
    background: var(--fm-card);
    color: var(--fm-primary);
}

.search-form {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 0;
}

.search-field {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}

.search-ico {
    position: absolute;
    left: 17px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    fill: none;
    stroke: #b3ae9d;
    stroke-width: 2;
    stroke-linecap: round;
    pointer-events: none;
}

.search-form input:not([type="radio"]):not([type="checkbox"]) {
    width: 100%;
    min-width: 0;
    height: 42px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    padding: 0 18px 0 42px;
    font-size: 14px;
    background: var(--fm-soft);
}

.search-form input:focus {
    border-color: var(--fm-primary);
    background: var(--fm-card);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.search-form .btn {
    flex: 0 0 auto;
    height: 42px;
    padding: 0 26px;
    border-radius: 0.25rem;
}

.search-close {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    color: var(--fm-muted);
}

.search-close svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
}

.search-close:hover {
    background: var(--fm-soft-2);
    color: var(--fm-text);
}

.toolbar-side {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.notice-roll {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    font-size: 12px;
}

.notice-roll-view {
    display: block;
    height: 20px;
    overflow: hidden;
}

.notice-roll-track {
    display: block;
    transition: transform .45s ease;
}

.notice-roll-item {
    display: block;
    height: 20px;
    line-height: 20px;
    max-width: 260px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--fm-text-sub);
}

.notice-roll-item:hover {
    color: var(--fm-primary);
}

.forum-main {
    padding: 16px 12px;
}

.author-layout {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.author-side {
    flex: 0 0 180px;
    min-width: 0;
}

.author-main {
    flex: 1 1 auto;
    min-width: 0;
}

.author-profile {
    padding: 22px 16px 16px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-bottom: 0;
    border-radius: var(--fm-radius) var(--fm-radius) 0 0;
    text-align: center;
}

.author-profile-avatar {
    width: 76px;
    height: 76px;
    margin: 0 auto 10px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid var(--fm-line);

    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.author-profile-avatar img,
.author-profile-avatar .forum-letter-avatar {
    flex: 0 0 auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-size: 30px;
}

.author-profile-name {
    font-size: 16px;
    font-weight: 600;
    color: var(--fm-text-strong);
    word-break: break-all;
}

.author-menu {
    background: var(--fm-card);
    border: 1px solid var(--fm-border);

    border-top-color: var(--fm-line);
    border-radius: 0 0 var(--fm-radius) var(--fm-radius);
    overflow: hidden;
}

.author-menu a {
    display: block;
    padding: 0 12px;
    height: 42px;
    line-height: 42px;
    font-size: 14px;
    text-align: center;
    color: var(--fm-text);
    border-bottom: 1px solid var(--fm-line);
}

.author-menu a:last-child {
    border-bottom: 0;
}

.author-menu a:hover {
    color: var(--fm-primary);
    background: var(--fm-soft);
}

.author-menu a.active {
    color: var(--fm-primary);
    background: var(--fm-primary-light);
    font-weight: 600;
}

.author-panel {
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 0 0 var(--fm-radius) var(--fm-radius);
    overflow: hidden;
}

/* 作者主页：放开裁切，避免流光/发光边框被 .author-panel 的 overflow:hidden 截断 */
.author-panel.author-home {
    overflow: visible;
}

.author-panel .pager {
    margin: 14px auto 16px;
    padding: 0 16px;
}

.author-tip {
    padding: 16px 20px;
}

.author-comment-list {
    padding: 4px 0;
}

.author-comment {
    padding: 12px 20px;
    border-bottom: 1px solid var(--fm-line);
}

.author-comment:last-child {
    border-bottom: 0;
}

.author-comment-body {
    font-size: 14px;
    color: var(--fm-text);
}

.author-comment-img {
    display: inline-block;
    max-width: 100%;
    max-height: 220px;
    height: auto;
    margin: 4px 0;
    border-radius: 4px;
    vertical-align: middle;
}

.author-comment-meta {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 6px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.author-comment-meta a {
    color: var(--fm-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.follow-list {
    padding: 4px 0;
}

.follow-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 20px;
    border-bottom: 1px solid var(--fm-line);
}

.follow-item:last-child {
    border-bottom: 0;
}

.follow-avatar {
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    overflow: hidden;
    border: 1px solid var(--fm-line);
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.follow-avatar img,
.follow-avatar .forum-letter-avatar {
    flex: 0 0 auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-size: 19px;
}

.follow-info {
    flex: 1 1 auto;
    min-width: 0;
}

.follow-name {
    display: block;
    font-size: 14px;
    font-weight: 500;
    color: var(--fm-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.follow-name em {
    font-style: normal;
    font-weight: 400;
    color: var(--fm-text-sub);
    margin-left: 4px;
}

.follow-meta {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.follow-btn {
    flex: 0 0 auto;
    height: 30px;
    padding: 0 14px;
    border: 1px solid var(--fm-primary);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-primary);
    font-size: 13px;
    cursor: pointer;
    transition: .18s;
}

.follow-btn:hover {
    background: var(--fm-primary);
    color: #fff;
}

.follow-btn.is-followed {
    border-color: var(--fm-border);
    color: var(--fm-text-sub);
    background: var(--fm-soft);
}

.follow-btn.is-followed:hover {
    border-color: #d95c5c;
    color: #d95c5c;
    background: var(--fm-card);
}

.follow-btn.is-loading {
    opacity: .6;
    pointer-events: none;
}

.forum-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 300px;
    gap: 16px;
    align-items: start;
}

.forum-layout.no-side {
    grid-template-columns: minmax(0, 1fr);
}

.forum-layout.no-side .forum-side {
    display: none;
}

.forum-content {
    min-width: 0;
}

.forum-content > :last-child {
    margin-bottom: 0;
}

.board-head {
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    padding: 16px 18px;
    margin-bottom: 12px;
}

.board-head-top {
    display: flex;
    align-items: center;
    gap: 12px;
}

.board-head-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    flex-shrink: 0;
    background: linear-gradient(135deg, var(--fm-primary), var(--fm-primary-dark));
    color: #fff;
    font-size: 17px;
    box-shadow: 0 3px 8px color-mix(in srgb, var(--fm-primary) 28%, transparent);
}

.board-head-title {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.board-head-label {
    font-size: 12px;
    letter-spacing: 1px;
    color: var(--fm-text-sub);
}

.board-head h1 {
    font-size: 19px;
    line-height: 1.3;
    color: var(--fm-text-strong);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.board-head-count {
    margin-left: auto;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--fm-primary) 30%, transparent);
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 12px;
}

.board-head-count em {
    font-style: normal;
    font-weight: 700;
}

.board-head p {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px dashed var(--fm-border);
    font-size: 13px;
    line-height: 1.7;
    color: var(--fm-text-sub);
}

@media (max-width: 768px) {
    .board-head {
        padding: 14px 15px;
    }
    .board-head-icon {
        width: 36px;
        height: 36px;
        font-size: 15px;
        border-radius: 8px;
    }
    .board-head h1 {
        font-size: 17px;
    }
}

.thread-panel {
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    overflow: hidden;
}

.thread-toolbar {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px;
    padding: 10px 14px 0;
    border-bottom: 1px solid var(--fm-line);
    background: var(--fm-soft);
    flex-wrap: wrap;
}

.toolbar-tabs {
    display: flex;
    gap: 6px;
    margin-bottom: -1px;
}

.toolbar-tabs a {
    font-size: 13px;
    color: var(--fm-text-sub);
    padding: 10px 18px;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: 0.25rem 0.25rem 0 0;
    background: transparent;
    transition: background-color .15s ease, color .15s ease;
}

.toolbar-tabs a:hover {
    color: var(--fm-primary);
}

.toolbar-tabs a.active {
    background: var(--fm-card);
    border-color: var(--fm-line);
    border-bottom-color: var(--fm-card);
    color: var(--fm-primary);
    font-weight: 600;
}

.toolbar-side {
    align-self: center;
}

.toolbar-cat-btn {
    display: none;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    align-self: center;
    width: 30px;
    height: 30px;
    margin: 0 0 6px;
    padding: 0;
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    color: var(--fm-text-sub);
    font-size: 15px;
    cursor: pointer;
    transition: color .15s ease, background-color .15s ease;
}

.toolbar-cat-btn:hover,
.toolbar-cat-btn.is-open {
    background: var(--fm-soft-2);
    color: var(--fm-primary);
}

.home-cat-panel {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: none;
    pointer-events: none;
}

.home-cat-panel.show {
    display: block;
}

.home-cat-box {
    position: absolute;
    right: 12px;
    top: 68px;
    min-width: 132px;
    max-width: 70vw;
    max-height: 64vh;
    padding: 5px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 12px 30px rgba(50, 44, 30, .2);
    overflow-y: auto;
    pointer-events: auto;
}

.home-cat-sec {
    padding: 6px 10px 4px;
    font-size: 11px;
    color: var(--fm-muted);
}

.home-cat-sec:not(:first-child) {
    margin-top: 3px;
    border-top: 1px solid var(--fm-line);
}

.home-cat-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 0.2rem;
    color: var(--fm-text);
    font-size: 13px;
    white-space: nowrap;
}

.home-cat-item:hover {
    background: var(--fm-soft);
    color: var(--fm-primary);
}

.home-cat-item.active {
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-weight: 600;
}

.home-cat-name {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 768px) {
    .toolbar-cat-btn {
        display: inline-flex;
    }

    .toolbar-tabs a {
        padding: 10px 12px;
    }
}

@media (min-width: 769px) {
    .home-cat-panel {
        display: none !important;
    }
}

.thread-list {
    padding: 0;
}

.thread-item {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border-bottom: 1px solid var(--fm-line);
    transition: background .15s;
}

.thread-item:last-child {
    border-bottom: 0;
}

.thread-item:hover {
    background: var(--fm-soft);
}

.is-hidden {
    display: none !important;
}

.thread-avatar {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    display: block;
    border: 1px solid var(--fm-line);
    background: var(--fm-soft);
    transition: border-color .15s;
}

.thread-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.thread-avatar img {
    flex: 0 0 auto;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.thread-avatar .forum-letter-avatar {
    width: 100%;
    height: 100%;
    font-size: 17px;
}

.thread-avatar:hover {
    border-color: var(--fm-primary);
}

.forum-letter-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 600;
    line-height: 1;
    border-radius: 50%;
}

.thread-body {
    flex: 1 1 auto;
    min-width: 0;
}

.thread-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.5;
}

.thread-title>a {
    color: var(--fm-text-strong);
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.thread-title>a:hover {
    color: var(--fm-primary);
}

.thread-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 5px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.thread-author {
    color: #6f8a7b;
}

.thread-author:hover {
    color: var(--fm-primary);
}

.thread-lastc {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: var(--fm-text-sub);
    min-width: 0;
}

.thread-lastc em {
    font-style: normal;
    color: var(--fm-muted);
}

.thread-lastc b {
    font-weight: 400;
    color: var(--fm-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 90px;
}

.thread-lastc span {
    color: var(--fm-text-sub);
}

.thread-stats {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 96px;
    justify-content: flex-end;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.thread-reply,
.thread-view {
    position: relative;
    padding-left: 17px;
}

.thread-reply::before,
.thread-view::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 12px;
    height: 12px;
    background: #c3bfae;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 12px;
    mask-size: 12px;
}

.thread-reply::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.4 8.4 0 0 1-3.8-.9L3 21l1.9-5.7a8.4 8.4 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.4 8.4 0 0 1 3.8-.9h.5a8.5 8.5 0 0 1 8 8z'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M21 11.5a8.4 8.4 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.4 8.4 0 0 1-3.8-.9L3 21l1.9-5.7a8.4 8.4 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.4 8.4 0 0 1 3.8-.9h.5a8.5 8.5 0 0 1 8 8z'/%3E%3C/svg%3E");
}

.thread-view::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z'/%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3C/svg%3E");
}

.thread-stats .thread-reply {
    display: none;
}
#thread-list.stats-comment .thread-reply {
    display: inline;
}
#thread-list.stats-comment .thread-view {
    display: none;
}

.thread-empty {
    padding: 60px 20px;
    text-align: center;
    color: var(--fm-text-sub);
    font-size: 13px;
}

.thread-empty-pic {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 40px 20px;
}

.thread-empty-pic img {
    width: 150px;
    max-width: 60%;
    height: auto;
    opacity: .9;
}

.thread-loading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 60px 20px;
    color: var(--fm-text-sub);
    font-size: 13px;
}

.thread-loading .fa-spinner {
    color: var(--fm-primary);
}

.thread-more-sentinel {
    height: 0;
}

.thread-loading.is-end {
    color: var(--fm-muted);
    cursor: default;
}

.thread-tag,
.thread-badge {
    flex: 0 0 auto;
    font-size: 11px;
    font-weight: 500;
    line-height: 18px;
    height: 18px;
    padding: 0 6px;
    border-radius: 0.25rem;
    white-space: nowrap;
}

/* 帖子分类标签：类型图标 + 柔和色底 */
.thread-tag {
    --tt-ink: var(--fm-primary);
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    line-height: 20px;
    padding: 0 6px 0 5px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .02em;
    overflow: hidden;
    color: color-mix(in srgb, var(--tt-ink) 88%, var(--fm-text));
    background: linear-gradient(180deg,
            color-mix(in srgb, var(--tt-ink) 16%, var(--fm-card)),
            color-mix(in srgb, var(--tt-ink) 9%, var(--fm-card)));
    border: 1px solid color-mix(in srgb, var(--tt-ink) 26%, var(--fm-card));
    box-shadow: 0 1px 2px color-mix(in srgb, var(--tt-ink) 14%, transparent),
        inset 0 1px 0 rgba(255, 255, 255, .38);
}

.thread-tag i {
    font-size: 11px;
    line-height: 1;
    opacity: .95;
}

.thread-tag::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 55%;
    background: linear-gradient(100deg,
            rgba(255, 255, 255, 0) 0%,
            rgba(255, 255, 255, .18) 34%,
            rgba(255, 255, 255, .55) 44%,
            rgba(255, 255, 255, .8) 50%,
            rgba(255, 255, 255, .55) 56%,
            rgba(255, 255, 255, .18) 66%,
            rgba(255, 255, 255, 0) 100%);
    transform: translateX(-160%) skewX(-18deg);
    opacity: 0;
    pointer-events: none;
}

.thread-tag:hover::after,
.thread-item:hover .thread-tag::after,
.post-title:hover .thread-tag::after {
    animation: forum-tag-sweep .85s ease-out;
}

@keyframes forum-tag-sweep {
    0% {
        transform: translateX(-160%) skewX(-18deg);
        opacity: 0;
    }

    18% {
        opacity: 1;
    }

    100% {
        transform: translateX(260%) skewX(-18deg);
        opacity: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    .thread-tag::after {
        display: none;
    }
}

.post-title .thread-tag {
    gap: 5px;
    height: 24px;
    line-height: 22px;
    padding: 0 7px 0 6px;
    border-radius: 5px;
    font-size: 13px;
}

.post-title .thread-tag i {
    font-size: 12px;
}

.tag-discuss {
    --tt-ink: #3a7bd5;
}

.tag-ask {
    --tt-ink: #d9822b;
}

.tag-share {
    --tt-ink: #2f9e6f;
}

.tag-announce {
    --tt-ink: #d9534f;
}

.tag-original {
    --tt-ink: #7c5bd1;
}

.tag-trade {
    --tt-ink: #0f9b8e;
}

.tag-news {
    --tt-ink: #4a6fa5;
}

.tag-guide {
    --tt-ink: #b98b1f;
}

.tag-host {
    --tt-ink: #2f6fed;
}

.tag-domain {
    --tt-ink: #0e93c9;
}

.tag-software {
    --tt-ink: #64748b;
}

.tag-benefit {
    --tt-ink: #db5a8a;
}

.tag-game {
    --tt-ink: #b05ce0;
}

.badge-top {
    background: transparent;
    color: #d9534f;
    padding: 0 2px 0 0;
}

.badge-top i {
    font-size: 13px;
    line-height: 18px;
    vertical-align: -1px;
}

.badge-solved {
    background: var(--fm-tint-green);
    color: #2f8f57;
}

.thread-price {
    font-size: 12px;
    color: #d97706;
    display: inline-flex;
    align-items: center;
}

.thread-price i {
    font-style: normal;
    font-size: 11px;
    line-height: 1;
    margin-right: 2px;
}

.thread-price-icon {
    width: 13px;
    height: 13px;
    vertical-align: -2px;
    margin-right: 2px;
}

.thread-newbie {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.thread-newbie-icon {
    width: 36px;
    height: 14px;
    vertical-align: middle;
    margin-left: 3px;
}

.thread-image-badge {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.thread-image-icon {
    width: 16px;
    height: 16px;
    vertical-align: middle;
    margin-left: 3px;
}

.thread-attach-badge {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.thread-attach-icon {
    width: auto;
    height: 16px;
    vertical-align: middle;
    margin-left: 3px;
}

.thread-hot-comment {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.thread-hot-comment-icon {
    height: 14px;
    width: auto;
    vertical-align: middle;
    margin-left: 3px;
}

.thread-hot-view {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
}

.thread-hot-view-icon {
    height: 14px;
    width: auto;
    vertical-align: middle;
    margin-left: 3px;
}

.pager {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    margin: 16px auto 0;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    overflow: visible;
}

.pager:empty,
.pager:not(:has(*)) {
    display: none;
}

.pager span,
.pager a,
.pager em {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 34px;
    padding: 0 10px;
    font-size: 14px;
    font-style: normal;
    color: var(--fm-text-sub);
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    text-decoration: none;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}

.pager a:hover {
    background: var(--fm-primary-light);
    border-color: color-mix(in srgb, var(--fm-primary) 35%, transparent);
    color: var(--fm-primary);
}

.pager span {
    background: var(--fm-primary-light);
    border-color: color-mix(in srgb, var(--fm-primary) 35%, transparent);
    color: var(--fm-primary);
    font-weight: 600;
}

.pager em {
    min-width: auto;
    padding: 0 4px;
    background: transparent;
    border: 0;
    color: var(--fm-muted);
    letter-spacing: 1px;
}

.pager a[title="Previous Page"],
.pager a[title="Next Page"] {
    min-width: 36px;
    height: 34px;
    padding: 0;
    font-size: 20px;
    border-radius: 0.25rem;
    background: var(--fm-card);
    border-color: var(--fm-border);
    color: var(--fm-text-sub);
    box-shadow: none;
}

.pager a[title="Previous Page"] i,
.pager a[title="Next Page"] i {
    width: 20px;
    height: 20px;
    font-size: 20px;
    line-height: 1;
}

.pager a[title="Previous Page"] svg,
.pager a[title="Next Page"] svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2.4;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pager a[title="Previous Page"]:hover,
.pager a[title="Next Page"]:hover {
    background: var(--fm-primary-light);
    border-color: color-mix(in srgb, var(--fm-primary) 35%, transparent);
    color: var(--fm-primary);
}

.post-panel {
    position: relative;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    margin-bottom: 14px;
}

.pal-ops {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.pal-op {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 0.25rem;
    color: var(--fm-muted);
    font-size: 12.5px;
    text-decoration: none;
    transition: color .15s, background .15s;
}

.pal-op:hover {
    background: color-mix(in srgb, var(--fm-primary) 10%, transparent);
    color: var(--fm-primary);
}

.pal-op-wrap {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.pal-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 50;
    min-width: 120px;
    padding: 5px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .12);
}

.pal-menu[hidden] {
    display: none !important;
}

.pal-menu a {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 0.2rem;
    font-size: 13px;
    color: var(--fm-text);
    text-decoration: none;
    white-space: nowrap;
}

.pal-menu a:hover {
    background: color-mix(in srgb, var(--fm-primary) 8%, transparent);
    color: var(--fm-primary);
}

.pal-menu-del:hover {
    background: #fdeaea !important;
    color: #d9534f !important;
}

.cl-modal-box.cl-modal-wide {
    max-width: 920px;
    height: calc(100vh - 48px);
    max-height: none;
}

.ceh-body {
    display: flex;
    gap: 0;
    padding: 0;
    min-height: 0;
    max-height: none;
}

.ceh-list {
    flex: 0 0 250px;
    overflow-y: auto;
    padding: 12px;
    border-right: 1px solid var(--fm-line);
}

.ceh-item {
    display: block;
    padding: 10px 12px;
    border-radius: 6px;
    text-decoration: none;
}

.ceh-item:hover {
    background: var(--fm-tint-blue);
}

.ceh-item.active {
    background: var(--fm-tint-blue);
}

.ceh-item b {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: #4a90e2;
}

.ceh-item span {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 6px;
    font-size: 12px;
    color: #4a90e2;
}

.ceh-avatar {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    object-fit: cover;
    font-size: 10px;
    color: #fff;
}

.ceh-diff {
    flex: 1 1 auto;
    min-width: 0;
    overflow: auto;
    padding: 14px;
}

.ceh-diff-body {
    font-size: 12.5px;
}

.ceh-diff-table {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid #eceae0;
    border-radius: 6px;
    overflow: hidden;
    font-family: Consolas, Monaco, "Courier New", monospace;
}

.ceh-row td {
    padding: 4px 10px;
    vertical-align: top;
    border-bottom: 1px dashed #f0eee6;
}

.ceh-row:last-child td {
    border-bottom: 0;
}

.ceh-ln {
    width: 40px;
    text-align: right;
    color: #a8a49a;
    user-select: none;
}

.ceh-code {
    white-space: pre-wrap;
    word-break: break-all;
    color: var(--fm-text);
}

.ceh-row.is-del {
    background: var(--fm-tint-red);
}

.ceh-row.is-del .ceh-code {
    color: #c9302c;
}

.ceh-row.is-add {
    background: var(--fm-tint-green);
}

.ceh-row.is-add .ceh-code {
    color: #2e9e5b;
}

.fp-limit {
    padding: 34px 18px 40px;
    text-align: center;
}

.fp-limit p {
    margin: 0 0 16px;
    font-size: 14px;
    color: #d9534f;
}

.fp-panel {
    padding-bottom: 18px;
}

.fp-form {
    padding: 0 18px;
}

.fp-field {
    margin-top: 16px;
}

.fp-title {
    width: 100%;
    height: 46px;
    padding: 0 14px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 15px;
    color: var(--fm-text-strong);
}

.fp-title:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--fm-primary) 12%, transparent);
}

.fp-meta-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 12px;
    margin-top: 12px;
}

.fp-select {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fp-select select {
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
}

.fp-select select:focus {
    border-color: var(--fm-primary);
}

.fp-editor-wrap {
    margin-top: 16px;
}

.fp-editor {
    min-height: 430px;
}

.fp-fallback {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    font-size: 14px;
    line-height: 1.9;
    resize: vertical;
}

.fp-extra {
    margin-top: 14px;
    border: 1px solid var(--fm-line);
    border-radius: var(--fm-radius);
    background: var(--fm-soft);
}

.fp-extra summary {
    padding: 11px 14px;
    font-size: 13px;
    color: var(--fm-text-sub);
    cursor: pointer;
}

.fp-extra-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    padding: 0 14px 14px;
}

.fp-field-inline {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1 1 200px;
    min-width: 0;
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.fp-field-inline input {
    height: 36px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 13px;
}

.fp-field-inline input:focus {
    border-color: var(--fm-primary);
}

.fp-tags-line {
    margin-top: 14px;
}

.fp-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
}

.fp-foot-right {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.fp-foot .fp-captcha {
    margin-top: 0;
    width: 200px;
    height: 36px;
    padding: 0 10px 0 4px;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    overflow: hidden;
}

.fp-foot .fp-captcha img {
    flex: 0 0 auto;
    height: 28px;
    width: auto;
    border: 0;
    cursor: pointer;
}

.fp-foot .fp-captcha input,
.fp-foot .fp-captcha .captcha_input {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    height: 100%;
    margin: 0;
    padding: 0 0 0 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 13px;
    outline: none;
}

.fp-note {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.8;
    color: var(--fm-muted);
}

.fp-note-warn {
    display: block;
    margin-bottom: 2px;
    font-weight: 600;
    color: #d9534f;
}

.fp-note a {
    color: var(--fm-primary);
    text-decoration: none;
}

.fp-reason {
    margin-top: 14px;
}

.fp-reason label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fp-reason input {
    width: 100%;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
}

.fp-reason input:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--fm-primary) 12%, transparent);
}

.ceh-item em {
    display: block;
    margin-top: 4px;
    font-style: normal;
    font-size: 12px;
    color: #b98b1f;
    word-break: break-all;
}

.fp-submit {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 38px;
    padding: 0 20px;
    border: 0;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

.fp-submit:hover {
    opacity: .9;
}

.fp-submit:disabled {
    opacity: .6;
    cursor: default;
}

.fp-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: 10px 14px;
    margin-top: 12px;
}

.fp-tag-wrap {
    position: relative;
}

.fp-tag {
    padding: 0;
    border: 0;
    background: none;
    font-size: 13px;
    color: var(--fm-text-sub);
    cursor: pointer;
}

.fp-tag:hover,
.fp-tag.is-open {
    color: var(--fm-primary);
}

.fp-tag.is-on {
    color: var(--fm-primary);
    font-weight: 600;
}

.fp-tag-panel {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 60;
    min-width: 260px;
    padding: 12px 14px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
}

.fp-tag-panel[hidden] {
    display: none !important;
}

.fp-tag-panel-sm {
    min-width: 170px;
    padding: 6px;
}

.fp-tag-opt {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-text);
    text-decoration: none;
}

.fp-tag-opt:hover {
    background: color-mix(in srgb, var(--fm-primary) 8%, transparent);
    color: var(--fm-primary);
}

.fp-tag-opt.is-on {
    color: var(--fm-primary);
}

.fp-tag-opt .fp-vip-ic {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    vertical-align: -2px;
}

.fp-tag-opt.is-vip-locked {
    color: var(--fm-muted);
    cursor: not-allowed;
    opacity: .75;
}

.fp-tag-opt.is-vip-locked .fp-vip-ic {
    opacity: .45;
}

.fp-tag-opt.is-vip-locked:hover {
    background: none;
    color: var(--fm-muted);
}

.fp-bounty-panel {
    width: 440px;
    max-width: 92vw;
}

.fp-bounty-head {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text);
}

.fp-bounty-head em {
    margin-left: auto;
    font-style: normal;
    font-size: 13px;
    font-weight: 400;
    color: var(--fm-text-sub);
}

.fp-switch {
    position: relative;
    display: inline-block;
    flex: 0 0 auto;
    width: 42px;
    height: 24px;
}

.fp-switch input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
}

.fp-switch-slider {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: var(--fm-soft-2);
    cursor: pointer;
    transition: background .15s;
}

.fp-switch-slider::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--fm-card);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
    transition: transform .15s;
}

.fp-switch input:checked+.fp-switch-slider {
    background: var(--fm-primary);
}

.fp-switch input:checked+.fp-switch-slider::after {
    transform: translateX(18px);
}

.fp-bounty-body {
    margin-top: 12px;
}

.fp-bounty-row {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fp-bounty-row input {
    flex: 1 1 auto;
    min-width: 0;
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    font-size: 13px;
}

.fp-bounty-note {
    margin: 8px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
}

.fp-bounty-warn {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 12px 0 0;
    padding: 10px 12px;
    border: 1px dashed #e8a0a0;
    border-radius: 0.25rem;
    background: var(--fm-tint-red);
    font-size: 12.5px;
    line-height: 1.7;
    color: #d9534f;
}

.fp-bounty-warn i {
    margin-top: 3px;
}

.fp-poll-panel {
    width: 440px;
    max-width: 92vw;
}

.fp-poll-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fp-poll-row:first-child {
    margin-top: 0;
}

.fp-poll-row > span {
    flex: 0 0 118px;
    line-height: 1.6;
}

.fp-poll-row input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
}

.fp-poll-radios {
    display: flex;
    align-items: center;
    gap: 16px;
}

.fp-poll-radio {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: var(--fm-text-sub);
    cursor: pointer;
}

.fp-poll-row-options {
    align-items: flex-start;
}

.fp-poll-row-options > span {
    padding-top: 8px;
}

.fp-poll-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 36px;
    padding: 5px 8px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
}

.fp-poll-chiplist {
    display: contents;
}

.fp-poll-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    max-width: 100%;
    padding: 4px 8px;
    border-radius: 0.25rem;
    background: color-mix(in srgb, var(--fm-primary) 10%, transparent);
    font-size: 12.5px;
    color: var(--fm-primary);
    cursor: pointer;
}

.fp-poll-chip i {
    font-size: 11px;
    opacity: .7;
}

.fp-poll-chip:hover i {
    opacity: 1;
}

.fp-poll-chipinput {
    flex: 1 1 120px;
    min-width: 96px;
    height: 26px;
    border: 0;
    background: none;
    font-size: 13px;
    color: var(--fm-text);
    outline: none;
}

.fp-poll-value {
    display: none;
}

.fp-poll-hint {
    margin: 8px 0 0 128px;
    font-size: 12px;
    color: var(--fm-muted);
}

.fp-panel .fp-head {
    padding-bottom: 14px;
}

.fp-panel .fp-head .post-title {
    gap: 10px;
}

.fp-panel .fp-head-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 0.375rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 14px;
}

.fp-panel .fp-form {
    padding: 0 20px;
}

.fp-panel .fp-title {
    height: 36px;
    padding: 0 16px;
    border-radius: 0.375rem;
    font-size: 16px;
    font-weight: 600;
    transition: border-color .15s, box-shadow .15s;
}

.fp-panel .fp-title::placeholder {
    font-weight: 400;
    color: #b6b1a0;
}

.fp-panel .fp-title:hover {
    border-color: #d8d1bc;
}

.fp-panel .fp-title:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--fm-primary) 12%, transparent);
}

.fp-panel .fp-select > span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-weight: 600;
}

.fp-panel .fp-select > span i {
    color: var(--fm-primary);
    font-size: 12px;
}

.fp-panel .fp-select select {
    -webkit-appearance: none;
    appearance: none;
    height: 36px;
    padding: 0 32px 0 12px;
    border-radius: 0.375rem;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%238b8879' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 11px center;
    transition: border-color .15s, box-shadow .15s;
}

.fp-panel .fp-select select:hover {
    border-color: #d8d1bc;
}

.fp-panel .fp-select select:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--fm-primary) 12%, transparent);
}

.fp-panel .fp-tags {
    gap: 8px;
    margin-top: 13px;
}

.fp-panel .fp-tag {
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 13px;
    border: 1px solid var(--fm-border);
    border-radius: 5px;
    background: var(--fm-soft);
    font-size: 12.5px;
    color: var(--fm-text-sub);
    transition: color .15s, background .15s, border-color .15s;
}

.fp-panel .fp-tag:hover,
.fp-panel .fp-tag.is-open {
    border-color: color-mix(in srgb, var(--fm-primary) 40%, #fff);
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.fp-panel .fp-tag.is-on {
    border-color: var(--fm-primary);
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-weight: 600;
}

.fp-panel .fp-editor-wrap .vditor {
    --border-color: var(--fm-border);
    --toolbar-background-color: #fbfaf6;
    border-radius: 0.375rem;
    transition: border-color .15s, box-shadow .15s;
}

.fp-panel .fp-editor-wrap .vditor-toolbar {
    border-radius: 0.375rem 0.375rem 0 0;

    padding-left: 15px !important;
}

.fp-panel .fp-editor-wrap .vditor-reset {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.fp-panel .fp-editor-wrap:focus-within .vditor {
    --border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--fm-primary) 10%, transparent);
}

.fp-panel .vditor-toolbar__item .fp-tool-btn i {
    font-size: 15px;
    line-height: 1;
}

.fp-panel .fp-tags-line span i {
    margin-right: 4px;
    color: var(--fm-primary);
    font-size: 11px;
}

.fp-panel .fp-field-inline input,
.fp-panel .fp-reason input {
    border-radius: 0.375rem;
    transition: border-color .15s, box-shadow .15s;
}

.fp-panel .fp-field-inline input:hover,
.fp-panel .fp-reason input:hover {
    border-color: #d8d1bc;
}

.fp-panel .fp-field-inline input:focus,
.fp-panel .fp-reason input:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--fm-primary) 12%, transparent);
}

.fp-panel .fp-extra {
    border-radius: 0.375rem;
    background: var(--fm-soft);
    overflow: hidden;
}

.fp-panel .fp-extra summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    font-weight: 600;
    list-style: none;
    transition: color .15s;
}

.fp-panel .fp-extra summary::-webkit-details-marker {
    display: none;
}

.fp-panel .fp-extra summary:hover {
    color: var(--fm-primary);
}

.fp-panel .fp-extra-lead {
    font-size: 12px;
    color: var(--fm-primary);
}

.fp-panel .fp-extra-caret {
    margin-left: auto;
    font-size: 11px;
    color: var(--fm-muted);
    transition: transform .2s;
}

.fp-panel .fp-extra[open] .fp-extra-caret {
    transform: rotate(180deg);
}

.fp-panel .fp-extra[open] summary {
    border-bottom: 1px solid var(--fm-line);
}

.fp-panel .fp-links {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
}

.fp-panel .fp-link-row {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    width: 100%;
}

.fp-panel .fp-link-url {
    flex: 1 1 auto;
    min-width: 0;
}

.fp-panel .fp-link-pwd {
    flex: 0 0 140px;
}

.fp-panel .fp-link-del {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    padding: 0;
    border: 1px solid var(--fm-border);
    border-radius: 0.375rem;
    background: var(--fm-card);
    color: var(--fm-muted);
    font-size: 13px;
    cursor: pointer;
    transition: color .15s, border-color .15s, background .15s;
}

.fp-panel .fp-link-del:hover {
    border-color: #e8b7b2;
    background: var(--fm-tint-red);
    color: #d9534f;
}

.fp-panel .fp-link-del[hidden] {
    display: none;
}

.fp-panel .fp-link-add {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 2px;
    padding: 7px 14px;
    border: 1px dashed var(--fm-border);
    border-radius: 0.375rem;
    background: var(--fm-card);
    font-size: 12.5px;
    color: var(--fm-text-sub);
    cursor: pointer;
    transition: color .15s, border-color .15s, background .15s;
}

.fp-panel .fp-link-add:hover {
    border-color: var(--fm-primary);
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.fp-panel .fp-link-add:disabled {
    opacity: .5;
    cursor: not-allowed;
}

.fp-panel .fp-link-add i {
    font-size: 11px;
}

.fp-panel .fp-note {
    max-width: 620px;
    padding: 10px 14px;
    border: 1px solid #f0e3c0;
    border-radius: 0.375rem;
    background: var(--fm-tint-gold);
}

.fp-panel .fp-note-warn i {
    margin-right: 4px;
}

.fp-panel .fp-submit {
    height: 44px;
    padding: 0 26px;
    border-radius: 0.375rem;
    background: linear-gradient(135deg, var(--fm-primary), var(--fm-primary-dark));
    font-size: 15px;
    box-shadow: 0 6px 16px color-mix(in srgb, var(--fm-primary) 26%, transparent);
    transition: transform .15s, box-shadow .15s;
}

.fp-panel .fp-submit:hover {
    opacity: 1;
    transform: translateY(-1px);
    box-shadow: 0 9px 20px color-mix(in srgb, var(--fm-primary) 32%, transparent);
}

.fp-panel .fp-submit:active {
    transform: translateY(0);
}

.fp-limit .fp-submit {
    height: 38px;
    padding: 0 20px;
    border-radius: var(--fm-radius);
    background: linear-gradient(135deg, var(--fm-primary), var(--fm-primary-dark));
    font-size: 14px;
    box-shadow: 0 4px 12px color-mix(in srgb, var(--fm-primary) 24%, transparent);
    transition: transform .15s, box-shadow .15s;
}

.fp-limit .fp-submit:hover {
    opacity: 1;
    transform: translateY(-1px);
    box-shadow: 0 7px 18px color-mix(in srgb, var(--fm-primary) 30%, transparent);
}

.fp-limit .fp-submit:active {
    transform: translateY(0);
}

.fp-panel .fp-foot .fp-submit {
    height: 36px;
    padding: 0 16px;
    gap: 5px;
    font-size: 13.5px;
    box-shadow: 0 3px 10px color-mix(in srgb, var(--fm-primary) 20%, transparent);
}

.fp-panel .fp-foot .fp-submit:hover {
    box-shadow: 0 5px 14px color-mix(in srgb, var(--fm-primary) 26%, transparent);
}

@media (max-width: 768px) {
    .fp-panel .fp-form {
        padding: 0 14px;
    }

    .fp-panel .fp-title {
        height: 36px;
        font-size: 15px;
    }

    .fp-panel .fp-foot {
        flex-direction: column;
        align-items: stretch;
    }

    .fp-panel .fp-foot-right {
        width: 100%;
    }

    .fp-panel .fp-foot-right .fp-submit {
        flex: 1 1 auto;
        justify-content: center;
    }

    .fp-panel .fp-link-row {
        flex-wrap: wrap;
        gap: 8px;
    }

    .fp-panel .fp-link-url {
        flex: 1 1 100%;
    }

    .fp-panel .fp-link-pwd {
        flex: 1 1 120px;
    }
}

.post-poll {
    margin: 16px 0 0;
    padding: 16px 18px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-soft);
}

.post-poll-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 14px;
    color: var(--fm-text-strong);
}

.post-poll-head i {
    color: var(--fm-primary);
}

.post-poll-meta {
    margin-left: auto;
    font-size: 12px;
    color: var(--fm-muted);
}

.post-poll-options {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
}

.post-poll-options > li {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 8px;
    padding: 9px 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    overflow: hidden;
}

.post-poll-options > li.is-result {
    border-color: transparent;
    background: var(--fm-soft-2);
}

.post-poll-bar {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    background: color-mix(in srgb, var(--fm-primary) 14%, transparent);
    z-index: 0;
}

.post-poll-label {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 auto;
    min-width: 0;
    font-size: 13.5px;
    color: var(--fm-text);
    cursor: pointer;
}

.post-poll-options > li.is-mine .post-poll-label {
    color: var(--fm-primary);
    font-weight: 600;
}

.post-poll-count {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    font-size: 12px;
    color: var(--fm-muted);
}

.post-poll-foot {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
}

.post-poll-note {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
}

.fp-lottery-panel {
    width: 440px;
    max-width: 92vw;
}

.fp-lottery-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fp-lottery-row:first-child {
    margin-top: 0;
}

.fp-lottery-row[hidden] {
    display: none;
}

.fp-lottery-row > span {
    flex: 0 0 118px;
    line-height: 1.6;
}

.fp-lottery-row input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
}

.fp-pay-panel {
    width: 440px;
    max-width: 92vw;
}

.fp-pay-tip {
    margin: 0 0 12px;
    font-size: 12px;
    line-height: 1.6;
    color: var(--fm-text-sub);
}

.fp-pay-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fp-pay-row:first-of-type {
    margin-top: 0;
}

.fp-pay-row > span {
    flex: 0 0 76px;
    line-height: 1.5;
}

.fp-pay-row input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
}

.fp-pay-insert {
    margin-top: 14px;
    padding: 7px 16px;
    border: none;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

/* 四个功能面板（悬赏/投票/抽奖/付费）行与提示统一 */
.fp-bounty-row,
.fp-poll-row,
.fp-lottery-row,
.fp-pay-row {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fp-bounty-row:first-child,
.fp-poll-row:first-child,
.fp-lottery-row:first-child,
.fp-pay-row:first-child,
.fp-pay-row:first-of-type {
    margin-top: 0;
}

.fp-bounty-row > span,
.fp-poll-row > span,
.fp-lottery-row > span,
.fp-pay-row > span:first-child {
    flex: 0 0 118px;
    line-height: 1.6;
}

.fp-bounty-row input[type="text"],
.fp-poll-row input[type="text"],
.fp-lottery-row input[type="text"],
.fp-pay-row input[type="text"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
}

.fp-pay-row .fp-switch {
    flex: 0 0 auto;
}

.fp-pay-tip,
.fp-poll-hint,
.fp-lottery-hint,
.fp-bounty-note {
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.7;
    color: var(--fm-muted);
}

.fp-pay-tip {
    margin: 0 0 12px;
}

.fp-lottery-radios {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
}

.fp-lottery-radio {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: var(--fm-text-sub);
    cursor: pointer;
}

.fp-lottery-hint {
    margin: 12px 0 0;
    font-size: 12px;
    line-height: 1.7;
    color: var(--fm-muted);
}

.post-lottery {
    margin: 16px 0 0;
    padding: 16px 18px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-soft);
}

.post-lottery-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 14px;
    color: var(--fm-text-strong);
}

.post-lottery-head > i {
    color: var(--fm-primary);
}

.post-lottery-status {
    margin-left: auto;
    padding: 2px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.6;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.post-lottery-status.status-1 {
    background: color-mix(in srgb, var(--fm-primary) 16%, transparent);
}

.post-lottery-status.status-2 {
    background: var(--fm-soft);
    color: var(--fm-muted);
}

.post-lottery-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 18px;
    margin-top: 10px;
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--fm-text-sub);
}

.post-lottery-meta i {
    margin-right: 4px;
    color: var(--fm-primary);
}

.post-lottery-progress {
    margin-top: 12px;
}

.fl-tip {
    margin: 0 0 6px;
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--fm-text-sub);
}

.fl-tip b {
    color: #c0392b;
}

.fl-stat {
    margin: 4px 0;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.fl-stat b {
    margin: 0 2px;
    font-size: 15px;
    color: var(--fm-primary);
}

.fl-viol {
    color: #c0392b;
    font-style: normal;
}

.post-lottery-foot {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 14px;
}

.fl-note {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
}

.post-lottery-result {
    margin-top: 12px;
}

.fl-info {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: var(--fm-radius);
    overflow: hidden;
}

.fl-info > li {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 14px;
    background: var(--fm-soft);
    font-size: 13px;
    line-height: 1.7;
    color: var(--fm-text);
}

.fl-info > li:nth-child(even) {
    background: color-mix(in srgb, var(--fm-primary) 14%, #fff);
}

.fl-label {
    flex: 0 0 auto;
    font-weight: 700;
    color: var(--fm-text);
}

.fl-value {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

.fl-winner-list {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.fl-winner-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.fl-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    object-fit: cover;
    font-size: 11px;
    color: #fff;
}

.fl-winner-name {
    font-style: normal;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-primary);
}

.fl-winner-floor {
    font-style: normal;
    font-size: 11px;
    color: var(--fm-text-sub);
}

.fl-no-win {
    font-size: 13px;
    line-height: 1.7;
    color: #c0392b;
}

.fl-contact-note {
    margin: 10px 0 0;
    text-align: center;
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.floor-right {
    display: inline-flex;
    align-items: center;
    flex: 0 0 auto;
    margin-left: auto;
    white-space: nowrap;
}

.floor-right .floor-no {
    margin-left: 0;
    white-space: nowrap;
}

.floor-top-gif {
    display: block;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    margin-right: 6px;
    object-fit: contain;
    pointer-events: none;
}

.floor-main-inner {
    position: relative;
}

.fl-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 64px;
    height: 64px;
    object-fit: contain;
    transform: rotate(-8deg);
    pointer-events: none;
    z-index: 2;
}



.fl-list-badge {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    line-height: 1.6;
    vertical-align: middle;
    white-space: nowrap;
}

.fl-list-badge-ing {
    color: var(--fm-primary);
    background: var(--fm-primary-light);
}

.fl-list-badge-done {
    color: #2f7a4f;
    background: var(--fm-tint-green);
}

.fl-list-badge-cancel {
    color: var(--fm-text-sub);
    background: var(--fm-soft);
}

.post-login-lock {
    margin: 12px 0;
}

.post-reply-lock {
    margin: 12px 0;
}

.post-panel > .hot {
    position: absolute;
    top: -5px;
    right: -5px;
    width: 50px;
    height: 50px;
    background: url("../images/hot.png") no-repeat center;
    background-size: 100% 100%;
    z-index: 9;
    pointer-events: none;
}

.post-panel > .hot ~ .post-header .post-title {
    padding-right: 46px;
}

.post-header {
    padding: 18px 20px 0;
}

.post-title {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 21px;
    line-height: 1.5;
    color: var(--fm-text-strong);
    font-weight: 700;
}

.post-author-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 11px;
    font-size: 12px;
    color: var(--fm-muted);
}

.pal-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.pal-name:hover {
    color: var(--fm-text-strong);
}

.pal-uid {
    color: var(--fm-muted);
}

.pal-time {
    color: var(--fm-muted);
}

.pal-copy {
    color: var(--fm-muted);
}

.pal-copy:hover {
    color: var(--fm-primary);
}

.page-author-line {
    padding-bottom: 14px;
}

.page-author-line .pal-revised a {
    color: var(--fm-primary);
}

.page-author-line .pal-revised a:hover {
    color: var(--fm-primary-dark);
}

.post-stat-bar {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    height: 40px;
    margin-top: 4px;
    font-size: 12px;
    color: var(--fm-muted);
}

.post-stat-bar::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 1px;
    background: var(--fm-line);
}

.psb-right {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    gap: 16px;
    padding: 5px 14px;
    background: var(--fm-card);
    border-radius: 0.25rem;
}

.psb-item {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 13px;
    color: var(--fm-text);
}

.psb-item svg {
    width: 17px;
    height: 17px;
    fill: #c3bfae;
    stroke: none;
}

.psb-side-toggle {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
}

.psb-side-toggle-track {
    position: relative;
    display: block;
    width: 34px;
    height: 18px;
    border-radius: 9px;
    background: var(--fm-soft-2);
    transition: background-color .15s ease;
}

.psb-side-toggle-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: var(--fm-card);
    box-shadow: 0 1px 2px rgba(40, 36, 24, .22);
    transition: transform .15s ease;
}

.psb-side-toggle:hover .psb-side-toggle-track {
    background: var(--fm-soft-2);
}

.psb-side-toggle[aria-checked="true"] .psb-side-toggle-track {
    background: var(--fm-primary);
}

.psb-side-toggle[aria-checked="true"]:hover .psb-side-toggle-track {
    background: var(--fm-primary-dark);
}

.psb-side-toggle[aria-checked="true"] .psb-side-toggle-thumb {
    transform: translateX(16px);
}

.post-body {
    padding: 20px;
}

.post-main {
    min-width: 0;
}

.post-content {
    font-size: 15px;
    line-height: 1.85;
    color: var(--fm-text);
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.post-content p {
    margin: 0 0 14px;
}

.post-content img {
    max-width: 100%;
    height: auto;
    border-radius: 0.25rem;
}

.post-content h1,
.post-content h2,
.post-content h3,
.post-content h4 {
    margin: 22px 0 12px;
    color: var(--fm-text-strong);
    line-height: 1.4;
}

.post-content h2 {
    font-size: 18px;
    padding-left: 10px;
    border-left: 3px solid var(--fm-primary);
}

.post-content h3 {
    font-size: 16px;
}

.post-content a {
    color: var(--fm-primary);
}

.post-content ul,
.post-content ol {
    margin: 0 0 14px 22px;
}

.post-content ul {
    list-style: disc;
}

.post-content ol {
    list-style: decimal;
}

.post-content li {
    margin-bottom: 5px;
}

.post-content blockquote {
    margin: 0 0 14px;
    padding: 10px 14px;
    background: var(--fm-soft);
    border-left: 3px solid #d9d4c4;
    color: var(--fm-text-sub);
    border-radius: 0 0.25rem 0.25rem 0;
}

.post-content code {
    background: var(--fm-soft-2);
    padding: 2px 5px;
    border-radius: 0.25rem;
    font-size: 13px;
    font-family: Menlo, Consolas, Monaco, monospace;
    color: #c7254e;
}

.post-content pre {
    background: #2f3238;
    color: #e6e6e6;
    padding: 14px;
    border-radius: 0.25rem;
    overflow-x: auto;
    margin: 0 0 14px;
    font-size: 13px;
    line-height: 1.7;
}

.post-content pre code {
    background: transparent;
    color: inherit;
    padding: 0;
}

.post-content table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 14px;
    font-size: 13px;
}

.post-content th,
.post-content td {
    border: 1px solid var(--fm-border);
    padding: 8px 10px;
}

.post-content th {
    background: var(--fm-soft);
}

.post-content hr {
    border: 0;
    border-top: 1px solid var(--fm-line);
    margin: 20px 0;
}

.post-content-wrap {
    position: relative;
}

.post-ban-tip {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 2px 0 18px;
    padding: 14px 16px;
    border: 1px dashed var(--fm-border);
    border-radius: 6px;
    background: var(--fm-card);
    font-size: 13.5px;
    line-height: 1.7;
    color: var(--fm-text);
}

.post-ban-tip i {
    color: #c9a227;
    font-size: 13px;
}

.ban-mute-badge {
    display: inline-flex;
    align-items: center;
    height: 16px;
    margin: 0 2px 0 4px;
    padding: 0 4px;
    border: 1px solid #e05151;
    border-radius: 4px;
    font-size: 10px;
    font-style: normal;
    font-weight: 500;
    line-height: 1;
    color: #e05151;
    vertical-align: 1px;
    white-space: nowrap;
}

html[data-theme="dark"] .ban-mute-badge {
    border-color: #e57373;
    color: #e57373;
}

.floor-ban-tip {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 6px 0 8px;
    padding: 10px 14px;
    border: 1px dashed var(--fm-border);
    border-radius: 6px;
    background: var(--fm-card);
    font-size: 13px;
    line-height: 1.7;
    color: var(--fm-text);
}

.floor-ban-tip i {
    color: #c9a227;
}

.post-content-wrap.is-collapsed .post-content {
    max-height: 600px;
    overflow: hidden;
}

.post-content-wrap.is-collapsed::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 120px;
    background: linear-gradient(rgba(255, 255, 255, 0), var(--fm-card) 78%);
    pointer-events: none;
}

.post-expand-bar {
    display: none;
    margin-top: 12px;
    text-align: center;
}

.post-content-wrap.has-expand .post-expand-bar {
    display: block;
}

.post-content-wrap.is-collapsed.has-expand .post-expand-bar {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 12px;
    z-index: 2;
    margin-top: 0;
}

.post-expand-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 36px;
    padding: 0 20px;
    border: 1px solid var(--fm-border);
    border-radius: 999px;
    background: var(--fm-card);
    color: var(--fm-text);
    font-size: 13px;
    cursor: pointer;
    box-shadow: 0 2px 8px rgba(60, 56, 40, .1);
    transition: color .2s, border-color .2s;
}

.post-expand-btn:hover {
    color: var(--fm-primary);
    border-color: var(--fm-primary);
}

.post-expand-btn i {
    font-size: 12px;
    transition: transform .25s;
}

.post-content-wrap:not(.is-collapsed) .post-expand-btn i {
    transform: rotate(180deg);
}

.widget-author .widget-body {
    padding: 16px;
}

.ap-head {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ap-avatar {
    flex: 0 0 auto;
    display: block;
    width: 62px;
    height: 62px;
    border-radius: 50%;
    overflow: hidden;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(90, 82, 60, .12);
}

.ap-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ap-avatar .forum-letter-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    font-size: 24px;
}

.ap-info {
    flex: 1 1 auto;
    min-width: 0;
}

.ap-name {
    display: block;
    font-size: 17px;
    font-weight: 700;
    color: var(--fm-text-strong);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ap-tags {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.ap-uid,
.ap-tags .fm-tag {
    display: inline-block;
    padding: 0.25em 0.4em;
    border-radius: 0.25rem;
    font-size: 10.5px;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
}

.ap-uid {
    background: #ff95a7;
    color: #fff;
}

.ap-tags .follow-btn {
    display: inline-flex;
    align-items: center;
    height: auto;
    padding: 0.25em 0.6em;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1;
}

.ap-tags .follow-btn:hover {
    background: var(--fm-primary-dark, var(--fm-primary));
    color: #fff;
}

.ap-tags .follow-btn.is-followed {
    border: 1px solid var(--fm-border);
    background: var(--fm-card, #faf9f5);
    color: var(--fm-text-sub);
    font-weight: 600;
}

.ap-stats {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4px;
    margin-top: 16px;
    text-align: center;
}

.ap-stats a {
    display: block;
}

.ap-stats b {
    display: block;
    font-size: 17px;
    font-weight: 700;
    color: var(--fm-primary);
}

.ap-stats span {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    color: var(--fm-muted);
}

.ap-stats a:hover b {
    color: var(--fm-primary-dark);
}

.ap-msg-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 40px;
    margin-top: 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 14px;
    color: var(--fm-text-strong);
    transition: border-color .15s, color .15s, background-color .15s;
}

.ap-msg-btn:hover {
    border-color: var(--fm-primary);
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.ap-msg-btn i {
    font-size: 14px;
    color: var(--fm-primary);
}

.resource-box {
    margin: 18px 0 6px;
    padding: 14px 16px;
    background: var(--fm-tint-green);
    border: 1px dashed #bfe0cb;
    border-radius: var(--fm-radius);
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.resource-btn {
    display: inline-flex;
    align-items: center;
    height: 34px;
    padding: 0 20px;
    background: var(--fm-primary);
    color: #fff;
    border-radius: 0.25rem;
    font-size: 13px;
}

.resource-btn:hover {
    background: var(--fm-primary-dark);
    color: #fff;
}

.resource-pwd {
    font-size: 13px;
    color: var(--fm-primary);
}

.resource-pwd b {
    color: var(--fm-primary);
    letter-spacing: 1px;
}

.resource-pwd-code {
    display: inline-flex;
    align-items: center;
    padding: 2px 10px;
    border: 1px dashed var(--fm-primary);
    border-radius: 6px;
    background: #f3fbff;
    color: var(--fm-primary);
    cursor: pointer;
    transition: background .15s, border-color .15s, color .15s;
    user-select: none;
}

.resource-pwd-code:hover {
    background: var(--fm-tint-blue);
    border-color: var(--fm-primary-dark);
    color: var(--fm-primary-dark);
}

.resource-pwd-code.is-copied {
    border-color: #16a34a;
    border-style: solid;
    color: #16a34a;
    background: var(--fm-tint-green);
}

.resource-check-btn {
    display: inline-flex;
    align-items: center;
    height: 28px;
    padding: 0 12px;
    font-size: 12px;
    color: var(--fm-text-sub);
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    cursor: pointer;
    transition: color .15s, border-color .15s, background .15s;
}

.resource-check-btn:hover {
    color: var(--fm-primary);
    border-color: var(--fm-primary);
}

.resource-check-btn:disabled {
    cursor: default;
    color: var(--fm-text-sub);
    border-color: var(--fm-border);
    background: var(--fm-soft-2);
}

.resource-check-btn.is-ok {
    color: #16a34a;
    border-color: #86d3a4;
    background: var(--fm-tint-green);
}

.resource-check-btn.is-dead {
    color: #dc2626;
    border-color: #f3b4b4;
    background: var(--fm-tint-red);
}

.resource-check-btn.is-unknown {
    color: #d97706;
    border-color: #ecd39b;
    background: var(--fm-tint-gold);
}

.resource-box-multi {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
}

.resource-item {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

.resource-box-multi .resource-btn {
    align-self: flex-start;
}

.post-tags-row:empty {
    display: none;
}

.post-tags-row {
    margin-top: 16px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.post-tag {
    font-size: 12px;
    color: var(--fm-text-sub);
    background: var(--fm-soft);
    padding: 3px 10px;
    border-radius: 0.25rem;
}

.post-tag:hover {
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.post-signature {
    margin-top: 24px;
}

.sign-line {
    height: 10px;
    background: url("../images/sign.png") repeat-x left center;
}

.sign-foot {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 10px;
}

.sign-body {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 14px;
    line-height: 1.9;
    color: #b0aa9c;
}

.sign-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.act-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 34px;
    padding: 0 4px;
    border: 0;
    background: none;
    font-size: 11.9px;
    color: var(--fm-text-sub);
    cursor: pointer;
}

.act-btn svg {
    width: 15px;
    height: 15px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.act-btn:hover {
    color: var(--fm-primary);
}

.act-btn em {
    font-style: normal;
    color: var(--fm-text-sub);
}

.act-btn.is-active {
    background: none;
    color: var(--fm-primary);
}

.act-btn.is-active svg {
    fill: var(--fm-primary);
}

.reply-panel {
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    overflow: hidden;
    margin-bottom: 14px;
}

.reply-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    border-bottom: 1px solid var(--fm-line);
    background: var(--fm-soft);
}

.reply-head h2 {
    font-size: 15px;
    color: var(--fm-text-strong);
}

.reply-head h2 em {
    font-style: normal;
    font-weight: 400;
    color: var(--fm-text-sub);
}

.reply-tools {
    display: flex;
    align-items: center;
    gap: 16px;
    flex: 0 0 auto;
    font-size: 13px;
}

.reply-tools a {
    color: var(--fm-text-sub);
}

.reply-tools a:hover,
.reply-tools a.active {
    color: var(--fm-primary);
}

.reply-tip-bar {
    padding: 14px 18px;
    background: var(--fm-tint-gold);
    border-radius: 0.25rem;
    color: var(--fm-text);
    font-size: 14px;
    line-height: 1.75;
    word-break: break-word;
}

.reply-tip-bar b,
.reply-tip-bar a {
    color: var(--fm-primary);
}

.floor {
    position: relative;
    display: flex;
    gap: 14px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--fm-line);
}

.floor:last-child {
    border-bottom: 0;
}

.floor-avatar {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border: 0;
}

.floor .floor-avatar,
.floor-child .floor-avatar {
    border-radius: 50%;
}

.floor-name {
    max-width: 100%;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-primary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.floor-uid {
    font-size: 12px;
    color: var(--fm-muted);
}

.floor-at {
    font-size: 13px;
    color: var(--fm-primary);
}

.floor-op {
    display: inline-block;
    font-style: normal;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background: var(--fm-primary);
    border-radius: 0.25rem;
    padding: 0.25em 0.4em;
}

.floor-pin-badge {
    display: inline-block;
    font-style: normal;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    background: #f0a23c;
    border-radius: 0.25rem;
    padding: 0.25em 0.4em;
}

.floor-content {
    position: relative;
}

.floor-content.has-pin,
.floor-content.has-win {
    padding-right: 76px;
    min-height: 64px;
}

.floor-content.has-pin.has-win {
    padding-right: 132px;
}

.floor-pin-stamp {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 64px;
    height: 64px;
    object-fit: contain;
    transform: rotate(-8deg);
    pointer-events: none;
    z-index: 2;
}

.floor-content.has-win .floor-pin-stamp {
    right: 68px;
}

.floor-pin.is-on {
    color: var(--fm-primary);
}

.floor-main {
    flex: 1 1 auto;
    min-width: 0;
}

.floor-head {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.floor-no {
    margin-left: auto;
    font-size: 12px;
    color: var(--fm-muted);
}

.floor-time {
    margin-top: 3px;
    font-size: 12px;
    color: var(--fm-muted);
}

.floor-tail {
    display: inline-block;
    max-width: 60%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
}

.floor-actions {
    display: inline-flex;
    gap: 14px;
    margin-top: 10px;
}

.floor-actions a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--fm-text-sub);
    font-size: 13px;
}

.floor-actions a:hover {
    color: var(--fm-primary);
}

.floor-actions svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.floor-actions em {
    font-style: normal;
}

.floor-best {
    background: linear-gradient(90deg, rgba(255, 167, 38, .14), rgba(255, 167, 38, .03) 60%);
}

.floor-best-tag {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 9px;
    border-radius: 999px;
    background: rgba(240, 162, 60, .14);
    color: #d97b0d;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}

.floor-best-tag i {
    font-size: 12px;
}

.floor-content {
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.8;
    color: var(--fm-text);
    word-wrap: break-word;
}

.floor-content p {
    margin-bottom: 8px;
}

.floor-content img {
    max-width: 100%;
    border-radius: 0.25rem;
}

.floor-children {
    margin-top: 12px;
    padding-top: 10px;
    border-top: 1px dashed var(--fm-line);
}

.floor-child {
    display: flex;
    gap: 10px;
    padding: 10px 0;
}

.floor-child-body {
    flex: 1 1 auto;
    min-width: 0;
}

.floor-child .floor-avatar {
    width: 36px;
    height: 36px;
    margin: 0;
    font-size: 15px;
    line-height: 36px;
}

.floor-child .floor-content {
    font-size: 13px;
    margin-top: 6px;
}

.floor-child .floor-actions {
    font-size: 12px;
}

.floor-quote {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    padding: 8px 40px 8px 14px;
    background: var(--fm-tint-blue);
    border: 1px dashed #c9d6e3;
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.floor-quote-avatar {
    flex: 0 0 auto;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    object-fit: cover;
}

.floor-quote-name {
    flex: 0 0 auto;
    color: #5c6d80;
}

.floor-quote-text {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.floor-quote-mark {
    position: absolute;
    right: 8px;
    bottom: -10px;
    width: 46px;
    height: 46px;
    opacity: .55;
    pointer-events: none;
    user-select: none;
    -webkit-user-select: none;
}

.floor-empty {
    padding: 40px 20px;
    text-align: center;
    color: var(--fm-text-sub);
    font-size: 13px;
}

.floor-empty-pic {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 28px 20px;
}

.floor-empty-pic img {
    width: 150px;
    max-width: 60%;
    height: auto;
    opacity: .9;
}

.comment-pager {
    padding: 14px 20px;
    border-top: 1px solid var(--fm-line);
    text-align: center;
}

.comment-pager a,
.comment-pager span {
    display: inline-block;
    min-width: 30px;
    height: 30px;
    line-height: 30px;
    padding: 0 8px;
    margin: 0 3px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    font-size: 12px;
}

.comment-pager span.current {
    background: var(--fm-primary);
    border-color: var(--fm-primary);
    color: #fff;
}

.smilie-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 2px;
    border: 0;
    background: none;
    font-size: 14px;
    color: var(--fm-text);
    cursor: pointer;
}

.smilie-btn svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.smilie-btn:hover {
    color: var(--fm-primary);
}

.smilie-panel {
    position: absolute;
    z-index: 1300;
    display: none;
    width: 344px;
    max-width: calc(100vw - 20px);
    max-height: 158px;
    padding: 6px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    box-shadow: var(--fm-shadow);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--fm-border) transparent;
}

.smilie-panel::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.smilie-panel::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: var(--fm-soft-2);
}

.smilie-panel::-webkit-scrollbar-thumb:hover {
    background: var(--fm-primary);
}

.smilie-panel::-webkit-scrollbar-track {
    background: transparent;
}

.smilie-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 10%;
    height: 32px;
    line-height: 1;
    border-radius: 0.25rem;
    cursor: pointer;
}

.smilie-item img {
    width: 26px;
    height: 26px;
}

.smilie-item:hover {
    background: var(--fm-tint-blue);
}

.smilie-img {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 1px;
    vertical-align: -6px;
}

.markdown.post-content audio,
.markdown.post-content video {
    display: block;
    width: 100%;
    max-width: 100%;
    margin: 12px 0;
    border-radius: var(--fm-radius);
}

.markdown.post-content iframe {
    display: block;
    max-width: 100%;
    margin: 12px 0;
    border: 0;
    border-radius: var(--fm-radius);
}

.reply-list-text .smilie-img,
.floor-quote-text .smilie-img {
    width: 18px;
    height: 18px;
    margin: 0 1px;
    vertical-align: -4px;
}

.comment-locked {
    color: var(--fm-muted);
    font-size: 13px;
}

.fancybox-item {
    display: inline-block;
    max-width: 100%;
    cursor: zoom-in;
}

.post-content img[data-src],
.floor-content img[data-src] {
    opacity: 0;
}

.post-content img[data-src][data-lazyph],
.floor-content img[data-src][data-lazyph] {
    opacity: 1;
    object-fit: contain;
    background-color: var(--fm-soft);
}

.post-content img.is-loaded,
.floor-content img.is-loaded {
    opacity: 1;
    transition: opacity .3s ease;
}

/* 懒加载动画效果（预载图被真实图替换时播放） */
.lazy-anim-blur .post-content img[data-src][data-lazyph]:not(.is-loaded),
.lazy-anim-blur .floor-content img[data-src][data-lazyph]:not(.is-loaded) {
    filter: blur(12px);
}

.lazy-anim-fade .post-content img[data-lazyph].is-loaded,
.lazy-anim-fade .floor-content img[data-lazyph].is-loaded {
    animation: forumLazyFade .4s ease;
}

.lazy-anim-blur .post-content img[data-lazyph].is-loaded,
.lazy-anim-blur .floor-content img[data-lazyph].is-loaded {
    animation: forumLazyBlur .45s ease;
}

.lazy-anim-zoom .post-content img[data-lazyph].is-loaded,
.lazy-anim-zoom .floor-content img[data-lazyph].is-loaded {
    animation: forumLazyZoom .35s ease;
}

@keyframes forumLazyFade {
    from {
        opacity: .15;
    }
    to {
        opacity: 1;
    }
}

@keyframes forumLazyBlur {
    from {
        filter: blur(14px);
    }
    to {
        filter: blur(0);
    }
}

@keyframes forumLazyZoom {
    from {
        transform: scale(1.05);
    }
    to {
        transform: scale(1);
    }
}

/* 余额(¥钱包) 面板 */
.balance-card {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 18px;
    padding: 18px 22px;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--fm-primary) 72%, #000),
        var(--fm-primary));
    border-radius: var(--fm-radius);
    color: #fff;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--fm-primary) 22%, transparent);
}

.balance-card-label {
    font-size: 13px;
    opacity: .9;
}

.balance-card-amount {
    flex: 1;
    font-size: 26px;
    font-weight: 700;
}

.balance-card-btn {
    padding: 8px 18px;
    border: none;
    border-radius: calc(var(--fm-radius) - 4px);
    background: #fff;
    color: var(--fm-primary);
    font-weight: 600;
    cursor: pointer;
    transition: transform .15s ease, box-shadow .15s ease;
}

.balance-card-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, .18);
}

.balance-field {
    margin-top: 16px;
}

.balance-field > label {
    display: block;
    margin-bottom: 8px;
    font-size:14px;
    color: var(--fm-text);
    font-weight: 600;
}

.balance-opts {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.balance-opts a {
    display: inline-block;
    padding: 9px 16px;
    border: 1px solid var(--fm-line);
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    color: var(--fm-text);
}

.balance-opts a.active {
    border-color: var(--fm-primary, #3f9e63);
    color: var(--fm-primary, #3f9e63);
    background: var(--fm-tint-green, #eef7f1);
    font-weight: 600;
}

.balance-custom {
    margin-top: 10px;
    width: 200px;
    padding: 9px 12px;
    border: 1px solid var(--fm-line);
    border-radius: 6px;
}

.balance-modal-foot {
    margin-top: 18px;
}

/* 余额 Tab 切换：充值 / 兑换 / 记录（与帖子/硬币标签页同款 .uc-tabs 样式） */
.balance-tab-panel[hidden] {
    display: none;
}

.balance-pay-btn {
    width: 100%;
    padding: 13px;
    border: none;
    border-radius: 8px;
    background: var(--fm-primary, #3f9e63);
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
}

.balance-pay-btn:disabled {
    opacity: .5;
    cursor: not-allowed;
}

.balance-manual {
    margin-top: 14px;
}

.balance-log-title {
    margin: 18px 0 10px;
    font-size: 15px;
}

.balance-coin-rate {
    margin: 0 0 6px;
    font-size: 13px;
    color: #8b8879;
}

.balance-change.up {
    color: #2f7e4f;
}

.balance-change.down {
    color: #e05666;
}

/* 作者收益汇总 */
.uc-earn-page {
    margin: 16px;
    padding: 20px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
}

.earn-cards {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 12px;
    margin: 0;
}

.earn-card {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
}

.earn-card-icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    font-size: 20px;
}

.earn-card-icon.i-rmb {
    background: color-mix(in srgb, var(--fm-primary) 14%, transparent);
    color: var(--fm-primary);
}

.earn-card-icon.i-coin {
    background: rgba(245, 158, 11, .16);
    color: #d97706;
}

.earn-card-icon.i-sale {
    background: rgba(59, 130, 246, .14);
    color: #2563eb;
}

.earn-card-icon.i-sale-coin {
    background: rgba(139, 92, 246, .14);
    color: #7c3aed;
}

.earn-card-main {
    min-width: 0;
}

.earn-card-label {
    display: block;
    font-size: 12px;
    color: #8b8879;
}

.earn-card-amount {
    display: block;
    margin: 4px 0 2px;
    font-size: 20px;
    font-weight: 700;
    color: var(--fm-text);
}

.earn-card-sub {
    font-size: 12px;
    color: #8b8879;
}

.earn-total {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 16px 0;
    padding: 14px 18px;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--fm-primary) 72%, #000),
        var(--fm-primary));
    border-radius: var(--fm-radius);
    font-size: 14px;
    color: #fff;
    box-shadow: 0 6px 18px color-mix(in srgb, var(--fm-primary) 22%, transparent);
}

.earn-total i {
    font-size: 18px;
}

.earn-total b {
    color: #fff;
}

.earn-up {
    color: var(--fm-primary);
}

/* 收益页记录区块：各自框成独立卡片 */
.uc-earn-page > .earn-panel {
    margin: 18px 0 0;
    padding: 16px 18px;
    background: var(--fm-soft);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
}

.uc-earn-page > .earn-panel + .earn-panel {
    margin-top: 22px;
}

.uc-earn-page > .earn-panel:last-child {
    margin-bottom: 0;
}

/* 打赏作者 */
.post-reward {
    margin-top: 14px;
    text-align: center;
}

.reward-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 20px;
    border: 1px solid var(--fm-primary);
    border-radius: 20px;
    background: var(--fm-card);
    color: var(--fm-primary);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.reward-btn:hover {
    background: var(--fm-primary);
    color: #fff;
}

.reward-btn:disabled {
    opacity: .5;
    cursor: not-allowed;
}

.reward-modal {
    position: fixed;
    inset: 0;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: center;
}

.reward-modal[hidden] {
    display: none;
}

.reward-mask {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, .45);
}

.reward-panel {
    position: relative;
    width: 340px;
    max-width: 92vw;
    background: #fff;
    border-radius: var(--fm-radius);
    overflow: hidden;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .2);
}

.reward-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 16px;
    border-bottom: 1px solid var(--fm-line);
    font-size: 15px;
    color: var(--fm-text);
}

.reward-close {
    border: none;
    background: none;
    font-size: 22px;
    line-height: 1;
    color: #999;
    cursor: pointer;
}

.reward-body {
    padding: 16px;
}

.reward-balance {
    margin: 0 0 14px;
    padding: 10px 12px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-soft);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.reward-balance b {
    color: var(--fm-primary);
}

.reward-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 12px;
}

.reward-tabs a {
    flex: 1;
    text-align: center;
    padding: 8px;
    border: 1px solid var(--fm-line);
    border-radius: 6px;
    cursor: pointer;
    font-size: 14px;
    color: var(--fm-text);
}

.reward-tabs a.active {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
    font-weight: 600;
}

.reward-opts {
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
}

.reward-opts a {
    flex: 1 1 0;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: center;
    padding: 8px 6px;
    border: 1px solid var(--fm-line);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    color: var(--fm-text);
}

.reward-opts a.active {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
    background: color-mix(in srgb, var(--fm-primary) 10%, transparent);
    font-weight: 600;
}

.reward-custom,
.reward-msg {
    width: 100%;
    margin-top: 10px;
    padding: 9px 12px;
    border: 1px solid var(--fm-line);
    border-radius: 6px;
    font-size: 14px;
    resize: vertical;
}

.reward-pay {
    width: 100%;
    margin-top: 12px;
    padding: 11px;
    border: none;
    border-radius: 8px;
    background: var(--fm-primary);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
}

.reward-pay:disabled {
    opacity: .5;
}

.reward-list {
    margin-top: 12px;
    font-size: 13px;
    color: #8b8879;
}

.reward-list ul {
    margin: 6px 0 0;
    padding-left: 18px;
}

.reward-list li {
    margin: 3px 0;
}

.reward-empty {
    margin: 6px 0 0;
}

/* 打赏记录（独立区块） */
.reward-records {
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    overflow: hidden;
    margin-bottom: 14px;
    padding: 20px;
}

.reward-records-title {
    margin: 0 0 14px;
    font-size: 16px;
    color: var(--fm-text);
}

.reward-records-scroll {
    overflow-x: auto;
}

.reward-records-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.reward-records-table th {
    text-align: left;
    padding: 10px 12px;
    font-weight: 600;
    color: var(--fm-text);
    border-bottom: 1px solid var(--fm-border);
    white-space: nowrap;
}

.reward-records-table td {
    padding: 14px 12px;
    border-bottom: 1px dashed var(--fm-border);
    color: var(--fm-text);
    vertical-align: top;
}

.reward-records-table tbody tr:last-child td {
    border-bottom: none;
}

.reward-records-user {
    white-space: nowrap;
}

.reward-records-amount {
    white-space: nowrap;
    font-weight: 600;
    color: #e05666;
}

.reward-records-msg {
    color: #8b8879;
}

.reward-records-time {
    white-space: nowrap;
    color: #8b8879;
    text-align: right;
}

/* 留言列加宽、时间列整体右对齐 */
.reward-records-table th:nth-child(3),
.reward-records-table td:nth-child(3) {
    width: 55%;
}

.reward-records-table th:last-child,
.reward-records-table td:last-child {
    text-align: right;
}

/* 打赏记录翻页 */
.reward-records-pager {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    justify-content: flex-end;
    margin-top: 14px;
}

.reward-records-pager .rr-page {
    min-width: 30px;
    height: 30px;
    line-height: 30px;
    padding: 0 8px;
    text-align: center;
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    font-size: 13px;
    color: var(--fm-text);
    text-decoration: none;
}

.reward-records-pager .rr-page:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.reward-records-pager .rr-page.active {
    border-color: var(--fm-primary);
    color: #fff;
    background: var(--fm-primary);
    font-weight: 600;
}

/* 付费文章 */
.pay-article-preview {
    padding: 16px 0;
    color: var(--fm-text);
    font-size: 15px;
    line-height: 1.8;
    max-height: 220px;
    overflow: hidden;
}

.pay-article {
    margin-top: 8px;
    padding: 20px;
    border: 1px dashed var(--fm-primary);
    border-radius: var(--fm-radius);
    background: color-mix(in srgb, var(--fm-primary) 8%, var(--fm-card));
    text-align: center;
}

.pay-article-tip {
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-primary);
    margin-bottom: 14px;
}

.pay-article-price {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: center;
}

.pay-article-btn {
    padding: 6px 18px;
    border: none;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .5px;
    cursor: pointer;
}

.pay-article-btn:disabled {
    opacity: .5;
    cursor: default;
}

.pay-article-note {
    margin: 14px 0 0;
    font-size: 12px;
    color: #b08;
    color: #a86;
}

.reply-box {
    padding: 18px 20px 20px;
    background: var(--fm-soft);
    border-top: 1px solid var(--fm-line);
}

.reply-form img.captcha,
.reply-form #captcha {
    height: 28px;
    box-sizing: border-box;
    border: 0;
    border-radius: 3px;
    cursor: pointer;
}

.reply-form textarea,
.reply-textarea {
    width: 100%;
    min-height: 110px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    padding: 12px 14px;
    font-size: 14px;
    line-height: 1.7;
    resize: vertical;
    background: var(--fm-card);
}

.reply-textarea:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.reply-fields {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-top: 10px;
}

@media (max-width: 560px) {
    .reply-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reply-fields .reply-captcha {
        grid-column: auto;
    }

    .reply-fields.reply-fields-single {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 400px) {
    .reply-fields {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .reply-fields .reply-captcha {
        padding: 0 8px 0 3px;
    }

    .reply-captcha img {
        height: 24px;
    }
}

.reply-fields input,
.auth-inline input {
    height: 36px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    padding: 0 12px;
    font-size: 13px;
    width: 100%;
}

.reply-fields input {
    background: var(--fm-card);
}

.reply-fields input:focus {
    border-color: var(--fm-primary);
}

.reply-captcha {
    grid-column: 1;
    display: flex;
    align-items: center;
    height: 36px;
    padding: 0 10px 0 4px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    transition: border-color .15s;
}

.reply-captcha:focus-within {
    border-color: var(--fm-primary);
}

.reply-captcha img {
    flex: 0 0 auto;
    height: 28px;
    width: auto;
    border-radius: 3px;
    cursor: pointer;
}

.reply-fields .reply-captcha input {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
    height: 100%;
    padding: 0 0 0 10px;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 13px;
    outline: none;
}

.reply-fields-single {
    grid-template-columns: 200px;
}

.reply-actions {
    margin-top: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.reply-actions .btn {
    height: 36px;
}

.reply-media-tools {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    height: 36px;
    padding: 0 4px;
    background: var(--fm-line);
    border-radius: 999px;
}

.reply-actions .smilie-btn {
    width: 30px;
    height: 30px;
    padding: 0;
    gap: 0;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #6f6d60;
    font-size: 18px;
}

.reply-actions .smilie-btn i {
    font-size: 18px;
    line-height: 1;
}

.reply-actions .smilie-btn:hover,
.reply-actions .smilie-btn.is-open {
    background: var(--fm-card);
    color: var(--fm-primary);
}

.reply-tip-text {
    margin-left: auto;
    font-size: 12px;
    color: var(--fm-muted);
}

.reply-tip {
    margin-bottom: 10px;
    padding: 8px 12px;
    background: var(--fm-primary-light);
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-primary);
}

.reply-img-wrap {
    position: relative;
    display: inline-flex;
}

.reply-img-pop {
    position: absolute;
    left: 0;
    bottom: calc(100% + 10px);
    z-index: 40;
    width: 340px;
    max-width: calc(100vw - 48px);
    padding: 12px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    box-shadow: 0 12px 32px rgba(0, 0, 0, .14);
}

.reply-img-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 13px;
    color: var(--fm-text);
}

.reply-img-x {
    border: 0;
    padding: 0 2px;
    background: none;
    font-size: 18px;
    line-height: 1;
    color: var(--fm-muted);
    cursor: pointer;
}

.reply-img-x:hover {
    color: var(--fm-primary);
}

.reply-img-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.reply-img-row + .reply-img-row {
    margin-top: 8px;
}

.reply-img-row input[type="url"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 32px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    font-size: 12.5px;
}

.reply-img-row input[type="url"]:focus {
    border-color: var(--fm-primary);
    outline: none;
}

.reply-img-ok {
    flex: 0 0 auto;
    height: 32px;
    padding: 0 14px;
    border: 0;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    color: #fff;
    font-size: 12.5px;
    cursor: pointer;
}

.reply-img-pick {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 12px;
    border: 1px dashed var(--fm-border);
    border-radius: var(--fm-radius);
    color: var(--fm-text-sub);
    font-size: 12.5px;
    cursor: pointer;
}

.reply-img-pick:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.reply-img-pick.is-uploading {
    opacity: .6;
    pointer-events: none;
}

.reply-img-pick.is-disabled {
    opacity: .55;
    cursor: not-allowed;
}

.reply-img-pick.is-disabled:hover {
    border-color: var(--fm-border);
    color: var(--fm-text-sub);
}

.reply-img-tip {
    flex: 1 1 auto;
    font-size: 11.5px;
    line-height: 1.5;
    color: var(--fm-muted);
}

.reply-img-tip.is-ok {
    color: var(--fm-primary);
}

@media (max-width: 560px) {
    .reply-img-pop {
        position: fixed;
        left: 12px;
        right: 12px;
        top: 50%;
        bottom: auto;
        width: auto;
        max-width: none;
        transform: translateY(-50%);
        z-index: 999;
    }
}

.floor-content img:not(.smilie-img) {
    height: auto;
    max-height: 480px;
}

.forum-side {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

@media (min-width: 1025px) {
    .forum-side {
        position: sticky;
        top: var(--side-sticky-top, 66px);
    }
}

.widget {
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    overflow: hidden;
}

.widget-head {
    padding: 12px 16px;
    border-bottom: 1px solid var(--fm-line);
    background: var(--fm-soft);
}

.widget-head h3 {
    font-size: 14px;
    font-weight: 400;
    color: var(--fm-text-strong);
    position: relative;
}

.widget-body {
    padding: 14px 16px;
}

.widget-life .widget-body {
    padding: 12px 16px 18px;
}

.life-item + .life-item {
    margin-top: 13px;
}

.life-label {
    margin-bottom: 6px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--fm-text-sub);
}

.life-progress {
    display: flex;
    align-items: center;
    gap: 8px;
}

.life-track {
    flex: 1 1 auto;
    height: 10px;
    border-radius: 999px;
    background: var(--fm-soft-2);
    overflow: hidden;
}

.life-bar {
    display: block;
    height: 100%;
    border-radius: 999px;
    background-color: #ef6b6b;
    background-image: repeating-linear-gradient(90deg, rgba(255, 255, 255, .5) 0, rgba(255, 255, 255, .5) 2px, transparent 2px, transparent 9px);
    transition: width .6s ease;
}

.life-today .life-bar {
    background-color: #ef6b6b;
}

.life-week .life-bar {
    background-color: #59c3e6;
}

.life-month .life-bar {
    background-color: #f5b93e;
}

.life-year .life-bar {
    background-color: #8fd0e8;
}

.life-spring .life-bar {
    background-color: #5cc6e6;
}

.life-pct {
    flex: 0 0 auto;
    min-width: 34px;
    font-size: 12px;
    text-align: right;
    color: var(--fm-muted);
    font-variant-numeric: tabular-nums;
}

.widget-ipcard .widget-body {
    padding: 0;
}

.ipcard {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 170px;
    padding: 14px;
    overflow: hidden;
}

.ipcard.has-bg {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.ipcard-info {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    max-width: 100%;
    min-width: 0;
    padding-bottom: 2px;
}

.ipcard.has-pic .ipcard-info {
    flex: 0 0 74%;
    max-width: 74%;
}

.ipcard-line {
    margin: 0;
    padding: 6px 0;
    color: #e23c3c;
    font-family: inherit;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .2px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.ipcard-line b {
    color: #c92a2a;
    font-weight: 700;
}

.ipcard-region {
    position: absolute;
    right: 10px;
    top: 50%;
    z-index: 1;
    transform: translateY(-50%);
    writing-mode: vertical-rl;
    font-size: 22px;
    font-weight: 800;
    letter-spacing: 3px;
    color: rgba(58, 140, 205, .22);
    pointer-events: none;
    user-select: none;
    white-space: nowrap;
}

.ipcard.has-pic .ipcard-region {
    display: none;
}

.ipcard-pic {
    position: absolute;
    right: -10px;
    bottom: -8px;
    z-index: 1;
    width: 44%;
    max-width: 132px;
    height: auto;
    pointer-events: none;
    user-select: none;
}

html[data-theme="dark"] .ipcard-line {
    color: #ff6f6f;
}

html[data-theme="dark"] .ipcard-line b {
    color: #ffa0a0;
}

html[data-theme="dark"] .ipcard-region {
    color: rgba(150, 205, 245, .26);
}

html[data-theme="dark"] .ipcard.has-bg {
    background-color: #1b2029;
    background-blend-mode: multiply;
}

html[data-theme="dark"] .ipcard {
    background-color: var(--fm-soft);
}

.widget-banlist .widget-head {
    display: flex;
    align-items: baseline;
    gap: 8px;
    padding: 12px 16px;
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-line);
}

.widget-banlist .widget-head em {
    min-width: 0;
    font-style: normal;
    font-size: 12px;
    font-weight: 400;
    color: var(--fm-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.widget-banlist .widget-body {
    padding: 8px 16px 14px;
}

.banlist {
    margin: 0;
    padding: 0;
    list-style: none;
}

.banlist-item {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 0;
    border-bottom: 1px dashed var(--fm-line);
}

.banlist-item:last-child {
    border-bottom: 0;
}

.banlist-item[hidden],
.banlist-pager[hidden] {
    display: none;
}

.banlist-avatar {
    flex: 0 0 auto;
    display: inline-flex;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    overflow: hidden;
}

.banlist-img {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    object-fit: cover;
    filter: grayscale(1);
    opacity: .85;
}

.banlist-info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.banlist-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.banlist-name:hover {
    color: var(--fm-primary);
}

.banlist-sub {
    font-style: normal;
    font-size: 11px;
    color: var(--fm-muted);
}

.banlist-more {
    display: block;
    margin-top: 6px;
    padding-top: 9px;
    border-top: 1px solid var(--fm-line);
    text-align: center;
    font-size: 12px;
    color: var(--fm-muted);
}

.banlist-more:hover {
    color: var(--fm-primary);
}

.banlist-more.is-after-pager {
    margin-top: 2px;
    padding-top: 4px;
    border-top: 0;
}

.banlist-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
    padding-top: 9px;
    border-top: 1px solid var(--fm-line);
    font-size: 12px;
}

.banlist-pg {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 9px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-text-sub);
    font-family: inherit;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    transition: color .15s, border-color .15s;
}

.banlist-pg:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.banlist-pg:disabled {
    border-color: var(--fm-line);
    background: transparent;
    color: var(--fm-muted);
    cursor: not-allowed;
}

.banlist-pg-info {
    color: var(--fm-muted);
}

.banlist-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 24px 0 26px;
    font-size: 13px;
    color: var(--fm-muted);
}

.banlist-empty::before,
.banlist-empty::after {
    content: "";
    flex: 0 0 38px;
    height: 1px;
    background: var(--fm-line);
}

.ck-w-tip {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 2px 0 12px;
    color: var(--fm-primary);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .2px;
}

.ck-w-tip i {
    font-size: 16px;
}

.ck-w-tip .ck-w-heart {
    margin-left: -9px;
    font-size: 8px;
    transform: translateY(3px);
}

.ck-w-tip:hover {
    color: var(--fm-primary-dark);
}

.ck-w-tip.is-done-1 {
    color: var(--fm-muted);
    font-weight: 500;
}

.ck-w-tabs {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;
    margin-bottom: 10px;
}

.ck-w-tabs a {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 5px 2px 9px;
    font-size: 13.5px;
    color: var(--fm-muted);
}

.ck-w-tabs a:hover {
    color: var(--fm-primary);
}

.ck-w-tabs a.active {
    color: var(--fm-primary);
    font-weight: 600;
}

.ck-w-tabs a.active::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -1px;
    height: 2px;
    border-radius: 2px;
    background: var(--fm-primary);
}

.ck-w-list {
    display: flex;
    flex-direction: column;
}

.ck-w-list[hidden] {
    display: none;
}

.ck-w-pane[hidden] {
    display: none;
}

.ck-w-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 4px;
}

.ck-w-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 6px;
    background: var(--fm-soft);
    color: var(--fm-muted);
    font-size: 11px;
    transition: background-color .15s ease, color .15s ease;
}

.ck-w-page-btn:hover {
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.ck-w-page-btn.is-disabled {
    opacity: .4;
    pointer-events: none;
}

.ck-w-page-info {
    font-size: 12px;
    color: var(--fm-muted);
}

.ck-w-page-info b {
    color: var(--fm-text-sub);
    font-weight: 600;
}

.ck-w-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 0;
}

.ck-w-avatar {
    flex: 0 0 auto;
    display: inline-flex;
}

.ck-w-img {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    border: 1px solid var(--fm-line);
    object-fit: cover;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 15px;
}

.ck-w-body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ck-w-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 13.5px;
    font-weight: 500;
    color: var(--fm-text-strong);
}

.ck-w-sub {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    line-height: 1.35;
    color: var(--fm-muted);
}

.ck-w-badge {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 26px;
    padding: 0 9px;
    border-radius: 999px;
    background: var(--fm-line);
    color: var(--fm-text-sub);
    font-size: 12px;
}

.ck-w-badge i {
    font-size: 11px;
    opacity: .9;
}

.ck-w-empty {
    justify-content: center;
    padding: 10px 0;
    color: var(--fm-muted);
    font-size: 12.5px;
}

.widget-rec-domain .widget-body {
    padding: 0;
}

.widget-rec-domain .rec-domain-tip {
    margin-left: 4px;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    color: var(--fm-primary);
}

.rec-domain-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.rec-domain-table th {
    padding: 9px 16px;
    background: var(--fm-soft);
    font-weight: 600;
    color: var(--fm-text);
    text-align: left;
    white-space: nowrap;
}

.rec-domain-table th:first-child,
.rec-domain-table td:first-child {
    width: 58%;
}

.rec-domain-table td {
    padding: 9px 16px;
    border-top: 1px solid var(--fm-line);
    white-space: nowrap;
}

.rec-domain-name a {
    font-weight: 600;
    color: var(--fm-primary);
}

.rec-domain-price {
    font-weight: 600;
    color: var(--fm-text-sub);
}

.rec-domain-price.has-price {
    color: #e03e3e;
}

.rec-domain-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid var(--fm-line);
    background: var(--fm-soft);
    font-size: 12px;
}

.rec-domain-pg {
    display: inline-flex;
    align-items: center;
    height: 26px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-text);
    transition: color .15s, border-color .15s;
}

.rec-domain-pg:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.rec-domain-pg.is-off {
    border-color: var(--fm-line);
    background: transparent;
    color: var(--fm-muted);
    cursor: not-allowed;
}

.rec-domain-pg-info {
    color: var(--fm-text-sub);
}

.widget-create {
    border: 0;
    background: transparent;
}

.create-btn {
    display: block;
    height: 46px;
    line-height: 46px;
    text-align: center;
    background: var(--fm-primary);
    color: #fff;
    border-radius: var(--fm-radius);
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .5px;
    box-shadow: 0 2px 8px rgba(63, 158, 99, .22);
}

.create-btn:hover {
    background: var(--fm-primary-dark);
    color: #fff;
}

.widget-intro .widget-head {
    background: transparent;
    border-bottom: 0;
    text-align: center;
    padding: 18px 16px 0;
}

.widget-intro .widget-head h3 {
    padding-left: 0;
    font-size: 17px;
    color: #5f4f39;
}

.widget-intro .widget-head h3::before {
    display: none;
}

.widget-intro .widget-body {
    padding: 8px 16px 16px;
}

.intro-text {
    font-size: 13px;
    line-height: 2;
    color: var(--fm-text-sub);
    text-align: center;
}

.intro-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 6px;
    margin-top: 18px;
    text-align: center;
}

.stat-cell span {
    display: block;
    font-size: 13px;
    color: var(--fm-muted);
    white-space: nowrap;
}

.stat-cell b {
    display: block;
    margin-top: 4px;
    font-size: 16px;
    font-weight: 700;
    color: #6f5c41;
    white-space: nowrap;
}

.user-wall {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px 8px;
}

.user-wall-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    min-width: 42px;
    max-width: 100%;
}

.user-wall-item img {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid var(--fm-line);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 17px;
    font-weight: 600;
    transition: transform .4s ease;
}

.user-wall-name {
    max-width: 100%;
    font-style: normal;
    font-size: 12px;
    line-height: 1.2;
    color: var(--fm-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-wall-item:hover img {
    transform: translateY(-2px) rotate(360deg);
}

.user-wall-item:hover .user-wall-name {
    color: var(--fm-primary);
}

.rank-list li,
.text-list li,
.reply-list li {
    display: flex;
    align-items: center;
    padding: 7px 0;
    font-size: 13px;
    border-bottom: 1px dashed var(--fm-line);
}

.rank-list li:last-child,
.text-list li:last-child,
.reply-list li:last-child {
    border-bottom: 0;
}

.rank-no {
    flex: 0 0 18px;
    height: 18px;
    line-height: 18px;
    text-align: center;
    font-size: 11px;
    font-style: normal;
    background: var(--fm-soft-2);
    color: var(--fm-text-sub);
    border-radius: 0.25rem;
    margin-right: 8px;
}

.rank-no.top {
    background: var(--fm-primary);
    color: #fff;
}

.rank-list a,
.text-list a,
.reply-list a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.text-list a {
    flex: 1 1 auto;
}

.text-list span {
    flex: 0 0 auto;
    margin-left: 8px;
    font-size: 12px;
    color: var(--fm-muted);
}

.reply-list li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
    transition: background-color .15s ease;
}

.reply-list li:hover {
    background: var(--fm-soft);
}

.reply-list-avatar {
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    margin-top: 2px;
    border-radius: 50%;
    object-fit: cover;
}

.reply-list-body {
    flex: 1 1 auto;
    min-width: 0;
}

.reply-list-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.reply-list-name {
    color: #6f8a7b;
    font-size: 13px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.reply-list-name:hover {
    color: var(--fm-primary);
}

.reply-list-time {
    flex: 0 0 auto;
    font-size: 12px;
    color: var(--fm-muted);
}

.reply-list-text {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    margin-top: 3px;
    line-height: 1.5;
    word-break: break-word;
    white-space: normal;
    color: var(--fm-text-sub);
}

.reply-list-text:hover {
    color: var(--fm-primary);
}

.reply-list-text img {
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 0 1px;
    vertical-align: -3px;
}

.wl-apply {
    margin-left: 2px;
    color: var(--fm-muted);
    font-size: 12px;
    font-weight: 400;
}

.wl-apply:hover {
    color: var(--fm-primary);
}

.link-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 12px;
}

.link-cloud a {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--fm-text);
    font-size: 13px;
    line-height: 1.7;
    transition: color .15s ease;
}

.link-cloud a:hover {
    color: var(--fm-primary);
}

.tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 8px;
}

.tag-cloud .tag-chip {
    display: inline-flex;
    flex: 0 1 auto;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    padding: 3px 7px;
    border-radius: 8px;
    background: transparent;
    font-size: 12.5px;
    line-height: 1.35;
    color: var(--fm-text-sub);
    transition: background-color .15s ease, color .15s ease;
}

.tag-chip-name {
    display: flex;
    align-items: center;
    gap: 4px;
    min-width: 0;
}

.tag-chip-name i {
    flex: 0 0 auto;
    font-style: normal;
    font-weight: 600;
    color: var(--fm-muted);
}

.tag-chip-name b {
    overflow: hidden;
    min-width: 0;
    font-weight: 400;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.tag-chip-count {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 22px;
    padding: 0 5px;
    border-radius: 6px;
    font-size: 11.5px;
    font-weight: 600;
}

.tag-c1 .tag-chip-count { background: var(--fm-tint-green); color: #2f9e6f; }
.tag-c2 .tag-chip-count { background: var(--fm-tint-red); color: #d4568a; }
.tag-c3 .tag-chip-count { background: var(--fm-tint-purple); color: #7a5bd6; }
.tag-c4 .tag-chip-count { background: var(--fm-tint-blue); color: #3f7fd1; }
.tag-c5 .tag-chip-count { background: var(--fm-tint-gold); color: #b78a22; }
.tag-c6 .tag-chip-count { background: var(--fm-tint-red); color: #cc6b3a; }

.tag-chip.tag-c1:hover { background: var(--fm-tint-green); color: #2f9e6f; }
.tag-chip.tag-c2:hover { background: var(--fm-tint-red); color: #d4568a; }
.tag-chip.tag-c3:hover { background: var(--fm-tint-purple); color: #7a5bd6; }
.tag-chip.tag-c4:hover { background: var(--fm-tint-blue); color: #3f7fd1; }
.tag-chip.tag-c5:hover { background: var(--fm-tint-gold); color: #b78a22; }
.tag-chip.tag-c6:hover { background: var(--fm-tint-red); color: #cc6b3a; }

.board-list li {
    padding: 8px 0;
    border-bottom: 1px dashed var(--fm-line);
}

.board-list li:last-child {
    border-bottom: 0;
}

.board-list a {
    font-size: 13px;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.board-list em {
    font-style: normal;
    font-size: 11px;
    color: var(--fm-muted);
}

.board-children {
    margin-top: 6px;
    padding-left: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.board-children a {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.ad-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ad-item img {
    width: 100%;
    border-radius: 0.25rem;
}

.widget-selfad .selfad-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.selfad-buy {
    flex: 0 0 auto;
    padding: 4px 10px;
    border-radius: 5px;
    background: var(--fm-primary);
    color: #fff;
    font-size: 12px;
    line-height: 1.4;
    transition: filter .15s, transform .15s;
}

.selfad-buy:hover {
    background: var(--fm-primary-dark);
    color: #fff;
}

.selfad-imgs .ad-item {
    display: block;
    overflow: hidden;
    border-radius: 0.25rem;
    transition: transform .18s ease, box-shadow .18s ease;
}

.selfad-imgs .ad-item img {
    width: 100%;
    display: block;
    aspect-ratio: 5 / 1;
    object-fit: cover;
    background: var(--fm-line);
    transition: transform .3s ease, filter .18s ease;
}

.selfad-imgs .ad-item:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(90, 82, 60, .16);
}

.selfad-imgs .ad-item:hover img {
    transform: scale(1.04);
    filter: brightness(1.04);
}

.ad-text-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    margin-top: 8px;
}

.ad-text-item {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 5px 6px;
    border-radius: 0.25rem;
    color: #fff;
    font-size: 12px;
    line-height: 1.35;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: filter .18s ease, transform .18s ease, box-shadow .18s ease;
}

.ad-text-item::after {
    content: '';
    position: absolute;
    top: 0;
    left: -80%;
    width: 50%;
    height: 100%;
    background: linear-gradient(105deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .35) 50%, rgba(255, 255, 255, 0) 100%);
    transform: skewX(-20deg);
    transition: left .45s ease;
    pointer-events: none;
}

.ad-text-item:hover {
    filter: brightness(1.05);
    transform: translateY(-2px);
    box-shadow: 0 5px 12px rgba(90, 82, 60, .18);
    color: #fff;
}

.ad-text-item:hover::after {
    left: 130%;
}

.ad-text-item.c0 { background: #3f9e63; }
.ad-text-item.c1 { background: #e05252; }
.ad-text-item.c2 { background: #3a7bd5; }
.ad-text-item.c3 { background: #d9a514; }
.ad-text-item.c4 { background: #7c5bd1; }
.ad-text-item.c5 { background: #2fa6a0; }

.selfad-empty {
    padding: 18px 10px;
    text-align: center;
    color: var(--fm-muted);
}

.selfad-empty p {
    margin: 0 0 6px;
    font-size: 14px;
    font-weight: 600;
    color: #6f6c5e;
}

.selfad-empty span {
    font-size: 12px;
}

.ad-page {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.ad-page-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.ad-stat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 12px 8px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
}

.ad-stat b {
    font-size: 18px;
    color: var(--fm-primary);
}

.ad-stat b.ad-stat-price {
    display: flex;
    align-items: baseline;
    gap: 8px;
    font-size: 15px;
}

.ad-stat span {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.ad-page-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

.ad-card {
    padding: 16px 18px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
}

.ad-card h2 {
    margin: 0 0 12px;
    font-size: 16px;
    font-weight: 700;
    color: var(--fm-text);
}

.ad-tabs {
    display: flex;
    gap: 8px;
    margin-bottom: 14px;
}

.ad-tabs button {
    flex: 1;
    padding: 8px 0;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-line);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
    transition: all .15s;
}

.ad-tabs button.active {
    border-color: var(--fm-primary);
    background: var(--fm-primary-light, #eaf6ee);
    color: var(--fm-primary);
    font-weight: 600;
}

.ad-field {
    margin-bottom: 12px;
}

.ad-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
}

.ad-field label i {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    color: var(--fm-text-sub);
    margin-left: 6px;
}

.ad-field input[type="text"],
.ad-field input[type="url"],
.ad-field input[type="number"],
.ad-field select {
    width: 100%;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-line);
    font-size: 13px;
    color: var(--fm-text);
    transition: border-color .15s;
}

.ad-field input:focus,
.ad-field select:focus {
    border-color: var(--fm-primary);
    outline: none;
}

.ad-img-row {
    display: flex;
    gap: 8px;
}

.ad-img-row input {
    flex: 1;
    min-width: 0;
}

.ad-field label.ad-drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    margin-bottom: 8px;
    padding: 20px 12px;
    border: 1.5px dashed var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-line);
    text-align: center;
    cursor: pointer;
    transition: border-color .15s, background .15s, transform .15s;
}

.ad-field label.ad-drop:hover {
    border-color: var(--fm-primary);
    background: var(--fm-primary-light);
    transform: translateY(-1px);
}

.ad-field label.ad-drop.is-uploading {
    opacity: .6;
    pointer-events: none;
}

.ad-field label.ad-drop i,
.ad-field label.ad-drop svg {
    width: 30px;
    height: 30px;
    font-size: 24px;
    line-height: 1;
    color: var(--fm-primary);
}

.ad-field label.ad-drop b {
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
}

.ad-field label.ad-drop span {
    font-size: 12px;
    font-weight: 400;
    color: var(--fm-text-sub);
}

.ad-img-preview {
    margin-top: 8px;
}

.ad-color-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    padding: 8px 12px;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    overflow: hidden;
}

.ad-color-preview span {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ad-img-preview img {
    max-width: 100%;
    max-height: 90px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-line);
}

.ad-amount {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 12px;
    margin-bottom: 12px;
    border: 1px dashed var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-line);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.ad-amount b {
    font-size: 17px;
    color: #e05252;
}

.ad-submit {
    width: 100%;
    height: 42px;
    border: 0;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    letter-spacing: .5px;
    cursor: pointer;
    transition: filter .15s, transform .15s;
}

.ad-submit:hover:not(:disabled) {
    background: var(--fm-primary-dark);
}

.ad-submit:disabled {
    opacity: .65;
    cursor: not-allowed;
}

.ad-tip-line {
    margin: 10px 0 0;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.6;
}

.ad-balance-line {
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--fm-primary);
}

.ad-mine-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 0;
    border-bottom: 1px solid var(--fm-line);
}

.ad-mine-item:last-child {
    border-bottom: 0;
}

.ad-mine-thumb {
    flex: 0 0 auto;
    width: 64px;
    height: 36px;
    border-radius: var(--fm-radius);
    overflow: hidden;
    background: var(--fm-soft-2);
    display: flex;
    align-items: center;
    justify-content: center;
}

.ad-mine-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.ad-mine-thumb-text {
    font-size: 12px;
    font-weight: 600;
    color: var(--fm-text-sub);
}

.ad-mine-info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.ad-mine-info b {
    font-size: 13px;
    color: var(--fm-text);
}

.ad-mine-info em {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.ad-mine-info span {
    font-size: 12px;
}

.ad-mine-price {
    font-style: normal;
    color: #e05252;
    margin-left: 6px;
}

.ad-st {
    display: inline-block;
    padding: 1px 8px;
    border-radius: 999px;
    font-size: 11px;
}

.ad-st.ok {
    background: var(--fm-primary-light);
    color: #2f855a;
}

.ad-st.wait {
    background: var(--fm-tint-blue);
    color: #3a7bd5;
}

.ad-st.expire {
    background: var(--fm-tint-gold);
    color: #c07f10;
}

.ad-st.off {
    background: var(--fm-soft);
    color: var(--fm-text-sub);
}

.ad-renew-btn {
    flex: 0 0 auto;
    height: 28px;
    padding: 0 12px;
    border: 1px solid var(--fm-primary);
    border-radius: var(--fm-radius);
    background: transparent;
    color: var(--fm-primary);
    font-size: 12px;
    cursor: pointer;
    transition: background .15s, color .15s;
}

.ad-renew-btn:hover {
    background: var(--fm-primary);
    color: #fff;
}

.ad-mine-empty {
    margin: 0;
    padding: 18px 0;
    text-align: center;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.ad-notice {
    display: flex;
    align-items: stretch;
    gap: 10px;
    padding: 0 12px 0 0; 
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    overflow: hidden; 
}

.ad-notice-tag {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    padding: 10px 14px;
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

.ad-notice-text {
    flex: 1;
    min-width: 0;
    margin: 0;
    align-self: center;
    padding: 8px 0;
    font-size: 13px;
    color: var(--fm-text);
    line-height: 1.7;
    overflow: hidden;
}

.ad-notice-typing {
    font-weight: 600;
    letter-spacing: .01em;
    word-break: break-word;
}

.ad-notice-char {
    animation: adCharIn .18s ease both;
}

.ad-notice-caret {
    display: inline-block;
    width: 2px;
    height: 1.05em;
    margin-left: 3px;
    vertical-align: -.16em;
    border-radius: 1px;
    background: var(--fm-primary);
    animation: adCaretBlink .9s steps(1) infinite;
}

@keyframes adCharIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes adCaretBlink {
    0%, 49% { opacity: 1; }
    50%, 100% { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
    .ad-notice-char {
        animation: none;
    }

    .ad-notice-caret {
        animation: none;
        opacity: 1;
    }
}

.ad-notice-btn {
    flex: 0 0 auto;
    align-self: center;
    padding: 6px 16px;
    border: 0;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: opacity .15s;
}

.ad-notice-btn:hover {
    opacity: .85;
}

.ad-intro-mask {
    position: fixed;
    inset: 0;
    z-index: 1500;
    background: rgba(31, 32, 27, .45);
}

.ad-intro {
    position: fixed;
    z-index: 1501;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(480px, calc(100vw - 32px));
    max-height: 82vh;
    display: flex;
    flex-direction: column;
    background: var(--fm-card);

    border: 0;
    border-radius: var(--fm-radius);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
    overflow: hidden;
}

.ad-intro-mask[hidden],
.ad-intro[hidden] {
    display: none;
}

.ad-intro-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--fm-line);
    background: var(--fm-primary);
    color: #fff;
}

.ad-intro-head b {
    font-size: 15px;
}

.ad-intro-close {
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    opacity: .75;
    transition: opacity .15s;
}

.ad-intro-close:hover {
    opacity: 1;
}

.ad-intro-body {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 16px 18px;
}

.ad-intro-list {
    margin: 0;
    font-size: 13px;
    color: var(--fm-text);
}

.ad-intro-item {
    margin: 0;
    line-height: 2;
}

.ad-intro-foot {
    padding: 12px 18px 16px;
    text-align: right;
}

.ad-intro-ok {
    min-width: 88px;
    height: 36px;
    border: 0;
    border-radius: var(--fm-radius);
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background .15s;
}

.ad-intro-ok:hover {
    background: var(--fm-primary-dark);
}

.ad-color-pair {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px;
}

.ad-color-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ad-color-item label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
    cursor: pointer;
}

.ad-color-item label input {
    margin: 0;
    cursor: pointer;
}

.ad-color-item input[type="color"] {
    width: 44px;
    height: 32px;
    padding: 2px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    cursor: pointer;
}

.ad-color-item input[type="color"]:disabled {
    opacity: .4;
    cursor: not-allowed;
}

.ad-color-tip {
    flex: 1 1 100%;
    margin: 0;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.ad-code-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.ad-code-row input {
    flex: 1;
    min-width: 0;
}

.ad-code-row img {
    flex: 0 0 auto;
    height: 38px;
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    cursor: pointer;
}

.ad-guest-list {
    margin: 0;
    padding-left: 20px;
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 2.1;
}

.ad-guest-list b {
    color: var(--fm-text);
}

@media (max-width: 768px) {
    .ad-page-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

.widget-search {
    display: flex;
    height: 36px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    overflow: hidden;
}

.widget-search input {
    flex: 1;
    border: 0;
    padding: 0 14px;
    font-size: 13px;
    background: var(--fm-soft);
}

.widget-search button {
    border: 0;
    background: var(--fm-primary);
    color: #fff;
    padding: 0 16px;
    cursor: pointer;
    font-size: 13px;
}

.archive-select {
    width: 100%;
    height: 36px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    padding: 0 10px;
    font-size: 13px;
    background: var(--fm-soft);
}

.blogger-card {
    text-align: center;
}

.blogger-card img,
.blogger-card .forum-letter-avatar {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.blogger-card .forum-letter-avatar {
    font-size: 24px;
}

.blogger-card b {
    display: block;
    margin-top: 8px;
}

.blogger-card p {
    margin-top: 6px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.widget-calendar {
    text-align: center;
    font-size: 12.5px;
    color: var(--fm-text-sub);
    min-height: 30px;
}

.widget-calendar table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.widget-calendar .calendartop {
    margin-bottom: 4px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.widget-calendar .calendartop td {
    padding: 5px 0;
}

.widget-calendar .calendartop a {
    display: inline-block;
    min-width: 22px;
    padding: 0 5px;
    color: var(--fm-text-sub);
    text-decoration: none;
    transition: color .15s;
}

.widget-calendar .calendartop a:hover {
    color: var(--fm-primary);
}

.widget-calendar .calendar td {
    height: 30px;
    text-align: center;
    font-size: 12px;
}

.widget-calendar .calendar .week,
.widget-calendar .calendar .sun {
    color: var(--fm-muted);
    font-size: 11.5px;
    font-weight: 600;
    height: 26px;
}

.widget-calendar .calendar .day {
    color: var(--fm-primary);
    font-weight: 700;
}

.widget-calendar .calendar .day a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: var(--fm-primary);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.widget-calendar .calendar .day2 a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--fm-primary) 12%, transparent);
    color: var(--fm-primary);
    font-weight: 600;
    text-decoration: none;
    transition: background .15s, color .15s;
}

.widget-calendar .calendar .day2 a:hover {
    background: var(--fm-primary);
    color: #fff;
}

.custom-text {
    font-size: 13px;
    line-height: 1.8;
    color: var(--fm-text-sub);
}

.forum-footer {
    position: relative;
    background: var(--fm-card);
    padding: 13px 0;
    margin-top: 70px;
    font-size: 11.2px;
    color: var(--fm-text-sub);
    line-height: 1.9;
}

.footer-decor {
    position: relative;
    z-index: 1;
    display: block;
    width: auto;
    height: 96px;
    margin: -80px auto 0;
    pointer-events: none;
    user-select: none;
}

.footer-in {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px 18px;
    flex-wrap: wrap;
}

.footer-left,
.footer-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-width: 0;
}

.footer-right {
    margin-left: auto;
}

.forum-footer a {
    color: var(--fm-text-sub);
}

.forum-footer a:hover {
    color: var(--fm-primary);
}

.forum-footer .sep {
    color: var(--fm-muted);
}

.forum-footer a.footer-icp {
    font-weight: 700;
    letter-spacing: .2px;
    background: -webkit-linear-gradient(45deg, #22c6dd, #f4a184, #e8c747, #9182c9, #7ba7e6);
    background: -moz-linear-gradient(45deg, #22c6dd, #f4a184, #e8c747, #9182c9, #7ba7e6);
    background: -ms-linear-gradient(45deg, #22c6dd, #f4a184, #e8c747, #9182c9, #7ba7e6);
    background: linear-gradient(45deg, #22c6dd, #f4a184, #e8c747, #9182c9, #7ba7e6);
    background-size: 400% 100%;
    color: transparent;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: ran 8s linear infinite;
}

.forum-footer a.footer-icp::before {
    content: "";
    display: inline-block;
    width: 15px;
    height: 15px;
    margin-right: 4px;
    vertical-align: -2px;
    background: url("../images/icp.png") center / contain no-repeat;
    -webkit-text-fill-color: initial;
}

.forum-footer a.footer-icp:hover {
    color: transparent;
    -webkit-text-fill-color: transparent;
}

@keyframes ran {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.footer-time b,
.footer-sql b {
    font-weight: 400;
    color: var(--fm-muted);
}

@media (max-width: 640px) {
    .footer-decor {
        height: 76px;
        /* 按桌面端 96px/-80px 的重叠比例调整，保持动物坐在底栏上沿，避免背景色差分界线 */
        margin-top: -63px;
    }

    .footer-in {
        flex-direction: column;
        align-items: center;
        gap: 4px;
        text-align: center;
    }

    .footer-right {
        order: -1;
        margin-left: 0;
        justify-content: center;
    }

    .footer-left {
        justify-content: center;
    }
}

.back-top {
    position: fixed;
    right: 22px;
    bottom: 60px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid var(--fm-border);
    background: var(--fm-card);
    color: var(--fm-text-sub);
    cursor: pointer;
    display: none;
    align-items: center;
    justify-content: center;
    box-shadow: var(--fm-shadow);
    z-index: 90;
}

.back-top.show {
    display: flex;
}

.back-top svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.back-top i.back-top-arrow {
    font-size: 17px;
    line-height: 1;
}

.back-top svg.back-top-ring {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    stroke: none;
    transform: rotate(-90deg);
    pointer-events: none;
}

.back-top-ring circle {
    fill: none;
    stroke-width: 2;
}

.back-top-ring .ring-bg {
    stroke: var(--fm-line);
}

.back-top-ring .ring-bar {
    stroke: var(--fm-primary);
    stroke-linecap: round;
    stroke-dasharray: 113.1;
    stroke-dashoffset: 113.1;
    transition: stroke-dashoffset .12s linear;
}

.back-top:hover {
    color: var(--fm-primary);
    border-color: var(--fm-primary);
}

.auth-page-main {
    padding-top: 28px;
    padding-bottom: 40px;
}

.auth-page-card {
    max-width: 460px;
    margin: 0 auto;
    padding: 26px 26px 22px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
}

.auth-page-head {
    margin-bottom: 18px;
    text-align: center;
}

.auth-page-head h1 {
    font-size: 20px;
    color: var(--fm-text-strong);
    margin-bottom: 6px;
}

.auth-page-head p {
    font-size: 13px;
    color: var(--fm-text-sub);
}

.auth-page-links {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 16px;
    font-size: 13px;
}

.auth-page-links a {
    color: var(--fm-text-sub);
}

.auth-page-links a:hover {
    color: var(--fm-primary);
}

.auth-modal .auth-panel {
    display: none;
}

.auth-modal .auth-panel.is-active {
    display: block;
}

.auth-third {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px dashed var(--fm-line);
    text-align: center;
}

.qq-login-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 42px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: #2f7ed8;
    font-size: 14px;
    font-weight: 500;
    transition: .2s;
}

.qq-login-btn svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
}

.qq-login-btn:hover {
    border-color: #2f7ed8;
    background: var(--fm-tint-blue);
    color: #2f7ed8;
}

.auth-third-tip {
    margin-top: 8px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.checkin-mask {
    position: fixed;
    inset: 0;
    background: rgba(38, 36, 28, .45);
    z-index: 1000;
    display: none;
}

.checkin-mask.show {
    display: block;
}

.checkin-modal {
    position: fixed;
    inset: 0;
    z-index: 1001;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 12px;   
}

.checkin-modal.show {
    display: flex;
}

.checkin-card {
    width: 100%;
    max-width: 460px;
    height: 550px;   
    max-height: calc(100vh - 24px);   
    display: flex;
    flex-direction: column;
    background: var(--fm-card);
    border-radius: 20px;   
    overflow: hidden;      
    box-shadow: 0 24px 60px rgba(0, 0, 0, .2);
}

.checkin-top {
    position: relative;   
    flex: 0 0 auto;
    background: linear-gradient(180deg, rgba(255, 255, 255, .16), rgba(0, 0, 0, .1)), var(--fm-primary);
    color: #fff;
    border-radius: 20px 20px 0 0;   
}

.checkin-top::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: -20px;
    height: 20px;
    background-color: var(--fm-primary);
    background-image: linear-gradient(rgba(0, 0, 0, .1), rgba(0, 0, 0, .1));   
}

.checkin-head {
    position: relative;
    padding: 15px 18px 13px;
}

.checkin-title {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 17px;
    font-weight: 700;
}

.checkin-title svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.checkin-close {
    position: absolute;
    top: 12px;
    right: 14px;
    padding: 0;
    border: 0;
    background: none;
    color: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    opacity: .85;
}

.checkin-close:hover {
    opacity: 1;
}

.checkin-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 11px 16px;
}

.checkin-tabs {
    display: inline-flex;
    align-items: center;
    gap: 0;
    padding: 3px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .32);            
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22);
}

.checkin-tabs a {
    display: inline-block;
    padding: 5px 16px;
    border-radius: 999px;
    font-size: 13px;
    color: rgba(56, 58, 50, .68);                    
    white-space: nowrap;
    transition: background-color .18s ease, color .18s ease;
}

.checkin-tabs a:hover {
    color: rgba(56, 58, 50, .95);
}

.checkin-tabs a.active {
    background: #fff;
    color: var(--fm-primary);
    font-weight: 600;
}

.checkin-coins {
    flex: 0 0 auto;
    padding: 5px 12px;
    border-radius: 20px;
    background: rgba(255, 255, 255, .5);   
    font-size: 12px;
    color: var(--fm-primary-dark);
    white-space: nowrap;
    transition: background-color .18s ease, box-shadow .18s ease;
}

.checkin-coins b {
    color: var(--fm-primary);
}

.checkin-coins:hover {
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .14);
}

.checkin-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    background: var(--fm-card);
    border-radius: 20px;   
    position: relative;    
    z-index: 1;
    scrollbar-width: thin;                              
    scrollbar-color: rgba(0, 0, 0, .18) transparent;
}

.checkin-body::-webkit-scrollbar {
    width: 8px;
}

.checkin-body::-webkit-scrollbar-track {
    background: transparent;
}

.checkin-body::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, .18);
    border-radius: 999px;
}

.checkin-body::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, .3);
}

.checkin-pane {
    flex: 0 0 auto;   
    padding: 18px;
}

.checkin-pane[data-checkin-pane="rank"] {
    --rank-accent: #ff8a1f;
    --rank-accent-deep: #f5730a;
    flex: 0 0 auto;             
    display: flex;
    flex-direction: column;
    margin: 12px;               
    padding: 0;                 
    background: var(--fm-card);
    border: 0;                  
    border-radius: 12px;        
    overflow: hidden;           
}

.checkin-pane[data-checkin-pane="rank"][hidden] {
    display: none;
}

.checkin-state {
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: var(--fm-text);
}

.checkin-sub {
    margin-top: 6px;
    text-align: center;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.checkin-sub b {
    color: var(--fm-primary);
    padding: 0 2px;
}

.checkin-extra {
    margin-top: 4px;
    min-height: 16px;
    text-align: center;
    font-size: 12px;
    color: var(--fm-muted);
}

.checkin-btn {
    display: block;
    width: 140px;
    max-width: 80%;
    height: 34px;
    margin: 10px auto 0;
    border: 0;
    border-radius: 0.25rem;
    background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(0, 0, 0, .08)), var(--fm-primary);
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 10px rgba(0, 0, 0, .12);
    transition: filter .15s;
}

.checkin-btn:hover {
    filter: brightness(1.05);
}

.checkin-btn:disabled {
    background: var(--fm-soft-2);
    color: var(--fm-muted);
    box-shadow: none;
    cursor: default;
}

.checkin-month {
    margin-top: 16px;
    padding: 14px 14px 16px;
    background: var(--fm-card);
    border-radius: 0.25rem;
}

.checkin-month-title {
    text-align: center;
    font-size: 12px;
    color: var(--fm-muted);
}

.checkin-month-head {
    display: flex;
    align-items: center;
    justify-content: flex-start;   
    flex-wrap: wrap;               
    gap: 10px;
    margin-top: 8px;
}

.ck-makeup-pill {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    padding: 0 8px;
    border-radius: 999px;
    background: var(--fm-primary);
    border: 1px solid transparent;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
    white-space: nowrap;
}

.checkin-month-head .ck-makeup-pill b,
.ck-makeup-pill b {
    color: #fff;
    font-size: inherit;
    line-height: inherit;
}

.ck-makeup-pill:hover {
    color: #fff;
    filter: brightness(1.06);
}

.ck-day.is-makeup {
    cursor: pointer;
}

.ck-day.is-makeup:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.ck-day .ck-makeup-flag {
    position: absolute;
    top: 3px;
    right: 4px;
    font-size: 9px;
    line-height: 1;
    font-style: normal;
    text-decoration: none;
    color: var(--fm-primary);
    opacity: .85;
}

.ck-makeup-mask {
    position: fixed;
    inset: 0;
    background: rgba(38, 36, 28, .35);
    z-index: 1100;
}

.ck-makeup-modal {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1101;
    width: min(420px, calc(100vw - 40px));
}

.ck-makeup-card {
    background: var(--fm-card);
    border-radius: 10px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, .18);
    overflow: hidden;
}

.ck-makeup-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--fm-line, #eee);
}

.ck-makeup-head b {
    font-size: 15px;
}

.ck-makeup-close {
    border: 0;
    background: none;
    font-size: 20px;
    line-height: 1;
    color: var(--fm-muted);
    cursor: pointer;
    padding: 0 2px;
}

.ck-makeup-close:hover {
    color: var(--fm-text);
}

.ck-makeup-body {
    padding: 14px 16px 16px;
}

.ck-makeup-body p {
    margin: 0 0 8px;
    font-size: 13px;
    line-height: 1.7;
    color: var(--fm-text-sub);
}

.ck-makeup-body p b {
    color: #d97b0d;
}

.ck-makeup-exchange {
    display: flex;
    gap: 8px;
    margin-top: 12px;
}

.ck-makeup-exchange input {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--fm-border, #ddd);
    border-radius: 6px;
    font-size: 13px;
    outline: none;
}

.ck-makeup-exchange input:focus {
    border-color: var(--fm-primary);   
}

.ck-makeup-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 36px;
    padding: 0 14px;
    border: 0;
    border-radius: 6px;
    background: var(--fm-primary);   
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.ck-makeup-btn:hover {
    filter: brightness(1.05);
}

.ck-makeup-tip {
    min-height: 18px;
    margin-top: 8px;
    font-size: 12px;
}

.ck-makeup-tip.is-ok {
    color: var(--fm-primary);
}

.ck-makeup-tip.is-err {
    color: #df5652;
}

.checkin-month-head b {
    font-size: 15px;
    color: var(--fm-text);
}

.checkin-month-ops {
    display: inline-flex;
    gap: 6px;
    margin-left: auto;   
}

.checkin-month-ops a {
    padding: 4px 10px;
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    font-size: 0.8rem;
    color: var(--fm-text-sub);
    background: var(--fm-soft);
}

.checkin-month-ops a:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.checkin-month-ops a.is-disabled {
    color: var(--fm-muted);
    background: var(--fm-soft);
    border-color: var(--fm-line);
    pointer-events: none;
}

.checkin-week,
.checkin-days {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
}

.checkin-week {
    margin-top: 12px;
}

.checkin-week span {
    text-align: center;
    font-size: 12px;
    color: var(--fm-muted);
}

.checkin-days {
    margin-top: 6px;
}

.ck-day {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    border-radius: 8px;
    background: var(--fm-soft);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.ck-day.is-blank {
    background: transparent;
}

.ck-day.is-future {
    background: var(--fm-soft);
    color: var(--fm-muted);
}

.ck-day.is-signed {

    background: linear-gradient(180deg, rgba(255, 255, 255, .18), rgba(0, 0, 0, .08)), var(--fm-primary);
    color: #fff;
}

.ck-day.is-signed .ck-signed-check {
    margin-left: 3px;
    font-size: 10px;
}

.ck-day.is-signed svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.ck-day.is-today {
    background: var(--fm-card);
    border: 2px solid var(--fm-primary);
    color: var(--fm-primary);
    font-weight: 700;
}

.ck-day.is-miss {
    background: var(--fm-card);
    color: var(--fm-text-sub);
}

.ck-day.is-miss em {
    position: absolute;
    top: -5px;
    right: 2px;
    font-style: normal;
    font-size: 11px;
    color: #e14b3e;
}

.rank-bar {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;       
    gap: 8px;
    padding: 14px 16px 10px;
}

.rank-ranges {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: stretch;
    gap: 0;
    padding: 0;
    border-radius: 8px;
    background: var(--fm-soft);
    overflow: hidden;          
}

.rank-ranges a {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    border-radius: 0;
    font-size: 13px;
    color: #7d7d7d;
    white-space: nowrap;
    transition: background-color .18s ease, color .18s ease;
}

.rank-ranges a:hover {
    color: var(--fm-primary);
}

.rank-ranges a.active {
    background: var(--fm-primary);
    color: #fff;
    font-weight: 600;
}

.rank-sorts {
    align-self: flex-end;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: stretch;
    gap: 0;
    border-radius: 5px;
    background: var(--fm-soft);
    overflow: hidden;          
}

.rank-sorts a {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 0;
    font-size: 11px;
    color: var(--fm-text);             
    white-space: nowrap;
    transition: background-color .18s ease, color .18s ease;
}

.rank-sorts a:hover {
    color: var(--fm-primary);
}

.rank-sorts a.active {
    background: var(--fm-primary);
    color: #fff;
    font-weight: 600;
}

.rank-sorts[hidden] {
    display: none;
}

.checkin-rank {
    list-style: none;
    flex: 0 0 auto;   
    margin: 0;

    padding: 0 8px 8px;
}

.checkin-rank li {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 54px;
    padding: 7px 16px;
    transition: background-color .18s ease, padding-left .22s ease;
}

.checkin-rank li:hover {
    background: var(--fm-soft-2);
}

.checkin-rank li:not(.checkin-rank-empty):not(.checkin-rank-loading):hover {
    padding-left: 20px;
}

.checkin-rank li.checkin-rank-empty,
.checkin-rank li.checkin-rank-empty:hover {
    display: block;
    padding: 30px 16px;
    background: transparent;
    box-shadow: none;
    text-align: center;
    color: var(--fm-muted);
    font-size: 13px;
}

.checkin-rank li.checkin-rank-loading,
.checkin-rank li.checkin-rank-loading:hover {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 30px 16px;
    background: transparent;
    box-shadow: none;
    color: var(--fm-muted);
    font-size: 13px;
}

.checkin-rank li.checkin-rank-loading i {
    color: #d78744;
    font-size: 14px;
}

.checkin-rank .rank-no {
    flex: 0 0 40px;
    height: auto;
    line-height: 1;
    margin-right: 0;
    background: none;
    border-radius: 0;
    font-family: Georgia, 'Times New Roman', serif;   
    font-style: normal;
    font-size: 15px;
    font-weight: 600;
    color: #b9b9b9;
    text-align: center;
}

.checkin-rank .rank-medal {
    flex: 0 0 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
}

.checkin-rank .rank-medal i {
    line-height: 1;
    filter: drop-shadow(0 1px 1px rgba(90, 82, 60, .22));
}

.checkin-rank .rank-medal-1 i {
    color: #e8b021;
}

.checkin-rank .rank-medal-2 i {
    color: #aab3bd;
}

.checkin-rank .rank-medal-3 i {
    color: #c6803f;
}

.checkin-rank img.rank-avatar {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    object-fit: cover;
    transition: transform .18s ease;
}

.checkin-rank span.rank-avatar {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    font-size: 16px;
    transition: transform .18s ease;
}

.checkin-rank li:hover img.rank-avatar,
.checkin-rank li:hover span.rank-avatar {
    transform: scale(1.07);
}

.checkin-rank li:hover .rank-name:not(.vip-name) {
    color: var(--fm-primary);
}

.checkin-rank .rank-info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.checkin-rank .rank-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;   
    color: var(--fm-text);
    transition: color .18s ease;
}

.checkin-rank .rank-meta {
    font-style: normal;
    font-size: 12px;
    line-height: 16px;   
    color: #a3a3a3;
}

.checkin-rank .rank-meta i {
    margin-right: 3px;
    color: #e0a63a;
}

.checkin-rank .rank-coins {
    flex: 0 0 auto;
    padding: 0 8px;
    border-radius: 999px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(0, 0, 0, .08)), var(--fm-primary);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .12);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    line-height: 16px;
    white-space: nowrap;
}

.checkin-rank .rank-coins.rank-days {
    padding: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: #e14b3e;
    font-size: 12px;
}

.rank-pager {
    flex: 0 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 12px 0;
    gap: 15px;
    background: linear-gradient(to top, var(--fm-primary-light), rgba(255, 255, 255, 0));
    margin-top: 10px;
    border-radius: 20px;
}

.rank-pager[hidden] {
    display: none;
}

.rank-pager-btn {
    padding: 5px 14px;
    border: 0;
    border-radius: 20px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(0, 0, 0, .08)), var(--fm-primary);
    font-size: 12px;
    color: #fff;
    cursor: pointer;
}

.rank-pager-btn:hover:not(:disabled) {
    filter: brightness(1.05);
}

.rank-pager-btn:disabled {
    opacity: .5;
    cursor: not-allowed;
}

.rank-pager-info {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.rank-pager-info b {
    color: var(--rank-accent, #ff8a1f);
    font-weight: 600;
}

@media (max-width: 640px) {

    .checkin-modal {
        padding: 8px;
    }

    .checkin-card {
        max-height: calc(100vh - 16px);
        max-height: calc(100dvh - 16px);
    }

    .checkin-pane {
        padding: 12px;
    }

    .checkin-month {
        padding: 12px 10px 14px;
    }

    .checkin-month-head {
        column-gap: 5px;
        row-gap: 8px;
    }

    .checkin-month-head b {
        white-space: nowrap;
        font-size: 14px;
    }

    .checkin-month-head .ck-makeup-pill,
    .ck-makeup-pill {
        padding: 0 5px;
        font-size: 11px;
        white-space: nowrap;
    }

    .checkin-month-ops {
        gap: 4px;
    }

    .checkin-month-ops a {
        padding: 5px 6px;
        font-size: 12px;
        white-space: nowrap;
    }

    .checkin-week,
    .checkin-days {
        gap: 4px;
    }

    .ck-day {
        height: 28px;
        font-size: 12px;
    }

    .checkin-days .ck-day.is-signed .ck-signed-check {
        margin-left: 2px;
        font-size: 9px;
    }
}

.auth-mask {
    position: fixed;
    inset: 0;
    background: rgba(38, 36, 28, .45);
    z-index: 1000;
    display: none;
}

.auth-mask.show {
    display: block;
}

.auth-modal {
    position: fixed;
    inset: 0;
    z-index: 1001;
    display: none;
    align-items: flex-start;
    justify-content: center;
    padding: 20px;

    overflow-y: auto;
}

.auth-modal.show {
    display: flex;
}

.auth-card {
    width: 100%;
    max-width: 380px;

    margin: auto;
    background: var(--fm-card);
    border-radius: 0.25rem;
    padding: 20px;
    position: relative;
    box-shadow: 0 20px 50px rgba(40, 36, 24, .25);
}

.notice-mask {
    position: fixed;
    inset: 0;
    z-index: 1400;
    background: rgba(30, 28, 22, .45);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    animation: noticeMaskIn .2s ease;
}

@keyframes noticeMaskIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

.notice-mask[hidden],
.notice-modal[hidden] {
    display: none;
}

.notice-modal {
    position: fixed;
    inset: 0;
    z-index: 1401;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.notice-card {
    position: relative;
    width: 100%;
    max-width: 420px;
    padding: 26px 24px 20px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    box-shadow:
        0 30px 70px rgba(40, 36, 24, .22),
        0 6px 18px rgba(40, 36, 24, .08);
    overflow: hidden;
    animation: noticePop .28s cubic-bezier(.2, .8, .3, 1);
}

.notice-card::after {
    content: '';
    position: absolute;
    top: -12px;
    right: -8px;
    width: 86px;
    height: 86px;
    background: rgba(63, 158, 99, .12);
    background: color-mix(in srgb, var(--fm-primary) 12%, transparent);
    clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
    transform: rotate(-10deg);
    pointer-events: none;
}

@keyframes noticePop {
    from { opacity: 0; transform: translateY(16px) scale(.96); }
    to { opacity: 1; transform: translateY(0) scale(1); }
}

.notice-close {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: var(--fm-text-sub);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    transition: background-color .15s, color .15s;
}

.notice-close:hover {
    background: var(--fm-line);
    color: var(--fm-text-strong);
}

.notice-head {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 32px 12px 0;
}

.notice-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 16px;
}

.notice-title {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.4;
    color: var(--fm-text-strong);
}

.notice-body {
    position: relative;
    z-index: 1;
    max-height: 50vh;
    overflow-y: auto;
    font-size: 14px;
    line-height: 1.8;
    color: var(--fm-text);
    word-break: break-word;
}

.notice-body > :first-child {
    margin-top: 0;
}

.notice-body > :last-child {
    margin-bottom: 0;
}

.notice-body p {
    margin: 0 0 10px;
}

.notice-body a {
    color: var(--fm-primary);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.notice-body a:hover {
    color: var(--fm-primary-dark);
}

.notice-body img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 8px 0;
    border-radius: 8px;
}

.notice-body ul,
.notice-body ol {
    margin: 0 0 10px;
    padding-left: 20px;
    list-style: disc;
}

.notice-body ol {
    list-style: decimal;
}

.notice-body li {
    margin: 3px 0;
}

.notice-body code {
    padding: 1px 6px;
    border-radius: 4px;
    background: var(--fm-line);
    font-size: 12.5px;
}

.notice-body blockquote {
    margin: 0 0 10px;
    padding: 8px 12px;
    border-left: 3px solid var(--fm-primary);
    border-radius: 0 6px 6px 0;
    background: var(--fm-soft);
    color: var(--fm-text-sub);
}

.notice-actions {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 20px;
}

.notice-snooze-option {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    font-size: 12.5px;
    color: var(--fm-text-sub);
    cursor: pointer;
    user-select: none;
}

.notice-snooze-option input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
    pointer-events: none;
}

.notice-check {
    position: relative;
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    border: 1px solid var(--fm-border);
    border-radius: 4px;
    background: var(--fm-card);
    transition: background-color .15s, border-color .15s;
}

.notice-snooze-option input:checked + .notice-check {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
}

.notice-snooze-option input:checked + .notice-check::after {
    content: '';
    position: absolute;
    left: 5px;
    top: 2px;
    width: 4px;
    height: 8px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.notice-snooze-option input:focus-visible + .notice-check {
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .2);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--fm-primary) 20%, transparent);
}

.notice-ok {
    flex: 0 0 auto;
    min-width: 96px;
    height: 38px;
    padding: 0 24px;
    border: 1px solid var(--fm-primary);
    border-radius: 8px;
    background: var(--fm-primary);
    background: linear-gradient(135deg, var(--fm-primary), var(--fm-primary-dark));
    color: #fff;
    font-size: 13.5px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: 0 6px 14px rgba(63, 158, 99, .28);
    box-shadow: 0 6px 14px color-mix(in srgb, var(--fm-primary) 28%, transparent);
    transition: filter .15s, transform .15s;
}

.notice-ok:active {
    transform: scale(.98);
}

.notice-ok:hover {
    filter: brightness(1.06);
}

@media (max-width: 420px) {
    .notice-card {
        padding: 22px 18px 16px;
    }

    .notice-actions {
        gap: 8px;
    }

    .notice-snooze-option {
        font-size: 12px;
    }

    .notice-ok {
        min-width: 84px;
        padding: 0 18px;
    }
}

.auth-modal .auth-tabs {
    margin-bottom: 14px;
}

.auth-modal .auth-panel form,
.auth-modal .auth-step-1,
.auth-modal .auth-step-2 {
    gap: 10px;
}

.auth-modal .auth-panel input,
.auth-modal .auth-inline img,
.auth-modal .auth-submit {
    height: 40px;
}

.auth-modal .auth-uid-bar {
    margin-bottom: 10px;
    padding: 6px 12px;
}

.auth-modal .auth-third {
    margin-top: 12px;
    padding-top: 12px;
}

.auth-close {
    position: absolute;
    right: 12px;
    top: 10px;
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    font-size: 22px;
    line-height: 1;
    color: var(--fm-muted);
    cursor: pointer;
}

.auth-close:hover {
    color: var(--fm-text);
}

.auth-tabs {
    display: flex;
    gap: 2px;
    width: fit-content;
    margin: 0 auto 18px;
    padding: 4px;
    border-radius: 999px;
    background: var(--fm-bg);
}

.auth-tabs a {
    padding: 8px 16px;
    border-radius: 999px;
    font-size: 14px;
    line-height: 1.2;
    color: var(--fm-text-sub);
    transition: background-color .15s, color .15s;
}

.auth-tabs a:hover {
    color: var(--fm-primary);
}

.auth-tabs a.active {
    background: var(--fm-card);
    color: var(--fm-primary);
    font-weight: 600;
    box-shadow: 0 1px 3px rgba(40, 36, 24, .12);
}

.auth-panel form,
.auth-step-1,
.auth-step-2 {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.auth-panel input {
    height: 42px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    padding: 0 14px;
    font-size: 14px;
    width: 100%;
}

.auth-panel input:not([type="checkbox"]):not([type="radio"]) {
    background: var(--fm-soft);
    color: var(--fm-text);
}

.auth-panel input::placeholder {
    color: var(--fm-muted);
}

.auth-panel input:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.auth-field {
    position: relative;
}

.auth-field > i[class*="fa-"] {
    position: absolute;
    left: 13px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--fm-muted);
    font-size: 14px;
    pointer-events: none;
    z-index: 1;
}

.auth-field > input {
    padding-left: 38px;
}

.auth-inline .auth-field {
    flex: 1 1 auto;
}

.auth-inline {
    display: flex;
    gap: 8px;
    align-items: center;
}

.auth-inline img {
    height: 42px;
    border-radius: 0.25rem;
    cursor: pointer;
}

.auth-check {
    display: flex;
    align-items: center;
    gap: 6px;

    align-self: flex-start;
    font-size: 13px;
    color: var(--fm-text-sub);
    cursor: pointer;
    user-select: none;
}

.auth-check input,
.auth-panel .auth-check input,
.auth-modal .auth-panel .auth-check input {
    flex: 0 0 auto;
    width: auto;
    height: auto;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    accent-color: var(--fm-primary);
    cursor: pointer;
}

.auth-submit {
    height: 42px;
    font-size: 15px;
}

.auth-ext:empty {
    display: none;
}

.auth-ext {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--fm-line);
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

@media (max-width: 1024px) {
    .forum-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .forum-side {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    }
}

@media (max-width: 768px) {

    .forum-side {
        display: block;
    }

    .forum-side .widget {
        margin-bottom: 14px;
    }

    .forum-side .widget:last-child {
        margin-bottom: 0;
    }

    .forum-side > *:not(.widget-link):not(.widget-selfad) {
        display: none;
    }

    .forum-side.side-hide-m {
        display: none;
    }

    .link-cloud {
        gap: 9px 18px;
        padding: 2px 0 4px;
    }

    .link-cloud a {
        font-size: 13.5px;
        line-height: 2;
    }

    .author-layout {
        flex-direction: column;

        align-items: stretch;
    }

    .author-side {
        flex: 1 1 auto;
        width: 100%;
    }

    .author-main {
        width: 100%;
    }

    .follow-item {
        gap: 10px;
        padding: 12px 14px;
    }

    .author-profile .author-profile-ops {
        display: none;
    }

    .uc-tabs.author-tabbar a.author-msg-tab {
        display: inline-flex;
        align-items: center;
        gap: 5px;
        color: var(--fm-primary);
        font-weight: 600;
    }

    .uc-tabs.author-tabbar a.author-msg-tab i {
        font-size: 13px;
    }

    .author-menu {
        display: flex;
        overflow-x: auto;
        margin-top: 10px;
    }

    .author-menu a {
        flex: 0 0 auto;
        height: 38px;
        line-height: 38px;
        border-bottom: 0;
        border-right: 1px solid var(--fm-line);
    }

    .author-menu a:last-child {
        border-right: 0;
    }

    .pager span,
    .pager a,
    .pager em {
        min-width: 30px;
        height: 30px;
        padding: 0 6px;
        font-size: 13px;
    }

    .pager a[title="Previous Page"],
    .pager a[title="Next Page"] {
        min-width: 32px;
        height: 30px;
        font-size: 18px;
    }

    .pager a[title="Previous Page"] i,
    .pager a[title="Next Page"] i {
        width: 18px;
        height: 18px;
        font-size: 18px;
    }

    .pager a[title="Previous Page"] svg,
    .pager a[title="Next Page"] svg {
        width: 18px;
        height: 18px;
    }

    .topbar-in {
        flex-wrap: wrap;
        min-height: 50px;
        padding: 8px 14px;
        align-items: center;
    }

    .brand {
        order: 1;
        margin-right: auto;
    }

    .brand-text {
        font-size: 17px;
    }

    .brand-img {
        max-height: 28px;
    }

    .topbar-tools {
        order: 2;
        margin-left: 0;
    }

    .tool-btn {
        padding: 0 8px;
    }

    .tool-btn span {
        display: none;
    }

    .topbar-tools .tool-user {
        display: none;
    }

    .tool-menu {
        min-width: 172px;
        padding: 8px;
        border: 1px solid var(--fm-border);
        border-radius: 10px;
        background: var(--fm-card);
        box-shadow: 0 12px 28px rgba(50, 44, 30, .18);
    }

    .tool-menu::before {
        right: 20px;
        border-top: 1px solid var(--fm-border);
        border-left: 1px solid var(--fm-border);
        background: var(--fm-card);
    }

    .tool-menu a {
        padding: 10px;
        color: var(--fm-text);
    }

    .tool-menu a:hover {
        background: var(--fm-soft);
        color: var(--fm-primary);
    }

    .tool-menu a i {
        color: var(--fm-text-sub);
        opacity: 1;
    }

    .tool-more-wrap .tool-menu a.tool-menu-user {
        display: flex;
        margin-bottom: 6px;
        padding: 8px 10px 10px;
        border-bottom: 1px solid var(--fm-line);
        border-radius: 0;
        color: var(--fm-text-strong);
        font-weight: 600;
    }

    .tool-more-wrap .tool-menu a.tool-menu-user:hover {
        background: transparent;
        color: var(--fm-primary);
    }

    .tool-menu-avatar {
        flex: 0 0 auto;
        width: 26px;
        height: 26px;
        border-radius: 50%;
        font-size: 12px;
        object-fit: cover;
    }

    .tool-menu-name {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        min-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .tool-menu-uid {
        font-size: 11px;
        font-style: normal;
        font-weight: 400;
        color: var(--fm-text-sub);
    }

    .topbar-nav {
        display: none;
    }

    .topbar-nav .nav-list {
        height: 40px;
        border-top: 1px solid var(--fm-line);
    }

    .nav-item,
    .nav-link {
        height: 40px;
    }

    .nav-link {
        padding: 0 12px;
        font-size: 13px;
    }

    .nav-dropdown {
        top: 40px;
    }

    .search-form {
        padding: 11px 0;
    }

    .search-form input:not([type="radio"]):not([type="checkbox"]) {
        height: 38px;
        font-size: 13px;
    }

    .search-form .btn {
        height: 38px;
        padding: 0 16px;
    }

    .toolbar-side {
        display: none;
    }

    .thread-item {
        gap: 10px;
        padding: 12px;
    }

    .thread-avatar {
        flex: 0 0 36px;
        width: 36px;
        height: 36px;
    }

    .thread-title {
        font-size: 14px;
    }

    .thread-title {
        flex-wrap: nowrap;
        overflow: hidden;
    }

    .thread-title>* {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .thread-title>a {
        display: block;
        min-width: 0;
        flex: 0 1 auto;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        -webkit-line-clamp: unset;
        -webkit-box-orient: unset;
    }

    .thread-stats {
        min-width: 0;
        flex-direction: column;
        gap: 3px;
        align-items: flex-end;
    }

    .post-body {
        padding: 16px;
    }

    .post-author-line {
        gap: 6px;
    }

    .psb-right {
        gap: 12px;
    }

    .floor {
        gap: 10px;
        padding: 14px;
    }

    .floor-avatar {
        width: 36px;
        height: 36px;
        font-size: 15px;
        line-height: 36px;
    }

    .floor-child .floor-avatar {
        width: 32px;
        height: 32px;
        font-size: 13px;
        line-height: 32px;
    }

    .floor-no {
        font-size: 11px;
    }

    .floor-actions {
        gap: 10px;
    }

    .reply-box,
    .reply-head,
    .post-header {
        padding-left: 14px;
        padding-right: 14px;
    }

    .sign-foot {
        flex-wrap: wrap;
        gap: 10px;
    }

    .sign-actions {
        flex: 1 1 auto;
        justify-content: flex-end;
    }

    .post-title {
        font-size: 17px;
    }

    .forum-side {
        grid-template-columns: minmax(0, 1fr);
    }

    .widget-intro .widget-head {
        padding-top: 14px;
    }

    .intro-stats {
        gap: 3px;
    }

    .stat-cell b {
        font-size: 14px;
    }

    .stat-cell span {
        font-size: 11px;
    }

    .forum-footer {
        text-align: center;
        padding: 11px 0;
    }

    .footer-in {
        justify-content: center;
    }

    .footer-left,
    .footer-right {
        justify-content: center;
        width: 100%;
        margin-left: 0;
    }

    .back-top {
        right: 14px;
        bottom: 40px;
    }
}

.uc-main {
    padding-top: 20px;
}

.uc-layout {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.uc-side {
    flex: 0 0 190px;
    position: sticky;

    top: 64px;
}

.uc-profile {
    padding: 22px 16px 18px;
    background: var(--fm-card);

    border: 1px solid var(--fm-border);
    border-bottom: 0;
    border-radius: 0.25rem 0.25rem 0 0;
    text-align: center;
}

.uc-avatar {
    display: inline-flex;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--fm-soft);
}

.uc-avatar img,
.uc-avatar .forum-letter-avatar {
    width: 72px;
    height: 72px;
    font-size: 26px;
}

.uc-name {
    display: block;
    margin-top: 10px;
    font-size: 15px;
    color: var(--fm-text);
    word-break: break-all;
}

.uc-menu {
    background: var(--fm-card);

    border: 1px solid var(--fm-border);

    border-top-color: var(--fm-line);
    border-radius: 0 0 0.25rem 0.25rem;
    overflow: hidden;
}

.uc-menu a {
    display: block;
    padding: 13px 20px;
    font-size: 14px;
    color: var(--fm-text);
    text-align: center;
    border-bottom: 1px solid var(--fm-line);
}

.uc-menu a:last-child {
    border-bottom: 0;
}

.uc-menu a:hover {
    color: var(--fm-primary);
}

.uc-menu a.active {
    color: var(--fm-primary);
    background: var(--fm-tint-green);
    font-weight: 600;
}

.uc-content {
    flex: 1 1 auto;
    min-width: 0;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 6px;
}

.uc-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 10px 14px 0;
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-border);
    border-radius: 5px 5px 0 0;
    margin-bottom: 0;
    position: relative;
}

.uc-tabs a,
.uc-tabs>span {
    position: relative;
    display: inline-block;
    padding: 11px 18px;
    font-size: 14px;
    color: var(--fm-text-sub);
    border: 1px solid transparent;
    border-bottom: 1px solid transparent;
    border-radius: 0.25rem 0.25rem 0 0;
    background: transparent;
    transition: background-color .15s ease, color .15s ease;
}

.uc-tabs a:hover {
    color: var(--fm-primary);
}

.uc-tabs a.active,
.uc-tabs>span.active {
    background: var(--fm-card);
    border-color: var(--fm-border);
    border-bottom-color: var(--fm-card);
    color: var(--fm-primary);
    font-weight: 600;
    margin-bottom: -1px;
    padding-bottom: 12px;
}

.uc-panel {
    margin: 16px;
    padding: 24px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 4px;
}

.uc-content > .uc-panel {
    border: 0;
    border-radius: 0;
}

.uc-title {
    position: relative;
    margin: 0 0 18px;
    padding-left: 14px;
    font-size: 16px;
    color: var(--fm-text);
}

.uc-title::before {
    content: "";
    position: absolute;
    left: 0;
    top: 3px;
    width: 4px;
    height: 16px;
    border-radius: 0.25rem;
    background: var(--fm-primary);
}

.uc-hint {
    margin-top: 6px;
    font-size: 12px;
    color: var(--fm-muted);
    line-height: 1.7;
}

.uc-center {
    text-align: center;
}

.uc-tipbar {
    margin: 14px 0 18px;
    padding: 12px 16px;
    background: var(--fm-primary-light);
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-primary-dark);
    line-height: 1.8;
}

.uc-tipbar b {
    display: block;
    margin-bottom: 4px;
    color: var(--fm-primary);
}

.uc-tipbar ul {
    margin: 0;
    padding-left: 18px;
}

.uc-empty {
    padding: 40px 0;
    text-align: center;
    color: var(--fm-muted);
    font-size: 13px;
}

.uc-empty-pic {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 36px 0;
}

.empty-pic {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
}

.empty-pic img {
    width: 150px;
    max-width: 60%;
    height: auto;
    opacity: .9;
}

.uc-empty-pic img {
    width: 150px;
    max-width: 60%;
    height: auto;
    opacity: .9;
}

.uc-form {
    max-width: 560px;
}

.uc-center.uc-form,
.uc-form.uc-center {
    margin-left: auto;
    margin-right: auto;
}

.uc-field {
    margin-bottom: 16px;
}

.uc-field label {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
}

.uc-input,
.uc-textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 14px;
    color: var(--fm-text);
    transition: border-color .15s, box-shadow .15s;
}

.uc-input {
    height: 42px;
    padding: 0 14px;
}

.uc-textarea {
    padding: 10px 14px;
    line-height: 1.7;
    resize: vertical;
}

.uc-input:focus,
.uc-textarea:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.uc-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    padding: 0 26px;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: filter .15s;
}

.uc-btn:hover {
    filter: brightness(1.06);
}

.uc-btn:disabled {
    background: var(--fm-soft-2);
    color: var(--fm-muted);
    cursor: not-allowed;
}

.uc-btn-wide {
    width: 100%;
}

.uc-btn-plain {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 22px;
    margin-top: 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-text-sub);
    font-size: 13px;
    cursor: pointer;
}

.uc-btn-plain:hover {
    border-color: #d9534f;
    color: #d9534f;
}

.uc-readonly-card {
    margin-bottom: 18px;
    padding: 16px 18px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
}

.uc-readonly-label {
    display: block;
    font-size: 12px;
    color: var(--fm-muted);
}

.uc-readonly-value {
    display: inline-block;
    margin-top: 6px;
    font-size: 17px;
    color: var(--fm-text);
}

.uc-ok-tag {
    display: inline-block;
    margin-left: 8px;
    padding: 2px 10px;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 12px;
    font-style: normal;
}

.uc-pane-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
}

.uc-pane-head .uc-title {
    margin: 0;
    padding-left: 0;
    font-size: 17px;
}

.uc-pane-head .uc-title::before {
    display: none;
}

.uc-pane-desc {
    margin: 3px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
}

.uc-email-card {
    position: relative;
    padding-right: 160px;
}

.uc-email-line {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
}

.uc-email-line .uc-readonly-value {
    margin-top: 0;
}

.uc-email-toggle {
    position: absolute;
    top: 50%;
    right: 18px;
    transform: translateY(-50%);
}

.uc-code-row {
    display: flex;
    gap: 10px;
}

.uc-code-row .uc-input {
    flex: 1 1 auto;
    min-width: 0;
}

.uc-code-btn {
    flex: 0 0 auto;
    height: 42px;
    padding: 0 18px;
    border: 1px solid var(--fm-primary);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-primary);
    font-size: 13px;
    white-space: nowrap;
    cursor: pointer;
}

.uc-code-btn:hover:not(:disabled) {
    background: var(--fm-tint-green);
}

.uc-code-btn:disabled {
    border-color: var(--fm-border);
    color: var(--fm-muted);
    cursor: not-allowed;
}

.uc-hint-ok {
    color: var(--fm-primary);
}

.uc-hint-error {
    color: #d9534f;
}

.uc-lock-tip {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 20px;
    padding: 12px 16px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.uc-lock-tip svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 3px;
    fill: none;
    stroke: #c9a227;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.uc-profile-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: repeat(7, auto);
    grid-auto-flow: column;
    column-gap: 32px;
    row-gap: 14px;
    margin: 0 0 26px;
    padding: 0;
    list-style: none;
    font-size: 14px;
    color: var(--fm-text);
}

.uc-profile-grid li {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    min-height: 24px;
}

.uc-profile-grid li>span:first-child {
    color: var(--fm-text-sub);
}

.uc-profile-num,
.uc-profile-mail {
    color: var(--fm-primary);
}

.uc-profile-desc {
    max-width: 320px;
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uc-mute {
    color: var(--fm-muted);
    font-style: normal;
}

.uc-lv-open {
    display: inline-block;
    padding: 2px 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-text-sub);
    font-size: 12px;
    line-height: 20px;
    cursor: pointer;
}

.uc-lv-open:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.lv-badge {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    font-style: normal;
}

body.lv-modal-open {
    overflow: hidden;
}

.lv-modal {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.lv-modal[hidden] {
    display: none;
}

.lv-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(30, 28, 20, .45);
}

.lv-modal-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 520px;
    max-height: 84vh;
    background: var(--fm-card);
    border-radius: 0.25rem;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .22);
}

.lv-modal-head {
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 20px 22px 14px;
}

.lv-modal-head h3 {
    margin: 0;
    font-size: 20px;
    color: var(--fm-text-strong);
}

.lv-modal-head p {
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
}

.lv-modal-close {
    padding: 0 4px;
    border: 0;
    background: none;
    font-size: 26px;
    line-height: 1;
    color: #b7b3a4;
    cursor: pointer;
}

.lv-modal-close:hover {
    color: var(--fm-text-sub);
}

.lv-modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 4px 22px 22px;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--fm-border) transparent;
}

.lv-modal-body::-webkit-scrollbar {
    width: 6px;
}

.lv-modal-body::-webkit-scrollbar-thumb {
    border-radius: 3px;
    background: var(--fm-soft-2);
}

.lv-modal-body::-webkit-scrollbar-thumb:hover {
    background: var(--fm-primary);
}

.lv-modal-body::-webkit-scrollbar-track {
    background: transparent;
}

.lv-summary {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 0 16px;
}

.lv-summary-badge .lv-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 0.25rem;
    font-size: 14px;
}

.lv-summary-level,
.lv-summary-exp {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.lv-summary-level span,
.lv-summary-exp span {
    font-size: 12px;
    color: var(--fm-muted);
}

.lv-summary-level b {
    font-size: 18px;
    color: var(--fm-text-strong);
}

.lv-summary-exp {
    margin-left: auto;
    text-align: right;
}

.lv-summary-exp b {
    font-size: 22px;
    color: var(--fm-text-strong);
}

.lv-summary-exp em {
    margin-left: 4px;
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.lv-progress-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.lv-progress-top b {
    color: var(--fm-text-strong);
}

.lv-progress-top em {
    font-style: normal;
    color: var(--fm-muted);
}

.lv-progress-bar {
    margin-top: 8px;
    height: 8px;
    border-radius: 0.25rem;
    background: var(--fm-soft-2);
    overflow: hidden;
}

.lv-progress-bar i {
    display: block;
    height: 100%;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    transition: width .3s;
}

.lv-logs-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 18px 0 4px;
    padding-top: 16px;
    border-top: 1px solid var(--fm-line);
}

.lv-logs-head b {
    font-size: 15px;
    color: var(--fm-text-strong);
}

.lv-logs-head span {
    font-size: 12px;
    color: var(--fm-muted);
}

.lv-logs {
    margin: 0;
    padding: 0;
    list-style: none;
}

.lv-logs li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 13px 0;
    border-bottom: 1px solid var(--fm-line);
}

.lv-logs li:last-child {
    border-bottom: 0;
}

.lv-dot {
    flex: 0 0 auto;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #7c4dff;
}

.lv-dot-post {
    background: #ff9800;
}

.lv-dot-checkin {
    background: var(--fm-primary);
}

.lv-log-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.lv-log-main b {
    font-size: 14px;
    color: var(--fm-text-strong);
}

.lv-log-main span {
    font-size: 12px;
    color: var(--fm-muted);
}

.lv-log-exp {
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 600;
    font-style: normal;
    color: var(--fm-primary);
}

.lv-logs-empty {
    padding: 26px 0;
    text-align: center;
    font-size: 13px;
    color: var(--fm-muted);
}

.login-log-box {
    margin-bottom: 18px;
}

.login-log-title {
    display: block;
    margin-bottom: 10px;
    font-size: 14px;
    color: var(--fm-text);
}

.login-log-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.login-log-list li {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
}

.login-log-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-text-sub);
}

.login-log-icon svg {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.login-log-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.login-log-main b {
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.login-log-main span {
    font-size: 12px;
    color: var(--fm-muted);
}

.login-log-side {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.login-log-side time {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.login-log-now {
    padding: 1px 8px;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: #2e9e5b;
    font-size: 11px;
    font-style: normal;
    line-height: 18px;
}

.login-log-detail {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    padding: 0;
    border: 1px solid #d5d1c2;
    border-radius: 50%;
    background: var(--fm-card);
    color: var(--fm-text-sub);
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    transition: color .15s, border-color .15s, background-color .15s;
}

.login-log-detail:hover,
.login-log-detail:focus-visible {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
    outline: none;
}

body.lg-modal-open {
    overflow: hidden;
}

.lg-modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.lg-modal[hidden] {
    display: none;
}

.lg-modal-mask {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(38, 36, 30, .45);
}

.lg-modal-box {
    position: relative;
    width: 100%;
    max-width: 420px;
    padding: 18px 22px 20px;
    border-radius: 0.5rem;
    background: var(--fm-card);
    box-shadow: 0 14px 34px rgba(30, 28, 24, .2);
    animation: lg-modal-in .16s ease-out;
}

@keyframes lg-modal-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.lg-modal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.lg-modal-head b {
    font-size: 18px;
    color: var(--fm-text-strong);
}

.lg-modal-x {
    flex: 0 0 auto;
    width: 28px;
    height: 28px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--fm-muted);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: color .15s;
}

.lg-modal-x:hover {
    color: var(--fm-primary);
}

.lg-modal-tip {
    margin: 10px 0 14px;
    font-size: 14px;
    line-height: 1.7;
    color: var(--fm-text);
}

.lg-modal-sub {
    display: block;
    margin-bottom: 2px;
    font-size: 14px;
    color: var(--fm-text-strong);
}

.lg-modal-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.lg-modal-list li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 7px 0;
    font-size: 13px;
    color: var(--fm-text);
    word-break: break-all;
}

.lg-modal-list i {
    flex: 0 0 auto;
    width: 16px;
    text-align: center;
    color: var(--fm-text-sub);
    font-size: 13px;
}

.uc-form.uc-pwd-form {
    max-width: 100%;
    padding: 20px 20px 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.pwd-group {
    display: flex;
    align-items: stretch;
    margin-bottom: 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    overflow: hidden;
    transition: border-color .15s, box-shadow .15s;
}

.pwd-group:focus-within {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.pwd-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 56px;
    background: var(--fm-soft);
    border-right: 1px solid var(--fm-border);
    color: var(--fm-text-sub);
}

.pwd-icon svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.pwd-input {
    flex: 1 1 auto;
    min-width: 0;
    height: 48px;
    padding: 0 16px;
    border: 0;
    background: transparent;
    font-size: 14px;
    color: var(--fm-text);
    outline: none;
}

.pwd-input::placeholder {
    color: #b0ac9d;
}

.pwd-actions {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-top: 18px;
}

.pwd-actions .uc-btn {
    min-width: 220px;
    height: 46px;
    font-size: 15px;
}

.pwd-forgot {
    font-size: 13px;
    color: var(--fm-text-sub);
}

.pwd-forgot a {
    color: var(--fm-text-sub);
}

.pwd-forgot a:hover {
    color: var(--fm-primary);
}

.uc-avatar-box {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 26px 0;
    margin-bottom: 18px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
}

.uc-avatar-box .forum-letter-avatar,
.uc-avatar-box img {
    width: 88px;
    height: 88px;
    border-radius: 50%;
    font-size: 32px;
}

.uc-form.uc-avatar-form {
    max-width: 100%;
    padding: 18px 20px 20px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.avatar-upload-title {
    display: block;
    margin-bottom: 12px;
    font-size: 14px;
    color: var(--fm-text);
}

.avatar-file {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    border: 0;
    opacity: 0;
    pointer-events: none;
}

.avatar-pick {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 38px;
    padding: 0 20px;
    margin-bottom: 16px;
    font-size: 13px;
    cursor: pointer;
}

.avatar-pick svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.avatar-cache-tip {
    margin: 14px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
}

.avatar-progress {
    margin-top: 16px;
}

.avatar-progress>span {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.avatar-progress>span b {
    color: var(--fm-primary);
}

.avatar-progress-bar {
    height: 8px;
    border-radius: 0.25rem;
    background: var(--fm-soft-2);
    overflow: hidden;
}

.avatar-progress-bar i {
    display: block;
    width: 0;
    height: 100%;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    transition: width .2s;
}

.avatar-modal {
    position: fixed;
    inset: 0;
    z-index: 210;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.avatar-modal[hidden] {
    display: none;
}

.avatar-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(30, 28, 20, .45);
}

.avatar-modal-panel {
    position: relative;
    width: 100%;
    max-width: 380px;
    background: var(--fm-card);
    border-radius: 0.25rem;
    overflow: hidden;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .22);
}

.avatar-modal-head {
    position: relative;
    padding: 14px 44px 14px 18px;
    border-bottom: 1px solid var(--fm-line);
    font-size: 16px;
    color: var(--fm-text-strong);
}

.avatar-modal-x {
    position: absolute;
    top: 8px;
    right: 12px;
    padding: 0 4px;
    border: 0;
    background: none;
    font-size: 22px;
    line-height: 1;
    color: #b7b3a4;
    cursor: pointer;
}

.avatar-modal-x:hover {
    color: var(--fm-text-sub);
}

.avatar-modal-body {
    padding: 22px 18px;
    font-size: 14px;
    color: var(--fm-text);
    line-height: 1.7;
}

.avatar-modal-foot {
    display: flex;
    justify-content: flex-end;
    padding: 0 18px 16px;
}

.avatar-modal-foot .uc-btn {
    min-width: 84px;
    height: 36px;
    padding: 0 16px;
    font-size: 13px;
}

.tail-tip {
    display: flex;

    align-items: center;
    gap: 8px;
    margin-bottom: 18px;
    padding: 12px 16px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 1.8;
}

.tail-tip svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 4px;
    fill: none;
    stroke: #e8a33a;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.uc-form.uc-tail-form {
    max-width: 100%;
}

.tail-label-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 8px;
}

.tail-label-row b {
    font-size: 14px;
    color: var(--fm-text);
}

.tail-label-row em {
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.tail-label-main {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.tail-label-row .tail-vip-tip {
    font-size: 13px;
    font-style: normal;
    color: #706f69;
}

.tail-label-row .tail-vip-tip b {
    font-size: inherit;
    color: #c000ff;
}

.tail-editor {
    position: relative;
    margin-bottom: 20px;
}

.tail-textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 12px 14px 36px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 14px;
    line-height: 1.8;
    color: var(--fm-text);
    resize: vertical;
    transition: border-color .15s, box-shadow .15s;
}

.tail-textarea:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.tail-counter {
    position: absolute;
    right: 12px;
    bottom: 10px;
    padding: 2px 10px;
    border-radius: 0.25rem;
    background: #5c5340;
    color: #fff;
    font-size: 12px;
    line-height: 18px;
}

.tail-refresh {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-text-sub);
    font-size: 12px;
    cursor: pointer;
}

.tail-refresh:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.tail-refresh svg {
    width: 13px;
    height: 13px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.9;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.uc-tail-preview {
    margin-bottom: 20px;
    padding: 14px 16px;
    min-height: 24px;
    background: var(--fm-soft);
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 1.9;
    word-break: break-all;
}

.uc-tail-preview a {
    color: #2f6fd0;
}

.uc-form.uc-rename-form {
    max-width: 100%;
}

.rename-current {
    margin-bottom: 16px;
    padding: 12px 16px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
    font-size: 14px;
    color: var(--fm-text-sub);
}

.rename-current b {
    color: var(--fm-text);
}

.rename-label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    color: var(--fm-text);
}

.rename-input {
    margin-bottom: 6px;
}

.rename-free {
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--fm-primary);
}

.rename-none {
    margin: 10px 0 0;
    font-size: 13px;
    color: #d9534f;
}

.rename-submit {
    margin-top: 6px;
}

.uc-rename-box {
    margin-bottom: 16px;
    padding: 14px 16px 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.uc-rename-box .rename-current,
.uc-rename-box .rename-label,
.uc-rename-box .rename-input,
.uc-rename-box .uc-hint,
.uc-rename-box .rename-free,
.uc-rename-box .rename-none {
    margin-top: 0;
    margin-bottom: 0;
}

.uc-rename-box .rename-current {
    padding: 0;
    background: transparent;
}

.uc-rename-box .rename-input {
    margin-bottom: 8px;
}

.uc-rename-box .rename-free,
.uc-rename-box .rename-none {
    margin-top: 10px;
}

.coins-notice {
    display: flex;

    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 12px 16px;
    background: var(--fm-card);
    border: 1px solid #f3d9d9;
    border-radius: 0.25rem;
    font-size: 13px;
    color: #6f5b5b;
    line-height: 1.8;
}

.coins-notice svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 4px;
    fill: none;
    stroke: #d9534f;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.coins-notice b {
    color: #c0392b;
}

.coins-summary {
    display: grid;
    grid-template-columns: 1fr 220px;
    gap: 12px;
    margin-bottom: 12px;
}

.coins-balance-card {
    position: relative;
    z-index: 0;        
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;   
    gap: 14px;
    padding: 22px 24px;
    border-radius: 0.25rem;
    background: linear-gradient(135deg, #2c3e50 0%, #34495e 100%);
    color: #fff;
}

.coins-balance-card::after {
    content: '';
    position: absolute;
    z-index: -1;
    top: 50%;
    right: 0;
    height: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    background: rgba(255, 255, 255, .06);
    transform: translate(50%, -50%);
    pointer-events: none;
}

.coins-balance-icon {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 16px;
    background: rgba(255, 255, 255, .42);
}

.coins-balance-icon svg {
    width: 30px;
    height: 30px;
    fill: #2c3e50;   
}

.coins-balance-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    text-align: left;
}

.coins-balance-info em {
    font-style: normal;
    font-size: 13px;
    color: rgba(255, 255, 255, .72);
}

.coins-balance-info b {
    font-size: 32px;
    font-weight: 700;
    line-height: 1.15;
    color: #fff;
}

.coins-today-card {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 8px;
    padding: 22px 24px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.coins-today-card span {
    font-size: 13px;
    color: var(--fm-text-sub);
}

.coins-today-card b {
    font-size: 26px;
}

.coins-stat-cards {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 20px;
}

.coins-stat {
    padding: 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.coins-stat span {
    display: block;
    margin-bottom: 8px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.coins-stat b {
    font-size: 22px;
}

.coins-stat,
.coins-today-card {
    position: relative;
    z-index: 0;        
    overflow: hidden;  
}

.coins-card-bg {
    position: absolute;
    z-index: -1;
    right: 8px;
    bottom: -10px;
    font-size: 62px;
    line-height: 1;
    color: var(--fm-primary);
    opacity: .08;
    pointer-events: none;
}

.coins-today-card .coins-card-bg {
    right: 6px;
    bottom: -8px;
    font-size: 66px;
}

.up {
    color: var(--fm-primary);
}

.down {
    color: #d9534f;
}

.coins-rules {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 48px;
    margin-bottom: 18px;
}

.coins-rules-note {
    margin: -8px 0 18px;
    font-size: 12px;
    line-height: 1.7;
    color: var(--fm-text-sub);
}

.coins-rule-title {
    display: block;
    margin-bottom: 6px;
    font-size: 14px;
    color: var(--fm-primary);
}

.coins-rule-title.penalty {
    color: #d9534f;
}

.coins-rule-col ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.coins-rule-col li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 2px;
    border-bottom: 1px solid var(--fm-line);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.coins-rule-col li:last-child {
    border-bottom: 0;
}

.coins-rule-col em {
    font-style: normal;
    font-weight: 600;
}

.coins-rule-col li.coins-rule-empty {
    justify-content: flex-start;
    color: var(--fm-muted);
}

.coins-risk-tip {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 12px 16px;
    background: var(--fm-tint-red);
    border: 1px solid #f3d9d9;
    border-radius: 0.25rem;
    font-size: 13px;
    color: #a3564f;
    line-height: 1.8;
}

.coins-risk-tip svg {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    margin-top: 4px;
    fill: none;
    stroke: #d9534f;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.coins-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.coins-table th {
    padding: 12px 14px;
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-border);
    font-weight: 600;
    color: var(--fm-text-sub);
    text-align: center;
}

.coins-table td {
    padding: 13px 14px;
    border-bottom: 1px solid var(--fm-line);
    text-align: center;
    color: var(--fm-text);
}

.coins-table tbody tr:hover {
    background: var(--fm-soft-2);
}

.coins-table td.td-num {
    font-weight: 600;
}

.coins-table td.td-time {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.uc-subtabs {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}

.uc-subtabs a {
    padding: 4px 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.uc-subtabs a:hover {
    color: var(--fm-primary);
}

.uc-subtabs a.active {
    background: var(--fm-soft-2);
    border-color: #e6e1d2;
    color: var(--fm-text);
    font-weight: 600;
}

.uc-rename-tabs {
    display: inline-flex;
    gap: 4px;
    margin: -6px 0 16px;
    padding: 4px;
    background: var(--fm-soft-2);
    border-radius: 5px;
}

.uc-rename-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 7px 20px;
    border-radius: 5px;
    font-size: 14px;
    color: var(--fm-text-sub);
    transition: color .15s ease, background .15s ease, box-shadow .15s ease;
}

.uc-rename-tabs a:hover {
    color: var(--fm-primary);
}

.uc-rename-tabs a.active {
    color: var(--fm-primary);
    font-weight: 600;
    background: var(--fm-card);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .12);
}

.uc-rename-tabs .uc-rename-label {
    display: inline-flex;
    align-items: center;
}

.uc-rename-desc {
    margin: 0 0 14px;
}

.uc-dyn-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.uc-dyn-item {
    padding: 16px 0;
    border-bottom: 1px solid var(--fm-line);
}

.uc-dyn-item:last-child {
    border-bottom: 0;
}

.uc-dyn-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px;
}

.uc-dyn-avatar {
    flex: 0 0 auto;
    display: inline-flex;
}

.uc-dyn-avatar img,
.uc-dyn-avatar .forum-letter-avatar {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    overflow: hidden;
    font-size: 14px;
    line-height: 32px;
}

.uc-dyn-name {
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-primary);
}

.uc-dyn-head time {
    font-size: 12px;
    color: var(--fm-muted);
}

.uc-dyn-bar {
    display: block;
    margin-bottom: 10px;
    padding: 9px 12px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
    font-size: 12px;
    color: var(--fm-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uc-dyn-bar:hover {
    color: var(--fm-primary);
}

.uc-dyn-title {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text);
}

.uc-dyn-title:hover {
    color: var(--fm-primary);
}

.uc-dyn-body {
    font-size: 14px;
    color: var(--fm-text);
    line-height: 1.75;
    word-break: break-word;
}

.uc-topic-list,
.uc-stream {
    list-style: none;
    margin: 0;
    padding: 0;
}

.uc-stream li {
    padding: 13px 0;
    border-bottom: 1px dashed #f0ece1;
}

.uc-stream li:last-child {
    border-bottom: 0;
}

.uc-topic-title {
    display: block;
    font-size: 14px;
    color: var(--fm-text);
    font-weight: 500;
}

.uc-topic-title:hover {
    color: var(--fm-primary);
}

.uc-topic-meta,
.uc-stream-meta {
    display: block;
    margin-top: 5px;
    font-size: 12px;
    color: var(--fm-muted);
}

.uc-topic-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 0;
    border-bottom: 1px solid var(--fm-line);
}

.uc-topic-item:last-child {
    border-bottom: 0;
}

.uc-thumb {
    flex: 0 0 auto;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--fm-soft-2);
}

.uc-thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.uc-thumb .forum-avatar {
    border-radius: 50%;
}

.uc-thumb .forum-avatar:hover {
    transform: none;
}

.uc-thumb-letter {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}

.uc-topic-body {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 2px;
}

.uc-topic-body .uc-topic-title {
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uc-topic-body .uc-topic-meta {
    margin-top: 0;
}

.uc-topic-meta a {
    color: var(--fm-primary);
}

.uc-topic-stats {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 4px;
}

.uc-stat-comment {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.uc-stat-comment i {
    font-size: 12.5px;
}

.uc-stat-collect {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.uc-stat-collect svg {
    width: 13px;
    height: 13px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.uc-stream-meta {
    font-size: 13px;
    color: var(--fm-text-sub);
    margin-top: 0;
}

.uc-stream-meta a {
    color: var(--fm-primary);
}

.uc-stream-body {
    margin-top: 7px;
    padding: 10px 14px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-text);
    line-height: 1.7;
    word-break: break-word;
}

.uc-users {
    display: flex;
    flex-direction: column;
}

.uc-user-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px dashed var(--fm-line);
}

.uc-user-row:last-child {
    border-bottom: 0;
}

.uc-user-avatar {
    flex: 0 0 auto;
    display: inline-flex;
}

.uc-user-avatar img,
.uc-user-avatar .forum-letter-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    font-size: 16px;
}

.uc-user-info {
    flex: 1 1 auto;
    min-width: 0;
}

.uc-user-name {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uc-user-name:hover {
    color: var(--fm-primary);
}

.uc-user-info em {
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.uc-user-follow {
    flex: 0 0 auto;
}

.uc-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.uc-table th,
.uc-table td {
    padding: 11px 14px;
    border-bottom: 1px solid var(--fm-line);
    text-align: left;
}

.uc-table thead th {
    background: var(--fm-soft);
    color: var(--fm-text-sub);
    font-weight: 600;
    font-size: 12px;
}

.uc-table tbody tr:hover {
    background: var(--fm-soft);
}

.uc-table a {
    color: var(--fm-text);
}

.uc-table a:hover {
    color: var(--fm-primary);
}

.th-rank {
    width: 60px;
}

.th-num,
.td-num {
    text-align: right;
}

.td-num b {
    color: var(--fm-primary);
}

.uc-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 0.25rem;
    background: var(--fm-soft-2);
    color: var(--fm-text-sub);
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
}

.uc-rank.top {
    background: #d9534f;
    color: #fff;
}

.uc-rank-me {
    display: inline-block;
    margin-left: 6px;
    padding: 0 6px;
    height: 18px;
    line-height: 18px;
    border-radius: 0.25rem;
    background: #f1c84c;
    color: #000;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    vertical-align: 1px;
}

.uc-rank-table th:first-child,
.uc-rank-table td:first-child,
.uc-rank-table th:nth-child(2),
.uc-rank-table td:nth-child(2) {
    text-align: center;
}

.uc-table .th-center,
.uc-table .td-center {
    text-align: center;
}

.uc-rank-table {
    border: 1px solid var(--fm-border);
}
.uc-rank-table th,
.uc-rank-table td {
    border: 1px solid var(--fm-border);
}

.uc-table .lv-badge {
    color: #fff;
}

.uc-verify-notice {
    max-width: 520px;
    margin: 14px auto 18px;
    background: var(--fm-tint-gold);
    border-left: 0;
    border-radius: 0.25rem;
    color: var(--fm-text-sub);
}

.uc-verify-cond-title {
    max-width: 520px;
    margin: 6px auto 10px;
    font-size: 22px;
    font-weight: 500;
    color: var(--fm-text);
    text-align: center;
}

.uc-verify-cond-title + .uc-hint {
    margin-bottom: 16px;
}

.uc-cond-table {
    max-width: 520px;
    margin: 0 auto;
    border: 1px solid var(--fm-border);
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--fm-radius);
    background: var(--fm-card);
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(40, 36, 24, .04);
    font-size: 14px;
}

.uc-cond-table th,
.uc-cond-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--fm-line);
    text-align: center;
}

.uc-cond-table tbody tr:last-child td {
    border-bottom: 0;
}

.uc-cond-table tbody tr:hover {
    background: var(--fm-soft);
}

.uc-cond-table thead th {
    background: var(--fm-soft);
    color: var(--fm-text-sub);
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: .02em;
}

.uc-cond-table .th-num {
    text-align: center;
}

.uc-cond-table th:last-child,
.uc-cond-table td:last-child {
    width: 130px;
}

.uc-cond-table td {
    color: var(--fm-text);
}

.uc-cond-table .uc-cond-icon {
    width: 18px;
    height: 18px;
    vertical-align: -4px;
}

.uc-form.uc-verify-form {
    max-width: 520px;
    margin: 0 auto;
}

.uc-verify-submit {
    display: flex;
    width: 100%;
    max-width: 520px;
    margin: 18px auto 0;
    padding: 0 32px;
    border-radius: 0.25rem;
}

.uc-verify-done {
    max-width: 460px;
    margin: 10px auto;
    padding: 30px 20px;
    background: var(--fm-tint-green);
    border-radius: 0.25rem;
    text-align: center;
}

.uc-verify-done b {
    display: block;
    margin: 10px 0;
    font-size: 16px;
    color: var(--fm-text);
}

.uc-verify-done span {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.uc-verify-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--fm-primary);
    color: #fff;
    font-size: 26px;
    font-style: normal;
}

.uc-verify-done .uc-verify-badge {
    display: block;
    width: 52px;
    height: 52px;
    margin: 0 auto;
    object-fit: contain;
}

.uc-verified-name {
    color: var(--fm-primary);
    font-style: normal;
}

.uc-verify-pending,
.uc-verify-reject {
    max-width: 460px;
    margin: 10px auto;
    padding: 30px 20px;
    border-radius: 0.25rem;
    text-align: center;
}

.uc-verify-pending {
    background: var(--fm-tint-gold);
}

.uc-verify-reject {
    background: var(--fm-tint-red);
}

.uc-verify-pending b,
.uc-verify-reject b {
    display: block;
    margin: 10px 0;
    font-size: 16px;
    color: var(--fm-text);
}

.uc-verify-pending span,
.uc-verify-reject span {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.uc-verify-pending .uc-verify-icon {
    background: #e8c34a;
}

.uc-verify-reject .uc-verify-icon {
    background: #d9534f;
}

.uc-verify-hero {
    margin: 26px 0 4px;
    text-align: center;
}

.uc-verify-hero-icon {
    position: relative;
    display: inline-block;
    line-height: 1;
}

.uc-verify-hero-icon .fa-certificate {
    font-size: 62px;
    line-height: 1;
    color: var(--fm-primary, #3f9e63);
}

.uc-verify-hero-icon .fa-check {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -55%);
    font-size: 26px;
    line-height: 1;
    color: #fff;
}

.uc-verify-hero b {
    display: block;
    margin-top: 8px;
    font-size: 20px;
    color: var(--fm-primary, #3f9e63);
}

.uc-verify-sec {
    display: flex;
    align-items: center;
    gap: 6px;
    max-width: 520px;
    margin: 24px auto 10px;
    font-size: 16px;
    color: var(--fm-primary, #3f9e63);
}

.uc-verify-lockbox {
    max-width: 520px;
    margin: 0 auto;
}

.uc-verify-sec i {
    font-size: 18px;
    line-height: 1;
}

.uc-verify-lock-tip {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 14px 0 0;
    font-size: 14px;
    font-weight: 600;
    color: #e05666;
}

.uc-verify-lock-tip i {
    font-size: 16px;
    line-height: 1;
}

.uc-verify-lock-desc {
    margin: 14px 0 0;
    font-size: 14px;
    color: var(--fm-text-sub);
}

.uc-verify-lock-desc .lv-badge {
    vertical-align: -4px;
    margin: 0 2px;
}

.v-icon {
    width: 16px;
    height: 16px;
    margin-right: 4px;
    vertical-align: -3px;
}

.v-icon.gm-icon {
    object-fit: contain;
}

.uid-badge {
    width: 14px;
    height: 14px;
    margin-left: 4px;
    vertical-align: -2px;
}

.author-home-name .uid-badge {
    margin-left: 0;
}

.author-home-name .v-icon,
.author-home-name .vip-badge {
    margin-left: 0;
    margin-right: 0;
}

.pal-name .uid-badge,
.floor-name .uid-badge,
.floor-quote-name .uid-badge,
.ap-name .uid-badge,
.follow-name .uid-badge,
.uc-name .uid-badge,
.author-profile-name .uid-badge {
    width: 13px;
    height: 13px;
    margin-left: 3px;
    vertical-align: -1px;
}

.author-profile-name .v-icon,
.uc-name .v-icon {
    width: 16px;
    height: 16px;
    margin: 0 0 0 3px;
    vertical-align: -3px;
}

.pal-name .v-icon,
.floor-name .v-icon,
.floor-quote-name .v-icon,
.ap-name .v-icon {
    width: 16px;
    height: 16px;
    margin-right: 3px;
    vertical-align: -3px;
}

.v_icon_2 {
    filter: hue-rotate(180deg);
}

.v_icon_3 {
    filter: hue-rotate(220deg);
}

.v_icon_4 {
    filter: hue-rotate(53deg);
}

.uc-verify-legend {
    max-width: 520px;
    margin: 16px auto 0;
    padding-top: 14px;
    border-top: 1px solid var(--fm-line);
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 2;
}

.uc-verify-legend-title {
    display: block;
    margin-bottom: 2px;
    color: var(--fm-text-sub);
}

.uc-verify-legend-item {
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
}

.uc-verify-legend-item .v-icon {
    margin-right: 0;
    margin-left: 3px;
}

.uc-verify-tip {
    margin-bottom: 14px;
    padding: 10px 16px;
    background: var(--fm-tint-green);
    border-radius: 0.25rem;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
}

#msg-entry {
    position: relative;
}

.msg-entry-badge {
    position: absolute;
    top: -2px;
    right: -2px;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    border-radius: 0.25rem;
    background: #d9534f;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    line-height: 16px;
    text-align: center;
}

.uc-menu-badge {
    display: inline-block;
    min-width: 16px;
    height: 16px;
    padding: 0 5px;
    margin-left: 6px;
    border-radius: 0.25rem;
    background: #d9534f;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    line-height: 16px;
    text-align: center;
    vertical-align: 1px;
}

.author-profile-ops {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
}

.author-msg-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 32px;
    padding: 0 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-text);
    font-size: 13px;
}

.author-msg-btn:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.author-msg-btn svg {
    width: 14px;
    height: 14px;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.uc-tabs.author-tabbar {
    border-radius: 0.25rem 0.25rem 0 0;
}

.uc-tabs a.author-msg-tab {
    display: none;
}

.uc-tabs.author-tabbar + .author-panel {
    border-top: 0;
}

.author-home {
    padding: 25px;
    border-radius: 0 0 0.25rem 0.25rem;
}

.author-home-box {
    padding: 14px 14px 6px;
    border: 1px solid var(--fm-border);
    border-radius: 10px;
    overflow: hidden; 
}

.author-cover {
    height: 132px;
    margin: -14px -14px 0;
    border-radius: 0;
    overflow: hidden;
    background: var(--fm-primary-light);
}

.author-cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.author-home-head {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    padding: 12px 2px 12px 22px;
}

.author-home-avatar {
    flex: 0 0 auto;
    display: block;
    width: 66px;
    height: 66px;
    margin-top: -34px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--fm-bg);
    box-shadow: 0 0 0 2px #fff;
}

.author-home-avatar img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.author-home-avatar .forum-letter-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    color: #fff;
    font-size: 26px;
    font-weight: 600;
}

.author-home-info {
    flex: 1 1 auto;
    min-width: 0;
}

.author-home-name {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    font-size: 18px;
    font-weight: 600;
    color: var(--fm-text-strong);
    word-break: break-word;
}

.author-home-ops {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.author-home-ops .follow-btn {
    display: inline-flex;
    align-items: center;
    height: auto;
    padding: 0.3em 0.75em;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.5;
}

.author-home-ops .follow-btn:hover {
    background: var(--fm-primary-dark, var(--fm-primary));
    color: #fff;
}

.author-home-ops .follow-btn.is-followed {
    border: 1px solid var(--fm-border);
    background: var(--fm-card, #faf9f5);
    color: var(--fm-text-sub);
    font-weight: 600;
}

.author-home-ops .author-remark-btn {
    display: inline-flex;
    align-items: center;
    height: auto;
    padding: 0.3em 0.6em;
    font-size: 10.5px;
    font-weight: 600;
    line-height: 1.5;
}

.author-home-ops .author-remark-btn i {
    font-size: 10px;
}

.author-home-sub {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.author-home-sub .author-home-uid,
.author-home-sub .lv-badge,
.author-home-sub .fm-tag {
    display: inline-block;
    padding: 0.25em 0.4em;
    border-radius: 0.25rem;
    font-size: 10.5px;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
}

.author-home-uid {
    background: #ff95a7;
    color: #fff;
}

.author-home-role,
.author-home-remark {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 9px;
    border-radius: 0.25rem;
    background: var(--fm-bg);
}

.author-home-remark {
    background: var(--fm-primary-light);
    color: var(--fm-primary-dark);
}

.fm-tag {
    display: inline-block;
    padding: 2px 9px;
    border-radius: 0.25rem;
    background: #eef0f3;
    color: var(--fm-text);
    font-size: 12px;
    line-height: 1.5;
    white-space: nowrap;
}

.floor-tag,
.pal-tag {
    margin-left: 5px;
    padding: 0.25em 0.4em;
    border-radius: 0.25rem;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    vertical-align: baseline;
}

.msg-tag {
    margin-left: 4px;
    padding: 0 4px;
    border-radius: 0.25rem;
    font-size: 10px;
    font-weight: 400;
    line-height: 15px;
    vertical-align: 1px;
}

.msg-conv-name .v-icon,
.notice-name .v-icon,
.msg-line-name .v-icon,
.msg-chat-user .v-icon {
    width: 14px;
    height: 14px;
    margin: 0 0 0 4px;
    vertical-align: -2px;
}

.msg-conv-name .vip-badge,
.notice-name .vip-badge,
.msg-line-name .vip-badge,
.msg-chat-user .vip-badge {
    height: 14px;
    margin-left: 4px;
    vertical-align: -2px;
}

.usertag-title-icon {
    margin-right: 6px;
    color: var(--fm-primary);
}

.usertag-block {
    margin-top: 18px;
}

.usertag-tip {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding: 10px 14px;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary-dark);
    font-size: 13px;
}

.usertag-table-wrap {
    overflow-x: auto;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
}

.usertag-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.usertag-table th,
.usertag-table td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--fm-line);
    text-align: left;
    vertical-align: middle;
}

.usertag-table th {
    background: var(--fm-soft);
    font-weight: 600;
    color: var(--fm-text-strong);
    white-space: nowrap;
}

.usertag-table tbody tr:last-child td {
    border-bottom: 0;
}

.usertag-table tbody tr:hover {
    background: var(--fm-soft);
}

.usertag-col-name {
    width: 120px;
    white-space: nowrap;
}

.usertag-col-howto {
    width: 210px;
    color: var(--fm-text-sub);
}

.usertag-empty {
    padding: 24px;
    text-align: center;
    color: var(--fm-text-sub);
}

@media (max-width: 640px) {

    .usertag-table th,
    .usertag-table td {
        padding: 10px 10px;
        font-size: 13px;
    }

    .usertag-col-name {
        width: 92px;
    }

    .usertag-col-howto {
        width: 140px;
    }
}

.author-remark-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 32px;
    padding: 0 13px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
    transition: border-color .15s, color .15s, background-color .15s;
}

.author-remark-btn:hover {
    border-color: var(--fm-primary);
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.author-home-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 26px;
    padding: 8px 2px 14px 22px;
}

.author-home-stats li {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.author-home-stats b {
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-primary);
}

.author-home-stats a:hover b {
    color: var(--fm-primary-dark);
}

.author-home-meta {
    padding: 0 2px 10px 22px;
}

.author-home-meta li {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px;
    padding: 5px 0;
    font-size: 13.5px;
    line-height: 1.7;
}

.author-home-meta li > span {
    color: var(--fm-text-sub);
}

.author-home-meta li > b {
    font-weight: 500;
    color: var(--fm-text);
    word-break: break-word;
}

.author-home-meta li.is-inline {
    gap: 8px;
}

.author-home-meta li.is-inline > b {
    margin-right: 6px;
}

.author-ban-tip {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin: 0 2px 12px 22px;
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.7;
    color: #dd3b3b;
    word-break: break-word;
}

.author-ban-tip i {
    margin-top: 4px;
    font-size: 12px;
}

html[data-theme="dark"] .author-ban-tip {
    color: #ff8d8d;
}

.author-home-meta li.author-home-other {
    align-items: center;
    padding: 4px 0;
}

.author-home-meta .author-other-pills {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.author-home-meta .author-donate-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 24px;
    padding: 0 10px 0 4px;
    border: 1px solid #e6b422;
    border-radius: 6px;
    background: var(--fm-tint-gold);
    font-size: 11px;
    font-weight: 400;
    color: #8a6100;
}

.author-home-meta .author-donate-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 3px;
    border-radius: 50%;
    background: #f0a500;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
}

.author-home-meta .author-donate-pill.rank-pink {
    border-color: #f48fb1;
    background: var(--fm-tint-red);
    color: #b02a6b;
}

.author-home-meta .author-donate-pill.rank-pink .author-donate-rank {
    background: #e83e8c;
}

.author-home-meta .author-donate-pill.rank-orange {
    border-color: #f5b56b;
    background: var(--fm-tint-gold);
    color: #a04a00;
}

.author-home-meta .author-donate-pill.rank-orange .author-donate-rank {
    background: #fd7e14;
}

.author-home-meta .author-donate-pill.rank-gray {
    border-color: var(--fm-border);
    background: var(--fm-soft);
    color: var(--fm-text-sub);
}

.author-home-meta .author-donate-pill.rank-gray .author-donate-rank {
    background: #b8b3a2;
}

.author-home-box.is-electric {
    position: relative;
    overflow: visible;
    border-color: transparent; 
    --electric-border-color: #dd8448;
    --electric-light-color: #fcead9;
}

.author-home-box.is-electric .author-cover {
    border-radius: 10px 10px 0 0;
}

.author-home-box.is-electric .eb-layer {
    position: absolute;
    inset: -2px;
    z-index: 2;
    pointer-events: none;
}

.author-home-box.is-electric .eb-main-card-effect {
    position: absolute;
    inset: 0;
    border: 2px solid var(--electric-border-color);
    border-radius: 12px;
    filter: url(#authorHomeBoxTurbulence);
}

.author-home-box.is-electric .eb-glow-1 {
    position: absolute;
    inset: 2px;
    border: 2px solid rgba(221, 132, 72, .6);
    border-radius: 10px;
    filter: blur(1px);
}

.author-home-box.is-electric .eb-glow-2 {
    position: absolute;
    inset: 0;
    border: 2px solid var(--electric-border-color);
    border-radius: 12px;
    filter: blur(4px);
    opacity: .8;
}

.eb-filter-defs {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
}

.author-home-meta .author-vip-pill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 24px;
    padding: 0 10px 0 4px;
    border: 1px solid #d83ee8;
    border-radius: 6px;
    background: #e8c9ea;
    font-size: 11px;
    font-weight: 400;
    color: #6f42c1;
}

.author-home-meta .author-vip-rank {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 3px;
    border-radius: 999px;
    background: linear-gradient(135deg, #e750dc, #c93fe0);
    color: #fff;
    font-size: 11px;
    font-style: normal;
    font-weight: 400;
}

.author-vip-text {
    font-weight: 400;
    white-space: nowrap;
}

.remark-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(40, 36, 26, .45);
}

.remark-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.remark-modal-box {
    position: relative;
    z-index: 1;
    width: min(360px, 100%);
    padding: 20px;
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 18px 40px rgba(50, 44, 30, .28);
}

.remark-modal-title {
    margin-bottom: 12px;
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.remark-modal-input {
    width: 100%;
    height: 40px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    font-size: 14px;
    color: var(--fm-text);
}

.remark-modal-input:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.remark-modal-tip {
    margin-top: 8px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.remark-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 16px;
}

.remark-modal-btn {
    height: 34px;
    padding: 0 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
}

.remark-modal-btn.primary {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.msg-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.msg-modal[hidden] {
    display: none;
}

.msg-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(40, 36, 26, .45);
}

.msg-modal-box {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    width: min(560px, 100%);
    height: min(620px, 84vh);
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 18px 40px rgba(50, 44, 30, .28);
    overflow: hidden;
}

.msg-modal-head {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 16px;
    border-bottom: 1px solid var(--fm-line);
}

.msg-modal-title {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.msg-modal-follow {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
}

.msg-modal-close {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 0.25rem;
    background: transparent;
    font-size: 15px;
    color: var(--fm-text-sub);
    cursor: pointer;
    transition: background-color .15s, color .15s;
}

.msg-modal-close:hover {
    background: var(--fm-bg);
    color: var(--fm-primary);
}

.msg-modal .msg-wrap {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    border-radius: 0;
}

.msg-modal .msg-main {
    flex: 1 1 auto;
    min-height: 0;
}

@media (max-width: 640px) {

    .author-home {
        padding: 16px 14px;
    }

    .author-home-box {
        padding: 12px 12px 6px;
    }

    .author-cover {
        height: 104px;
        margin: -12px -12px 0;
    }

    .author-home-head {
        flex-wrap: wrap;
        gap: 12px;
        padding: 10px 0 10px 20px;
    }

    .author-home-avatar {
        width: 56px;
        height: 56px;
        margin-top: -28px;
    }

    .author-home-name {
        font-size: 17px;
        gap: 6px;
    }

    .author-home-ops .follow-btn,
    .author-home-ops .author-remark-btn {
        font-size: 11.5px;
    }

    .author-home-sub {
        margin-top: 7px;
        gap: 7px;
        font-size: 12.5px;
    }

    .author-home-sub .author-home-uid,
    .author-home-sub .lv-badge,
    .author-home-sub .fm-tag {
        padding: 0.28em 0.42em;
        font-size: 11.5px;
    }

    .author-home-stats {
        gap: 14px 18px;
        padding: 8px 2px 12px 20px;
    }

    .author-home-stats li {
        font-size: 13.5px;
    }

    .author-home-stats b {
        font-size: 16px;
    }

    .author-home-meta {
        padding: 0 2px 10px 20px;
    }

    .author-home-meta li {
        gap: 7px;
        font-size: 14px;
    }

    .author-home-meta li.is-inline {
        flex-wrap: nowrap;
        justify-content: space-between;
        gap: 4px;
        font-size: 12.5px;
    }

    .author-home-meta li.is-inline > span,
    .author-home-meta li.is-inline > b {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .author-home-meta li.is-inline > b {
        margin-right: 0;
    }

    .author-home-meta .author-vip-pill,
    .author-home-meta .author-donate-pill {
        font-size: 11.5px;
    }
}

.msg-panel {
    padding: 0;
    border-radius: 0.25rem;
}

.msg-wrap {
    display: flex;
    flex-direction: column;
    height: 580px;
    background: var(--fm-card);
    border-radius: 0.25rem;
    overflow: hidden;
}

.msg-top {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 14px;
    height: 48px;
    padding: 0 16px;
    border-bottom: 1px solid var(--fm-border);
}

.msg-top-stat {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--fm-text-sub);
    font-size: 12px;
}

.msg-top-stat b {
    padding: 0 2px;
    color: #d9534f;
}

.msg-top-readall {
    flex: 0 0 auto;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.msg-top-readall:hover {
    color: var(--fm-primary);
}

.msg-top-name,
.msg-chat-back {
    display: none;
}

.msg-body {
    flex: 1 1 auto;
    display: flex;
    min-height: 0;
}

.msg-convs {
    flex: 0 0 248px;
    min-width: 0;
    overflow-y: auto;
    border-right: 1px solid var(--fm-border);
}

.msg-conv {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--fm-line);
}

.msg-conv:hover {
    background: var(--fm-soft);
}

.msg-conv.active {
    background: var(--fm-tint-green);
}

.msg-conv-avatar,
.msg-line-avatar {
    flex: 0 0 auto;
    display: inline-flex;
}

.msg-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
}

span.msg-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 15px;
}

.msg-line-avatar .msg-avatar {
    width: 32px;
    height: 32px;

    border-radius: 50%;
}

.msg-conv-body {
    flex: 1 1 auto;
    min-width: 0;
}

.msg-conv-name {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.msg-conv-official {
    align-items: flex-start;
}

.msg-conv-official .msg-conv-avatar {
    align-self: center;
}

.msg-conv-official .msg-conv-name {
    color: #d9534f;
    font-weight: 700;
    line-height: 19px;
}

.msg-conv-official .msg-conv-time {
    line-height: 19px;
}

.msg-conv-mute {
    color: var(--fm-muted);
    font-size: 12px;
}

.msg-conv-last {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.msg-conv-meta {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.msg-conv-time {
    font-size: 11px;
    font-style: normal;
    color: var(--fm-muted);
}

.msg-unread {
    min-width: 16px;
    height: 16px;
    padding: 0 5px;
    border-radius: 0.25rem;
    background: #d9534f;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    line-height: 16px;
    text-align: center;
}

.msg-boxes {
    flex: 0 0 150px;
    min-width: 0;
    padding: 8px 0;
    overflow-y: auto;
    border-right: 1px solid var(--fm-border);
}

.msg-box {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 48px;
    padding: 0 12px;
    color: var(--fm-text);
    font-size: 13px;
    white-space: nowrap;
}

.msg-box:hover {
    background: var(--fm-soft);
}

.msg-box.active {
    background: var(--fm-tint-green);
    color: var(--fm-primary);
    font-weight: 600;
}

.msg-box.active::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 3px;
    background: var(--fm-primary);
}

.msg-box-ic {
    flex: 0 0 auto;
    display: inline-flex;
    color: var(--fm-muted);
}

.msg-box.active .msg-box-ic {
    color: var(--fm-primary);
}

.msg-box-ic svg {
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.6;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.msg-box .msg-unread {
    margin-left: auto;
    min-width: 16px;
    height: 16px;
    padding: 0 5px;
    border-radius: 0.25rem;
    background: #d9534f;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    line-height: 16px;
    text-align: center;
}

.notice-list {
    padding: 0;
    background: var(--fm-card);
}

.notice-item {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 20px;
    border-bottom: 1px solid var(--fm-line);
}

.notice-item:hover {
    background: var(--fm-soft);
}

.notice-avatar {
    flex: 0 0 auto;
    display: inline-flex;
}

.msg-sys-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--fm-tint-green);
}

.msg-sys-avatar svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--fm-primary);
    stroke-width: 1.6;
    stroke-linejoin: round;
}

.notice-main {
    flex: 1 1 auto;
    min-width: 0;
}

.notice-head {
    display: flex;
    align-items: center;
    gap: 8px;
}

.notice-name {
    color: var(--fm-text-sub);
    font-size: 12px;
    font-weight: 600;
}

.notice-item.unread .notice-name {
    color: var(--fm-primary);
}

.notice-time {
    color: var(--fm-muted);
    font-size: 11px;
    font-style: normal;
}

.notice-dot {
    width: 8px;
    height: 8px;
    margin-left: 2px;
    border-radius: 50%;
    background: #d9534f;
}

.notice-desc {
    display: flex;
    align-items: flex-start;
    gap: 6px;
    margin-top: 8px;
    color: var(--fm-text);
    font-size: 13px;
    line-height: 1.7;
}

.notice-desc em {
    font-style: normal;
    word-break: break-word;
}

.notice-ic {
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    margin-top: 3px;
    fill: none;
    stroke: var(--fm-primary);
    stroke-width: 1.7;
    stroke-linejoin: round;
}

.notice-quote,
.notice-text {
    display: block;
    margin-top: 8px;
    padding: 8px 12px;
    border-radius: 0.25rem;
    font-style: normal;
    font-size: 12px;
    line-height: 1.7;
    word-break: break-word;
}

.notice-quote {
    border: 1px solid #eeece2;
    background: var(--fm-card);
    color: var(--fm-text-sub);
}

.notice-text {
    background: var(--fm-soft);
    color: var(--fm-text);
}

.msg-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.msg-chat-head {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 12px;
    height: 64px;
    padding: 0 20px;
    border-bottom: 1px solid var(--fm-border);
}

.msg-chat-user {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    color: var(--fm-text);
    font-size: 16px;
    font-weight: 700;
}

.msg-chat-user b {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.msg-chat-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 16px;

    background: var(--fm-card);
}

.msg-day {
    margin: 10px 0 14px;
    text-align: center;
}

.msg-day span {
    display: inline-block;
    padding: 2px 10px;
    border-radius: 0.25rem;
    background: var(--fm-soft-2);
    color: var(--fm-text-sub);
    font-size: 12px;
}

.msg-line {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 14px;
}

.msg-line.mine {
    flex-direction: row-reverse;
}

.msg-line-main {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    max-width: 70%;
    min-width: 0;
}

.msg-line.mine .msg-line-main {
    align-items: flex-end;
}

.msg-bubble {
    position: relative;
    display: inline-block;
    padding: 9px 13px;
    border: 0;
    border-radius: 5px;
    background: var(--fm-soft);
    color: var(--fm-text);
    font-size: 13px;
    line-height: 1.7;
    word-break: break-word;
    white-space: normal;
}

.msg-bubble::after {
    content: '';
    position: absolute;
    top: 16px;
    left: -5px;
    width: 0;
    height: 0;
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
    border-right: 6px solid var(--fm-soft);
}

.msg-img {
    display: block;
    max-width: 100%;
    max-height: 260px;
    border-radius: 0.25rem;
    cursor: zoom-in;
}

.msg-img-broken {
    width: 66px;
    height: 60px;
}

.msg-line.mine .msg-bubble {
    background: #95ec69;
    border-color: transparent;
    color: var(--fm-text);
}

.msg-line.mine .msg-bubble::after {
    right: -5px;
    left: auto;
    border-right: 0;
    border-left: 6px solid #95ec69;
}

.msg-bubble.img-only,
.msg-line.mine .msg-bubble.img-only {
    padding: 0;
    border-color: transparent;
    background: none;
}

.msg-bubble.img-only::after {
    display: none;
}

.msg-voice {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    max-width: 100%;
    height: 22px;
    color: var(--fm-text);
    cursor: pointer;
    -webkit-user-select: none;
    user-select: none;
}

.msg-line.mine .msg-voice {
    flex-direction: row-reverse;
}

.msg-voice-ic {
    font-size: 15px;
}

.msg-voice-sec {
    font-size: 12px;
    font-style: normal;
    color: var(--fm-text-sub);
}

.msg-voice.playing .msg-voice-ic {
    animation: msgVoiceBlink 0.9s ease-in-out infinite;
}

@keyframes msgVoiceBlink {
    0%, 100% { opacity: 0.35; }
    50% { opacity: 1; }
}

.msg-rec-tip {
    position: fixed;
    left: 50%;
    top: 50%;
    z-index: 2200;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: 150px;
    padding: 18px 12px;
    border-radius: 12px;
    background: rgba(38, 38, 34, .82);
    color: #fff;
    font-size: 13px;
    text-align: center;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.msg-rec-tip.is-cancel {
    background: rgba(160, 42, 42, .88);
}

.msg-rec-waves {
    display: flex;
    align-items: center;
    gap: 3px;
    height: 22px;
}

.msg-rec-waves i {
    display: block;
    width: 3px;
    height: 6px;
    border-radius: 2px;
    background: var(--fm-card);
    animation: msgRecWave 0.9s ease-in-out infinite;
}

.msg-rec-waves i:nth-child(2) { animation-delay: .12s; }
.msg-rec-waves i:nth-child(3) { animation-delay: .24s; }
.msg-rec-waves i:nth-child(4) { animation-delay: .36s; }
.msg-rec-waves i:nth-child(5) { animation-delay: .48s; }

@keyframes msgRecWave {
    0%, 100% { height: 6px; }
    50% { height: 22px; }
}

#msg-voice-btn {
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
}

.msg-line-time {
    margin-top: 4px;
    font-size: 11px;
    font-style: normal;
    color: var(--fm-muted);
}

.msg-line.mine .msg-read-state {
    margin-top: 4px;
    margin-left: 6px;
    font-size: 11px;
    font-style: normal;
}

.msg-line.mine .msg-read-state.is-unread {
    color: #e6a23c;
}

.msg-line.mine .msg-read-state.is-read {
    color: var(--fm-muted);
}

.msg-line-ops {
    position: relative;
    flex: 0 0 auto;
    align-self: flex-start;
    margin-top: 6px;
}

.msg-manage {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    color: #b6b2a3;
    font-size: 13px;
    opacity: 0;
    transition: opacity 0.15s ease;
}

.msg-line:hover .msg-manage,
.msg-manage:focus {
    opacity: 1;
}

@media (hover: none) {
    .msg-manage {
        opacity: 1;
    }
}

.msg-manage:hover {
    background: var(--fm-soft);
    color: #6b6a60;
}

.msg-manage-menu {
    position: absolute;
    top: 26px;
    left: 0;
    z-index: 6;
    display: flex;
    flex-direction: column;
    min-width: 72px;
    padding: 4px 0;
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    background: var(--fm-card);
    box-shadow: 0 8px 20px rgba(0, 0, 0, .12);
}

.msg-line.mine .msg-manage-menu {
    right: 0;
    left: auto;
}

.msg-manage-menu a {
    padding: 6px 14px;
    color: var(--fm-text);
    font-size: 12px;
    white-space: nowrap;
}

.msg-manage-menu a:hover {
    background: var(--fm-soft);
}

.msg-manage-menu a[data-do="delete"] {
    color: #d9534f;
}

.msg-bubble.is-revoked,
.msg-line.mine .msg-bubble.is-revoked {
    background: var(--fm-soft-2);
    color: var(--fm-muted);
    font-size: 12px;
}

.msg-bubble.is-revoked::after {
    display: none;
}

.msg-chat-group .msg-line-name {
    display: block;
    margin: 0 0 2px 2px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    color: var(--fm-muted);
}

.msg-chat-group .msg-line:not(.mine) .msg-line-avatar {
    margin-top: 18px;
}

.msg-chat-group .msg-line-name .msg-line-time {
    margin: 0 0 0 6px;
    color: var(--fm-muted);
}

.msg-empty,
.msg-chat-empty,
.msg-empty-main {
    padding: 30px 16px;
    text-align: center;
    color: var(--fm-muted);
    font-size: 13px;
    line-height: 2;
}

.msg-chat-empty,
.msg-empty-main {
    padding: 60px 16px;
}

.msg-empty em {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
}

.msg-chat-foot {
    flex: 0 0 auto;
    padding: 12px 16px 14px;
    border-top: 1px solid var(--fm-border);
    background: var(--fm-card);
}

.msg-rule-link {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.msg-rule-link:hover {
    color: var(--fm-primary);
}

.msg-rule-mask {
    position: fixed;
    inset: 0;
    z-index: 1100;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(38, 36, 28, .45);
}

.msg-rule-mask.show {
    display: flex;
}

.msg-rule-modal {
    position: relative;
    width: 100%;
    max-width: 620px;
    max-height: 88vh;
    overflow-y: auto;
    padding: 22px 24px 20px;
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 18px 50px rgba(60, 54, 40, .28);
    scrollbar-width: thin;
    scrollbar-color: var(--fm-border) transparent;
}

.msg-rule-modal::-webkit-scrollbar {
    width: 6px;
}

.msg-rule-modal::-webkit-scrollbar-thumb {
    border-radius: 0.25rem;
    background: var(--fm-soft-2);
}

.msg-rule-modal::-webkit-scrollbar-track {
    background: transparent;
}

.msg-rule-close {
    position: absolute;
    top: 10px;
    right: 14px;
    font-size: 22px;
    line-height: 1;
    color: var(--fm-muted);
}

.msg-rule-close:hover {
    color: var(--fm-primary);
}

.msg-rule-head {
    text-align: center;
}

.msg-rule-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin-bottom: 8px;
    border-radius: 50%;
    background: var(--fm-tint-green);
    color: var(--fm-primary);
}

.msg-rule-ic svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.msg-rule-title {
    display: block;
    font-size: 16px;
    color: var(--fm-text);
}

.msg-rule-intro {
    margin: 8px 0 0;
    color: var(--fm-muted);
    font-size: 12px;
    line-height: 1.7;
    text-align: center;
}

.msg-rule-table {
    width: 100%;
    margin-top: 12px;
    border-collapse: collapse;
    font-size: 12px;
}

.msg-rule-table th {
    width: 86px;
    padding: 9px 11px;
    border: 1px solid var(--fm-line);
    background: var(--fm-soft);
    color: var(--fm-text);
    font-weight: 600;
    text-align: left;
    vertical-align: top;
}

.msg-rule-table td {
    padding: 9px 11px;
    border: 1px solid #f2f0e8;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.msg-rule-note {
    margin: 10px 0 0;
    color: #b0ac9c;
    font-size: 12px;
    line-height: 1.7;
}

.msg-rule-warn {
    margin: 10px 0 0;
    color: #d9534f;
    font-size: 12px;
    line-height: 1.7;
}

body.msg-rule-open {
    overflow: hidden;
}

.msg-input {
    display: block;
    width: 100%;
    min-height: 76px;
    max-height: 140px;
    padding: 12px 12px 22px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    color: var(--fm-text);
    font-size: 13px;
    line-height: 1.7;
    resize: vertical;
    box-sizing: border-box;
}

.msg-input:focus {
    outline: none;
    border-color: var(--fm-primary);
    background: var(--fm-card);
}

.msg-input-wrap {
    position: relative;
}

.msg-input-wrap .msg-chat-tip {
    position: absolute;
    right: 12px;
    bottom: 7px;
    font-size: 11px;
    color: #c9c5b5;
    pointer-events: none;
}

.msg-input:not(:placeholder-shown)+.msg-chat-tip {
    display: none;
}

.msg-quota-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 7px;
    min-height: 18px;
}

.msg-quota-tip {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
    color: var(--fm-muted);
}

.msg-quota-tip[data-state="cost"] {
    color: #c98a2e;
}

.msg-quota-tip[data-state="limit"] {
    color: #d9534f;
}

.msg-chat-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 8px;
}

.msg-chat-tip {
    font-size: 12px;
    color: var(--fm-muted);
}

.msg-chat-tools {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.msg-tool {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    color: var(--fm-text-sub);
    font-size: 13px;
}

.msg-tool:hover {
    color: var(--fm-primary);
}

.msg-tool svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.msg-mail {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--fm-text-sub);
    font-size: 13px;
    cursor: pointer;
}

.msg-mail input {
    margin: 0;
    cursor: pointer;
}

.msg-mail-cost {
    white-space: nowrap;
}

.msg-chat-actions {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

.msg-send {
    height: 36px;
    min-width: 96px;
    padding: 0 22px;
    font-size: 13px;
}

.msg-ban-tip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: #d9534f;
    font-size: 12px;
}

.msg-chat-head .msg-ban-tip {
    margin-left: auto;
}

.msg-chat-foot.is-locked .msg-input:disabled {
    background: var(--fm-soft);
    color: var(--fm-muted);
    cursor: not-allowed;
}

.msg-chat-foot.is-locked .msg-chat-tip {
    display: none;
}

.msg-chat-foot.is-locked .msg-tool,
.msg-chat-foot.is-locked .msg-mail {
    opacity: .5;
    pointer-events: none;
}

@media (max-width: 768px) {

    .uc-main-msg {
        padding: 0;
    }

    .uc-main-msg .uc-layout {
        gap: 0;
    }

    .uc-main-msg .uc-side {
        display: none;
    }

    .uc-main-msg .uc-content {
        border: 0;
        border-radius: 0;
        background: transparent;
    }

    .uc-main-msg .uc-panel {
        margin: 0;
        padding: 0;
    }

    .uc-main-msg {
        display: flex;
        flex-direction: column;
    }

    .uc-main-msg .uc-layout,
    .uc-main-msg .uc-content,
    .uc-main-msg .uc-panel {
        display: flex;
        flex-direction: column;
        flex: 1 1 auto;
        min-height: 0;
    }

    .uc-main-msg .msg-wrap {
        flex: 1 1 auto;
        min-height: 0;
        border-radius: 0;
    }

    body:has(.uc-main-msg) .forum-footer {
        display: none;
    }

    body:has(.uc-main-msg) {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;

        min-height: 0;
        height: auto;
        overflow: hidden;
    }

    body:has(.uc-main-msg) .forum-main {
        min-height: 0;
    }

    .msg-wrap {
        flex-direction: column;
        height: auto;
    }

    .msg-main {
        height: 60vh;
    }

    .msg-body {
        flex-direction: column;

        padding-bottom: 70px;
        padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px));
        overflow-y: auto;     
    }

    .msg-top {
        position: relative;
        justify-content: center;
        padding: 0 14px;
    }

    .msg-top-name {
        display: block;
        font-size: 15px;
        font-weight: 600;
        color: var(--fm-text-strong);
    }

    .msg-top-stat {
        display: none;
    }

    .msg-top-readall {
        position: absolute;
        right: 14px;
        top: 50%;
        transform: translateY(-50%);
    }

    .msg-convs {
        flex: 1 1 auto;
        width: 100%;
        border-right: 0;
    }

    .msg-conv {
        gap: 10px;
        padding: 11px 16px;
    }

    .msg-conv .msg-avatar {
        width: 42px;
        height: 42px;
        font-size: 16px;
    }

    .msg-conv-name {
        font-size: 14px;
    }

    .msg-conv-last {
        display: block;
        margin-top: 3px;
        font-size: 12.5px;
    }

    .msg-boxes {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 60;
        display: flex;
        padding: 0;
        padding-bottom: env(safe-area-inset-bottom, 0px);
        border-right: 0;
        border-top: 1px solid var(--fm-border);
        background: var(--fm-card);
    }

    .msg-box {
        position: relative;
        flex: 1 1 0;
        height: 54px;
        flex-direction: column;
        justify-content: center;
        gap: 3px;
        padding: 0;
        font-size: 11.5px;
    }

    .msg-box.active {
        background: transparent;
    }

    .msg-box.active::before {
        display: none;
    }

    .msg-box-ic {
        font-size: 18px;
    }

    .msg-box .msg-unread {
        position: absolute;
        top: 5px;
        left: 50%;
        margin: 0 0 0 8px;
    }

    .msg-wrap[data-box="private"]:not(.is-chat) .msg-main {
        display: none;
    }

    .msg-wrap.is-chat .msg-convs,
    .msg-wrap.is-chat .msg-boxes {
        display: none;
    }

    .msg-wrap.is-chat .msg-body {
        padding-bottom: 0;
    }

    .msg-wrap.is-chat .msg-main {
        flex: 1 1 auto;
        height: auto;
        min-height: 0;
    }

    .msg-wrap[data-box="group"] .msg-main {
        flex: 1 1 auto;
        height: auto;
        min-height: 0;
    }

    .msg-chat-back {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 auto;
        width: 30px;
        height: 30px;
        margin-left: -8px;
        border-radius: 50%;
        color: var(--fm-text);
        font-size: 15px;
    }

    .msg-chat-back:hover {
        background: var(--fm-soft);
    }

    .msg-chat-body.notice-list {
        padding: 0;
        background: var(--fm-card);
    }

    .notice-item {
        gap: 10px;
        padding: 12px 16px;
    }

    .notice-avatar .msg-avatar {
        width: 34px;
        height: 34px;
        border-radius: 4px;
        font-size: 13px;
    }

    .notice-name {
        color: var(--fm-text);
        font-size: 12.5px;
    }

    .notice-item.unread .notice-name {
        color: var(--fm-text-strong);
    }

    .notice-ic {
        display: none;
    }

    .notice-desc {
        margin-top: 6px;
        font-size: 13px;
        line-height: 1.6;
    }

    .notice-quote,
    .notice-text {
        margin-top: 8px;
        padding: 9px 12px;
        border: 0;
        border-radius: 4px;
        background: var(--fm-soft-2);
        color: var(--fm-text);
        font-size: 12.5px;
    }

    .msg-wrap[data-box="mention"] .notice-text,
    .msg-wrap[data-box="system"] .notice-text {
        margin-top: 4px;
        padding: 0;
        background: transparent;
    }

    .msg-modal {
        padding: 12px;
    }

    .msg-chat-foot {
        padding: 10px 12px 12px;
    }

    .msg-input-wrap .msg-chat-tip {
        display: none;
    }

    .msg-chat-bar {
        flex-wrap: nowrap;
        gap: 10px;
    }

    .msg-chat-tools {
        flex: 1 1 auto;
        min-width: 0;
        flex-wrap: nowrap;
        gap: 12px;
    }

    .msg-tool {
        padding: 6px 2px;
        font-size: 0;
    }

    .msg-tool i {
        font-size: 17px;
    }

    .msg-tool svg {
        width: 17px;
        height: 17px;
    }

    .msg-mail {
        flex: 0 1 auto;
        min-width: 0;
        font-size: 12px;
    }

    .msg-chat-actions {
        flex: 0 0 auto;
    }

    .msg-send {
        width: auto;
        min-width: 68px;
        height: 34px;
        padding: 0 16px;
        font-size: 13px;
    }
}

.uc-verify-list th:first-child,
.uc-verify-list td:first-child,
.uc-verify-list th:nth-child(2),
.uc-verify-list td:nth-child(2) {
    text-align: center;
}

.uc-verify-list {
    border: 1px solid var(--fm-border);
}
.uc-verify-list th,
.uc-verify-list td {
    border: 1px solid var(--fm-border);
}

.uc-select {
    padding: 0 34px 0 14px;
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%238b8879' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 12px;
    cursor: pointer;
}

.uc-verify-user {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.uc-verify-list-name {
    color: #c0392b;
    font-weight: 700;
    font-style: normal;
}

.uc-pager {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding-top: 16px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.uc-pager a {
    padding: 6px 14px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
    color: var(--fm-text);
}

.uc-pager a:hover {
    color: var(--fm-primary);
}

@media (max-width: 768px) {
    .uc-layout {
        flex-direction: column;

        align-items: stretch;
    }

    .uc-side {
        position: static;
        width: 100%;
        flex-basis: auto;
    }

    .uc-menu {
        display: flex;
        flex-wrap: wrap;
    }

    .uc-menu a {
        flex: 1 1 auto;
        text-align: center;
        border-bottom: 0;
        padding: 12px 10px;
    }

    .uc-menu a.uc-menu-msg {
        display: none;
    }

    .uc-panel {
        padding: 18px 14px;
    }

    .uc-profile-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
        grid-auto-flow: row;
        column-gap: 14px;
        row-gap: 10px;
        font-size: 13px;
    }

    .uc-profile-grid li>span:first-child {
        flex: 0 0 auto;
        min-width: 5em;
    }

    .uc-profile-grid li.uc-pg-wide {
        grid-column: 1 / -1;
    }

    .uc-profile-desc {
        max-width: 100%;
        white-space: normal;
        overflow: visible;
        text-overflow: clip;
        overflow-wrap: break-word;
    }

    .uc-profile-mail {
        word-break: break-all;
    }

    .pwd-actions {
        flex-direction: column;
        align-items: stretch;
    }

    .pwd-actions .uc-btn {
        width: 100%;
    }

    .pwd-forgot {
        text-align: right;
    }

    .login-log-list li {
        align-items: flex-start;
        gap: 10px;
        padding: 11px 12px;
    }

    .login-log-main b {
        white-space: normal;
        overflow-wrap: break-word;
    }

    .coins-summary {
        grid-template-columns: 1fr;
    }

    .coins-stat-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .coins-card-bg {
        font-size: 46px;
        bottom: -8px;
    }

    .coins-today-card .coins-card-bg {
        font-size: 52px;
    }

    .coins-balance-icon {
        width: 46px;
        height: 46px;
        border-radius: 14px;
    }

    .coins-balance-icon svg {
        width: 26px;
        height: 26px;
    }

    .coins-balance-info b {
        font-size: 28px;
    }

    .coins-rules {
        grid-template-columns: 1fr;
        row-gap: 20px;
    }

    .uc-tabs {
        flex-wrap: nowrap;
        gap: 2px;
        padding: 8px 6px 0;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .uc-tabs::-webkit-scrollbar {
        display: none;
    }

    .uc-tabs a,
    .uc-tabs>span {
        flex: 0 0 auto;
        padding: 9px 5px;
        font-size: 12.5px;
    }

    .uc-email-card {
        padding-right: 18px;
    }

    .uc-email-toggle {
        position: static;
        margin-top: 12px;
        transform: none;
    }
}

.ban-main {
    padding-top: 16px;
}

.ban-panel {
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 2px 10px rgba(90, 82, 60, .06);
    overflow: hidden;
    transition: opacity .2s ease;
}

.ban-panel.is-loading {
    opacity: .45;
    pointer-events: none;
}

.ban-tabs {
    display: flex;
    gap: 4px;
    padding: 8px 14px 0;
    background: var(--fm-soft-2);
}

.ban-tabs a {
    padding: 9px 16px;
    border-radius: 6px 6px 0 0;
    color: #3f4a55;
    font-size: 14px;
    transition: background-color .15s, color .15s;
}

.ban-tabs a:hover {
    color: var(--fm-primary);
}

.ban-tabs a.active {
    background: var(--fm-card);
    color: var(--fm-primary);
    font-weight: 600;
}

.ban-body {
    padding: 16px;
    background: var(--fm-card);
}

.ban-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

.ban-card {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    overflow: hidden;
    transition: box-shadow .2s;
}

.ban-card:hover {
    box-shadow: 0 6px 18px rgba(90, 82, 60, .1);
}

.ban-card-top {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 14px 12px;
}

.ban-avatar {
    position: relative;
    flex: 0 0 auto;
    display: inline-flex;
}

.ban-avatar .msg-avatar {
    width: 54px;
    height: 54px;
    border: 1px solid #f0eee6;
    border-radius: 50%;
    object-fit: cover;
}

.ban-avatar .forum-letter-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 50%;
    color: #fff;
    font-size: 20px;
}

.ban-seal {
    position: absolute;
    top: -3px;
    right: -3px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 21px;
    height: 21px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: #d9534f;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    box-shadow: 0 2px 6px rgba(217, 83, 79, .35);
}

.ban-info {
    flex: 1 1 auto;
    min-width: 0;
}

.ban-name-line {
    display: block;
    margin-bottom: 5px;
}

.ban-name {
    color: var(--fm-text);
    font-size: 14px;
    font-weight: 600;
    word-break: break-all;
}

.ban-name:hover {
    color: var(--fm-primary);
}

.ban-uid {
    color: var(--fm-muted);
    font-size: 12px;
    font-style: normal;
}

.ban-time {
    display: block;
    margin-top: 2px;
    color: var(--fm-muted);
    font-size: 12px;
    font-style: normal;
}

.ban-reason {
    display: flex;
    align-items: flex-start;
    gap: 7px;
    margin-top: auto;
    padding: 10px 14px;
    border-top: 1px solid #f2f0e8;
    background: var(--fm-soft-2);
    color: var(--fm-primary);
    font-size: 12px;
    line-height: 1.7;
    text-align: left;
    word-break: break-all;
}

.ban-reason i {
    flex: 0 0 auto;
    margin-top: 2px;
    font-size: 12px;
    opacity: .85;
}

.ban-empty {
    padding: 60px 20px;
    background: transparent;
    color: var(--fm-muted);
    font-size: 14px;
    text-align: center;
}

.hall-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin: 2px 0 16px;
}

.hall-title {
    display: flex;
    align-items: baseline;
    gap: 10px;
    margin: 0;
    font-size: 22px;
    font-weight: 600;
    color: var(--fm-text);
}

.hall-title em {
    font-style: normal;
    font-size: 12px;
    letter-spacing: 1px;
    color: var(--fm-muted);
}

.hall-total {
    font-size: 12px;
    color: var(--fm-muted);
}

.hall-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.hall-card {
    position: relative;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    overflow: hidden;
    perspective: 1200px;
    cursor: pointer;
}

.hall-flip {
    position: relative;
    transform-style: preserve-3d;
    transition: transform .55s cubic-bezier(.4, .15, .2, 1);
}

.hall-card.flipped .hall-flip {
    transform: rotateY(180deg);
}

.hall-flip-front {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.hall-cover {
    position: relative;
    height: 190px;
    overflow: hidden;
    background: linear-gradient(160deg, #f5f3ec, #e9e6da);
}

.hall-cover .hall-avatar {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hall-cover.is-default {
    display: flex;
    align-items: center;
    justify-content: center;
}

.hall-cover.is-default .hall-avatar {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    border: 3px solid rgba(255, 255, 255, .85);
    object-fit: cover;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .08);
}

.hall-num {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2;
    padding: 0 5px;
    border: 1px solid rgba(255, 255, 255, .65);
    border-radius: 3px;
    background: rgba(0, 0, 0, .12);
    color: #fff;
    font-size: 12px;
    line-height: 16px;
    letter-spacing: .5px;
    pointer-events: none;
}

.hall-body {
    padding: 14px 16px 12px;
}

.hall-name {
    display: block;
    margin: 0;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--fm-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hall-reason {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden;
    min-height: 66px;
    margin: 8px 0 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--fm-text-sub);
    word-break: break-word;
}

.hall-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
}

.hall-uid {
    margin-right: auto;
    font-size: 12px;
    color: var(--fm-muted);
}

.hall-poor {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 0 8px;
    border: 1px solid #f0b27a;
    border-radius: 3px;
    background: var(--fm-card);
    color: #e08a34;
    font-size: 12px;
    line-height: 18px;
    cursor: pointer;
    transition: border-color .15s, background-color .15s, box-shadow .15s;
}

.hall-poor em {
    font-style: normal;
}

.hall-poor:hover {
    border-color: #e08a34;
    background: var(--fm-tint-gold);
    box-shadow: 0 0 0 2px rgba(224, 138, 52, .12);
}

.hall-poor.done {
    border-color: #e08a34;
    background: var(--fm-tint-gold);
    color: #c9761f;
}

.hall-detail-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    height: 26px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 13px;
    background: var(--fm-card);
    color: var(--fm-text-sub);
    font-size: 12px;
    cursor: pointer;
    transition: border-color .15s, color .15s, background-color .15s;
}

.hall-detail-btn:hover {
    border-color: var(--fm-primary);
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.hall-flip-back {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    padding: 16px 18px;
    border-radius: 0.25rem;
    background: #2f2b28;
    color: #fff;
    font-size: 13px;
    line-height: 1.8;
    text-align: left;
    overflow-y: auto;
    transform: rotateY(180deg);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.hall-flip-back b {
    flex: 0 0 auto;
    margin-bottom: 6px;
    font-size: 12px;
    font-weight: 600;
    color: rgba(255, 255, 255, .7);
}

.hall-flip-back p {
    margin: 0;
    word-break: break-word;
}

.hall-flip-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    align-self: flex-end;
    margin-top: auto;
    height: 28px;
    padding: 0 13px;
    border: 1px solid rgba(255, 255, 255, .35);
    border-radius: 14px;
    background: rgba(255, 255, 255, .08);
    color: #fff;
    font-size: 12px;
    cursor: pointer;
    transition: border-color .15s, background-color .15s;
}

.hall-flip-btn:hover {
    border-color: rgba(255, 255, 255, .7);
    background: rgba(255, 255, 255, .18);
}

.hall-flip-btn i {
    font-size: 12px;
}

@media (max-width: 980px) {
    .hall-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .hall-head {
        align-items: center;
    }

    .hall-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .hall-cover {
        height: 160px;
    }
}

@media (max-width: 980px) {
    .ban-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 640px) {
    .ban-grid {
        grid-template-columns: 1fr;
    }
}

.search-panel {
    background: var(--fm-card);
    border-radius: 0.25rem;
    padding: 18px 20px;
    margin-bottom: 18px;
}

.search-panel .search-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.search-panel .search-types {
    flex: 1 1 100%;
    margin-top: 2px;
}

.search-types {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 13px;
    color: var(--fm-text-sub);
    white-space: nowrap;
}

.search-types label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
}

.search-types input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    width: 15px;
    height: 15px;
    margin: 0;
    border: 1.5px solid #c8c4b6;
    border-radius: 50%;
    background: var(--fm-card);
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}

.search-types input[type="radio"]:checked {
    border-color: var(--fm-primary);
    box-shadow: inset 0 0 0 4px var(--fm-primary);
}

.search-drawer .search-form {
    flex-wrap: wrap;
}

.search-drawer .search-types {
    flex: 1 1 100%;
}

.search-result-panel {
    background: var(--fm-card);
    border-radius: 0.25rem;
    margin-bottom: 18px;
    overflow: hidden;
}

.search-result-head {
    padding: 13px 18px;
    border-bottom: 1px solid var(--fm-line);
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text);
}

.search-empty {
    padding: 46px 0;
    text-align: center;
    color: var(--fm-muted);
    font-size: 13px;
}

.search-reply-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.search-reply-item {
    display: flex;
    gap: 12px;
    padding: 16px 18px;
    border-bottom: 1px solid #f6f4ee;
}

.search-reply-item:last-child {
    border-bottom: 0;
}

.search-reply-ava {
    flex: 0 0 38px;
}

.search-reply-ava img {
    width: 38px;
    height: 38px;
    border-radius: 0.25rem;
}

.search-reply-body {
    flex: 1 1 auto;
    min-width: 0;
}

.search-reply-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.search-reply-name {
    font-weight: 600;
    color: var(--fm-text);
}

.search-reply-name:hover {
    color: var(--fm-primary);
}

.search-reply-uid {
    color: var(--fm-muted);
}

.search-reply-at {
    color: var(--fm-primary);
}

.search-reply-time {
    color: var(--fm-muted);
}

.search-reply-log {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 7px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.search-reply-log:hover {
    color: var(--fm-primary);
}

.search-reply-text {
    display: block;
    margin-top: 8px;
    font-size: 14px;
    line-height: 1.7;
    color: var(--fm-text);
    word-break: break-word;
}

.search-reply-text:hover {
    color: var(--fm-primary);
}

.search-user-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
    gap: 10px;
    padding: 16px;
    list-style: none;
    margin: 0;
}

.search-user-link {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 14px 6px;
    border-radius: 0.25rem;
}

.search-user-link:hover {
    background: var(--fm-soft);
}

.search-user-ava img,
.search-user-ava .forum-letter-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
}

.search-user-name {
    max-width: 100%;
    font-size: 12px;
    color: var(--fm-text);
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.uc-ext {
    display: flex;
    gap: 22px;
    align-items: flex-start;
}

.uc-ext-menu {
    flex: 0 0 168px;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.uc-ext-menu a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 10px 14px;
    border-radius: 0.25rem;
    font-size: 14px;
    color: var(--fm-text);
    transition: background-color .15s, color .15s;
}

.uc-ext-menu a i {
    width: 16px;
    text-align: center;
    font-size: 14px;
    color: var(--fm-muted);
}

.uc-ext-menu a:hover {
    background: var(--fm-bg);
    color: var(--fm-primary);
}

.uc-ext-menu a.active {
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-weight: 600;
}

.uc-ext-menu a.active i {
    color: var(--fm-primary);
}

.uc-ext-body {
    flex: 1 1 auto;
    min-width: 0;
}

.uc-ext-form {
    max-width: 100%;
}

.uc-ext-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.uc-ext-head>b {
    font-size: 16px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uc-ext-save {
    min-width: 76px;
    height: 38px;
}

.uc-ext-file {
    display: flex;
    align-items: center;
    gap: 8px;
    height: 42px;
    padding: 0 6px 0 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-bg);
}

.uc-ext-uploadfield .uc-ext-row {
    margin-bottom: 10px;
}

.uc-ext .uc-ext-upload {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    margin-bottom: 0;
    border-radius: 0.25rem;
    color: var(--fm-text-sub);
    cursor: pointer;
    transition: background-color .15s, color .15s;
}

.uc-ext .uc-ext-upload:hover {
    background: var(--fm-bg);
    color: var(--fm-primary);
}

.uc-ext-file-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    font-size: 13px;
    color: var(--fm-text);
}

.uc-ext-file-name.is-empty {
    color: var(--fm-muted);
}

.uc-ext-reset {
    flex: 0 0 auto;
    height: 30px;
    padding: 0 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text-sub);
    cursor: pointer;
    transition: border-color .15s, color .15s;
}

.uc-ext-reset:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.uc-ext-seg {
    display: inline-flex;
    gap: 8px;
}

.uc-ext .uc-ext-seg label {
    display: inline-flex;
    margin-bottom: 0;
}

.uc-ext-seg label input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.uc-ext-seg label span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 74px;
    height: 36px;
    padding: 0 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
    transition: all .15s;
}

.uc-ext-seg label input:checked+span {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.uc-ext-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.uc-ext-rowtext {
    min-width: 0;
}

.uc-ext .uc-ext-rowtext label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
}

.uc-ext-rowtext .uc-hint {
    margin-top: 0;
}

.uc-ext .uc-ext-switch {
    flex: 0 0 auto;
    position: relative;
    display: inline-block;
    width: 44px;
    height: 24px;
    margin-bottom: 0;
}

.uc-ext-switch input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.uc-ext-switch-ui {
    position: absolute;
    inset: 0;
    border-radius: 999px;
    background: var(--fm-soft-2);
    transition: background-color .2s;
}

.uc-ext-switch-ui::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--fm-card);
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
    transition: transform .2s;
}

.uc-ext-switch input:checked+.uc-ext-switch-ui {
    background: var(--fm-primary);
}

.uc-ext-switch input:checked+.uc-ext-switch-ui::before {
    transform: translateX(20px);
}

.uc-ext-box {
    position: relative;
    margin-top: 24px;
    padding: 24px 18px 18px;
    border: 2px dashed #b39ddb;
    border-radius: 0.25rem;
}

.uc-ext-box-title {
    position: absolute;
    top: -11px;
    left: 14px;
    margin: 0;
    padding: 0 8px;
    background: var(--fm-card);
    font-size: 13px;
    font-weight: 600;
    color: #7c5bd1;
}

.uc-ext-box .uc-field:last-child {
    margin-bottom: 0;
}

.uc-ext-vip-icon {
    width: 15px;
    height: 15px;
    margin-left: 3px;
    vertical-align: -3px;
    object-fit: contain;
}

.uc-ext-box.is-locked {
    border-color: #b39ddb;
}

.uc-ext-lock-tip {
    margin: -2px 0 12px;
    font-size: 13px;
    color: #d9534f;
}

.uc-field.is-locked .uc-ext-upload,
.uc-field.is-locked .uc-ext-reset,
.uc-field.is-locked .uc-ext-switch-ui,
.uc-field.is-locked .uc-ext-file-name {
    opacity: .55;
}

.uc-field.is-locked .uc-ext-upload,
.uc-field.is-locked .uc-ext-reset {
    cursor: not-allowed;
    pointer-events: none;
}

.tool-uid {
    margin-left: 4px;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    color: var(--fm-text-sub);
}

.uc-ext-blockhint {
    margin: 0 0 12px;
}

.uc-ext-inputgroup {
    display: flex;
    gap: 10px;
}

.uc-ext-inputgroup .uc-input {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}

.uc-ext-ok {
    flex: 0 0 auto;
    min-width: 72px;
    height: 42px;
    padding: 0 20px;
}

.uc-ext-blocklist {
    margin-top: 22px;
}

.uc-ext-blockhead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--fm-line);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.uc-ext-blockhead>b {
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uc-ext-blockitem {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 2px;
    border-bottom: 1px solid var(--fm-line);
}

.uc-ext-blockuser {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
}

.uc-ext-blockavatar,
.uc-ext-blockavatar img {
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    object-fit: cover;
}

.uc-ext-blockinfo {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.uc-ext-blockname {
    font-size: 14px;
    color: var(--fm-text-strong);
}

.uc-ext-blockuser:hover .uc-ext-blockname {
    color: var(--fm-primary);
}

.uc-ext-blockmeta {
    font-size: 12px;
    color: var(--fm-muted);
}

.uc-ext-danger {
    flex: 0 0 auto;
    height: 32px;
    padding: 0 14px;
    border: 1px solid #e6b7b4;
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: #d9534f;
    cursor: pointer;
    transition: background-color .15s, color .15s, border-color .15s;
}

.uc-ext-danger:hover {
    border-color: #d9534f;
    background: var(--fm-tint-red);
}

.uc-ext-empty {
    padding: 22px 0;
    text-align: center;
    font-size: 13px;
    color: var(--fm-muted);
}

.uc-ext-csswrap {
    position: relative;
}

.uc-ext-css {
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 13px;
    min-height: 240px;
}

.uc-ext-count {
    position: absolute;
    right: 10px;
    bottom: 10px;
    padding: 2px 8px;
    border-radius: 0.25rem;
    background: #d9534f;
    font-size: 11px;
    line-height: 1.6;
    color: #fff;
    pointer-events: none;
}

@media (max-width: 640px) {
    .uc-ext {
        gap: 12px;
        flex-direction: column;

        align-items: stretch;
    }

    .uc-ext-menu {
        flex: 0 0 auto;
        flex-direction: row;
        flex-wrap: nowrap;
        gap: 2px;
        width: 100%;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .uc-ext-menu::-webkit-scrollbar {
        display: none;
    }

    .uc-ext-menu a {
        flex: 0 0 auto;
        gap: 5px;
        padding: 8px 4px;
        font-size: 12.5px;
        white-space: nowrap;
    }

    .uc-ext-menu a i {
        width: 13px;
        font-size: 12.5px;
    }
}

.mk-title {
    margin: 0 0 14px;
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.mk-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 14px;
}

.mk-tabs,
.mk-bar-ops {
    display: inline-flex;
    gap: 8px;
}

.mk-tabs a {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    transition: border-color .15s, color .15s, background-color .15s;
}

.mk-tabs a:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-tabs a.active {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

@media (max-width: 640px) {

    .mk-bar {
        flex-wrap: nowrap;
        gap: 6px;
    }

    .mk-tabs,
    .mk-bar-ops {
        flex: 0 0 auto;
        min-width: 0;
        gap: 6px;
    }

    .mk-tabs a {
        height: 30px;
        padding: 0 6px;
        font-size: 12px;
        white-space: nowrap;
    }

    .mk-bar-ops .mk-btn {
        height: 30px;
        padding: 0 8px;
        font-size: 12px;
        white-space: nowrap;
    }
}

.mk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 32px;
    padding: 0 18px;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    font-size: 13px;
    cursor: pointer;
    transition: border-color .15s, color .15s, background-color .15s, filter .15s;
}

.mk-btn-main {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.mk-btn-main:hover {
    filter: brightness(1.06);
}

.mk-btn-main:disabled {
    border-color: var(--fm-border);
    background: var(--fm-soft-2);
    cursor: not-allowed;
}

.mk-btn-danger {
    border-color: #df5652;
    background: #df5652;
    color: #fff;
}

.mk-btn-danger:hover {
    filter: brightness(1.06);
}

.mk-btn-ghost {
    border-color: var(--fm-border);
    background: var(--fm-card);
    color: var(--fm-text-sub);
}

.mk-btn-ghost:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-list {
    overflow-x: auto;
}

.mk-table {
    min-width: 640px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;

    border-collapse: separate;
    border-spacing: 0;
}

.mk-table thead th:first-child {
    border-top-left-radius: 0.25rem;
}

.mk-table thead th:last-child {
    border-top-right-radius: 0.25rem;
}

.mk-table tbody tr:last-child > td {
    border-bottom: 0;
}

.mk-table tbody tr:last-child > td:first-child {
    border-bottom-left-radius: 0.25rem;
}

.mk-table tbody tr:last-child > td:last-child {
    border-bottom-right-radius: 0.25rem;
}

.mk-td-domain b {
    font-weight: 600;
    color: var(--fm-text);
    vertical-align: middle;
}

.mk-td-price {
    color: #5b6ecb;
    font-weight: 600;
}

.mk-th-ops,
.mk-td-ops {
    text-align: right;
    white-space: nowrap;
}

.mk-td-ops a {
    margin-left: 12px;
    font-size: 12.5px;
    color: var(--fm-primary);
}

.mk-td-ops a:hover {
    color: var(--fm-primary-dark);
}

.mk-badge {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 9px;
    border-radius: 3px;
    font-size: 12px;
    line-height: 1;
    white-space: nowrap;
}

.mk-badge-onsale,
.mk-badge-ok {
    background: var(--fm-primary-light);
    color: #2f8b52;
}

.mk-badge-show {
    background: var(--fm-tint-blue);
    color: #3f6fc4;
}

.mk-badge-sold {
    background: var(--fm-soft);
    color: var(--fm-text-sub);
}

.mk-badge-wait {
    background: var(--fm-tint-gold);
    color: #b98b1f;
}

.mk-badge-bad {
    background: var(--fm-tint-red);
    color: #d9534f;
}

.mk-empty {
    padding: 46px 0 40px;
    text-align: center;
}

.mk-empty i {
    font-size: 46px;
    color: #e4dfd1;
}

.mk-empty p {
    margin: 14px 0 5px;
    font-size: 14px;
    color: var(--fm-text-sub);
}

.mk-empty span {
    font-size: 12px;
    color: var(--fm-muted);
}

.mk-table-empty {
    min-width: 0;
}

.mk-table tbody tr.mk-empty-row:hover {
    background: transparent;
}

.mk-empty-row > td {
    padding: 0;
}

.mk-empty-pic img {
    display: block;
    width: 180px;
    max-width: 62%;
    height: auto;
    margin: 0 auto 14px;
}

.mk-empty.mk-empty-pic p {
    margin-top: 0;
}

@media (max-width: 640px) {
    .mk-table-empty th {
        padding: 9px 4px;
        font-size: 11px;
    }
}

.mk-home-table.mk-home-table-empty {
    min-width: 0;
}

.mk-home-table tbody tr.mk-empty-row > td {
    padding: 0;
    border-top: 0;
}

.mk-home-table tbody tr.mk-empty-row:hover td {
    background: transparent;
}

.mk-modal {
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.mk-modal[hidden] {
    display: none;
}

.mk-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(40, 36, 26, .45);
}

.mk-modal-box {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 460px;
    max-height: 88vh;
    border-radius: 6px;
    background: var(--fm-card);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
}

.mk-modal-wide {
    max-width: 660px;
}

.mk-modal-narrow {
    max-width: 380px;
}

.mk-confirm-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.7;
    color: var(--fm-text);
    word-break: break-all;
}

.mk-confirm-icon {
    width: 15px;
    height: 15px;
    margin-right: 5px;
    vertical-align: -2px;
    fill: #df5652;
}

.mk-confirm-icon-mark {
    fill: #fff;
}

.mk-confirm-icon-ok {
    display: none;
    fill: var(--fm-primary);
}

.mk-modal-tone-primary .mk-confirm-icon-warn {
    display: none;
}

.mk-modal-tone-primary .mk-confirm-icon-ok {
    display: inline-block;
}

.mk-modal-tone-primary [data-mk-confirm-ok] {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.mk-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--fm-line);
}

.mk-modal-head b {
    font-size: 15px;
    color: var(--fm-text-strong);
}

.mk-modal-x {
    border: 0;
    background: none;
    font-size: 22px;
    line-height: 1;
    color: var(--fm-muted);
    cursor: pointer;
}

.mk-modal-x:hover {
    color: #d9534f;
}

.mk-modal-body {
    padding: 16px 18px;
    overflow-y: auto;
}

.mk-modal-foot {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    padding: 12px 18px 16px;
}

.mk-field {
    margin-bottom: 14px;
}

.mk-field:last-child {
    margin-bottom: 0;
}

.mk-field>label {
    display: block;
    margin-bottom: 7px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
}

.mk-input,
.mk-textarea {
    display: block;
    width: 100%;
    box-sizing: border-box;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 13px;
    color: var(--fm-text);
    transition: border-color .15s, background-color .15s, box-shadow .15s;
}

.mk-input {
    height: 38px;
    padding: 0 12px;
}

.mk-textarea {
    padding: 9px 12px;
    line-height: 1.7;
    resize: vertical;
}

.mk-input:focus,
.mk-textarea:focus {
    outline: none;
    border-color: var(--fm-primary);
    background: var(--fm-card);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.mk-seg {
    display: inline-flex;
}

.mk-seg button {
    min-width: 76px;
    height: 34px;
    border: 1px solid var(--fm-border);
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
    transition: border-color .15s, background-color .15s, color .15s;
}

.mk-seg button:first-child {
    border-radius: 0.25rem 0 0 0.25rem;
}

.mk-seg button:last-child {
    margin-left: -1px;
    border-radius: 0 0.25rem 0.25rem 0;
}

.mk-seg button.active {
    position: relative;
    z-index: 1;
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.mk-note {
    margin-bottom: 16px;
    padding: 12px 14px;
    border: 1px solid #efe8d5;
    border-radius: 0.25rem;
    background: var(--fm-tint-gold);
    font-size: 12.5px;
    line-height: 1.9;
    color: #7d7a6b;
}

.mk-note p {
    margin: 0;
}

.mk-note a {
    color: var(--fm-primary);
}

.mk-file-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
}

.mk-file-pick {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    flex: 1 1 240px;
    min-width: 0;
    height: 38px;
    padding: 0 5px 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    cursor: pointer;
    transition: border-color .15s, background-color .15s, box-shadow .15s;
}

.mk-file-pick:hover {
    border-color: var(--fm-primary);
    background: var(--fm-card);
}

.mk-file-pick:focus-within {
    border-color: var(--fm-primary);
    background: var(--fm-card);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.mk-file-pick>i {
    flex: 0 0 auto;
    font-size: 14px;
    color: var(--fm-muted);
    transition: color .15s;
}

.mk-file-pick.has-file>i {
    color: var(--fm-primary);
}

.mk-file-name {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    font-size: 13px;
    color: var(--fm-muted);
    white-space: nowrap;
    text-overflow: ellipsis;
}

.mk-file-pick.has-file .mk-file-name {
    color: var(--fm-text);
}

.mk-file-btn {
    flex: 0 0 auto;
    height: 28px;
    padding: 0 12px;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 12px;
    font-weight: 600;
    line-height: 28px;
    transition: background-color .15s, color .15s;
}

.mk-file-pick:hover .mk-file-btn {
    background: var(--fm-primary);
    color: #fff;
}

.mk-file-row .mk-btn {
    height: 38px;
}

.mk-file-input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.mk-file-tip {
    flex: 1 1 100%;
    font-size: 12px;
    color: var(--fm-muted);
}

@media (max-width: 640px) {
    .mk-file-pick {
        flex: 1 1 100%;
    }
}

.mk-preview {
    margin-top: 14px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    overflow: auto;
    max-height: 260px;
}

.mk-preview-table {
    min-width: 560px;
}

.mk-preview-table th,
.mk-preview-table td {
    padding: 8px 10px;
    font-size: 12.5px;
    white-space: nowrap;
}

.mk-preview-table tr.is-bad {
    background: var(--fm-tint-red);
}

.mk-preview-des {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mk-preview-sum {
    padding: 9px 12px;
    border-top: 1px solid var(--fm-line);
    background: var(--fm-soft);
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.mk-author {
    margin: 8px -18px 0;
}

.mk-author-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 18px;
    background: linear-gradient(90deg, #8fc7ff 0%, #c3b6f7 48%, #f7b9df 100%);
}

.mk-author-title {
    font-size: 15px;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 1px 2px rgba(60, 40, 90, .28);
}

.mk-author-tabs {
    display: inline-flex;
    gap: 6px;
}

.mk-author-tabs a {
    display: inline-flex;
    align-items: center;
    height: 26px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, .75);
    border-radius: 3px;
    background: rgba(255, 255, 255, .16);
    font-size: 12px;
    color: #fff;
    transition: background-color .15s, color .15s;
}

.mk-author-tabs a:hover {
    background: rgba(255, 255, 255, .34);
}

.mk-author-tabs a.active {
    border-color: #fff;
    background: var(--fm-card);
    font-weight: 600;
    color: #5b4a7a;
}

.mk-author-list {
    padding: 4px 18px 6px;
}

.mk-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 12px 0;
    border-bottom: 1px dashed #efeadd;
}

.mk-item:last-child {
    border-bottom: 0;
}

.mk-item.is-hidden {
    display: none;
}

.mk-item-main {
    flex: 1 1 auto;
    min-width: 0;
}

.mk-item-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}

.mk-item-domain {
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text);
}

.mk-item-des {
    margin: 5px 0 0;
    font-size: 12.5px;
    line-height: 1.6;
    color: var(--fm-muted);
}

.mk-item-price {
    flex: 0 0 auto;
    text-align: right;
}

.mk-item-price b {
    display: block;
    font-size: 15px;
    font-weight: 600;
    color: #5b6ecb;
}

.mk-item-price span {
    font-size: 12px;
    color: var(--fm-muted);
}

.mk-author-empty {
    margin: 0;
    padding: 6px 0 18px;
    text-align: center;
    font-size: 13px;
    color: var(--fm-muted);
}

.mk-author-empty-img {
    display: block;
    width: 220px;
    max-width: 70%;
    height: auto;
    margin: 0 auto 4px;
}

.mk-author-empty p {
    margin: 0;
}

.mk-home-note {
    margin-bottom: 10px;
    font-size: 12px;
    color: var(--fm-muted);
    text-align: right;
}

.thread-panel-market {
    overflow: visible;
}

.thread-panel-market .thread-toolbar {
    border-radius: var(--fm-radius) var(--fm-radius) 0 0;
}

.mk-home {
    padding: 12px 16px 16px;
}

.mk-home-bar {
    margin-bottom: 14px;
}

.mk-home-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.mk-home-row + .mk-home-row {
    margin-top: 10px;
}

.mk-home-tabs {
    display: inline-flex;
    gap: 8px;
}

.mk-home-tabs a {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    transition: border-color .15s, color .15s, background-color .15s;
}

.mk-home-tabs a:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-home-tabs a.active {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.mk-home-selects {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.mk-home-bar select {
    height: 32px;
    max-width: 100%;
    padding: 0 8px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
}

.mk-home-bar select.mk-home-sel.is-active {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.mk-home-sort {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    transition: border-color .15s, color .15s;
}

.mk-home-sort i {
    font-size: 11px;
    color: var(--fm-muted);
}

.mk-home-sort:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-home-sort.is-active {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-home-sort.is-active i {
    color: var(--fm-primary);
}

.mk-tld {
    position: relative;
}

.mk-tld-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
}

.mk-tld-btn:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-tld-btn.is-active {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.mk-tld-btn i {
    font-size: 11px;
    transition: transform .2s;
}

.mk-tld.is-open .mk-tld-btn i {
    transform: rotate(180deg);
}

.mk-tld-panel {
    position: absolute;
    left: 0;
    top: calc(100% + 6px);
    z-index: 30;
    width: 200px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 6px 18px rgba(60, 55, 40, .12);
}

.mk-tld-search {
    position: relative;
    padding: 8px;
    border-bottom: 1px solid var(--fm-line);
}

.mk-tld-search i {
    position: absolute;
    left: 18px;
    top: 50%;
    margin-top: -6px;
    font-size: 11px;
    color: var(--fm-muted);
    pointer-events: none;
}

.mk-tld-search input {
    width: 100%;
    height: 30px;
    padding: 0 10px 0 28px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
}

.mk-tld-list {
    max-height: 196px;
    overflow-y: auto;
    padding: 4px 0;
    scrollbar-width: thin;
    scrollbar-color: var(--fm-border) transparent;
}

.mk-tld-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px;
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
}

.mk-tld-item:hover {
    background: var(--fm-soft);
}

.mk-tld-item input {
    width: 14px;
    height: 14px;
    margin: 0;
    accent-color: var(--fm-primary);
}

.mk-tld-item span {
    flex: 1 1 auto;
}

.mk-tld-item em {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
}

.mk-tld-none {
    padding: 12px;
    font-size: 13px;
    color: var(--fm-muted);
    text-align: center;
}

.mk-tld-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px;
    border-top: 1px solid var(--fm-line);
}

.mk-tld-reset {
    height: 30px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
}

.mk-tld-reset:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-tld-ok {
    height: 30px;
    padding: 0 16px;
    border: 1px solid var(--fm-primary);
    border-radius: 0.25rem;
    background: var(--fm-primary);
    font-size: 13px;
    color: #fff;
    cursor: pointer;
}

.mk-tld-ok:hover {
    filter: brightness(1.06);
}

.mk-home-clear {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 14px;
    border: 1px solid #df5652;
    border-radius: 0.25rem;
    background: #df5652;
    font-size: 13px;
    color: #fff;
}

.mk-home-clear:hover {
    filter: brightness(1.06);
}

.mk-home-sell {
    margin-left: auto;
}

.mk-home-search {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    width: 190px;
    max-width: 100%;
}

.mk-home-search > i {
    position: absolute;
    left: 11px;
    font-size: 12px;
    color: var(--fm-muted);
    pointer-events: none;
}

.mk-home-search input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
    height: 32px;
    padding: 0 12px 0 30px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
}

.mk-home-search .btn {
    height: 32px;
    padding: 0 16px;
    font-size: 13px;
    line-height: 1;
}

.mk-home-list {
    overflow-x: auto;
}

.mk-home-table {
    width: 100%;
    min-width: 560px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    background: var(--fm-card);
}

.mk-home-table thead th {
    padding: 10px 14px;
    background: var(--fm-soft);
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
    text-align: left;
    white-space: nowrap;
}

.mk-home-table tbody td {
    padding: 11px 14px;
    border-top: 1px solid var(--fm-line);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.mk-home-table tbody tr:hover td {
    background: var(--fm-soft);
}

.mk-home-th a {
    color: inherit;
}

.mk-home-th a:hover {
    color: var(--fm-primary);
}

.mk-home-th i {
    margin-left: 3px;
    font-size: 11px;
    color: var(--fm-muted);
}

.mk-home-th a:hover i {
    color: var(--fm-primary);
}

.mk-home-td-domain {
    white-space: nowrap;
}

.mk-home-td-domain a {
    font-weight: 600;
    color: var(--fm-text);
}

.mk-home-td-domain a:hover {
    color: var(--fm-primary);
}

.mk-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-right: 7px;
    border-radius: 50%;
    vertical-align: middle;
}

.mk-dot-ok {
    background: #35c46b;
}

.mk-dot-no {
    background: #e05a58;
}

.mk-tag {
    display: inline-flex;
    align-items: center;
    height: 18px;
    margin-left: 7px;
    padding: 0 6px;
    border: 1px solid var(--fm-border);
    border-radius: 3px;
    background: var(--fm-soft-2);
    font-size: 11px;
    font-style: normal;
    color: var(--fm-text-sub);
    vertical-align: middle;
}

.mk-home-td-len {
    color: var(--fm-text-sub);
}

.mk-home-td-des {
    max-width: 320px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mk-home-td-price {
    font-weight: 600;
    color: var(--fm-text-sub);
}

.mk-home-table thead th.mk-home-th,
.mk-home-table tbody td.mk-home-td-len,
.mk-home-table tbody td.mk-home-td-price {
    text-align: center;
}

.mk-home-td-price.has-price {
    color: #e03e3e;
}

body.mkd-lock {
    overflow: hidden;
}

.mkd {
    position: fixed;
    inset: 0;
    z-index: 900;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
}

.mkd[hidden] {
    display: none;
}

.mkd-mask {
    position: absolute;
    inset: 0;
    background: rgba(30, 27, 20, .55);
}

.mkd-box {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 430px;
    max-height: 88vh;
    border-radius: 12px;

    background: transparent;
    box-shadow: 0 12px 36px rgba(30, 26, 18, .28);
    overflow: hidden;
}

.mkd-box-sm {
    max-width: 400px;
}

.mkd-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px 16px;

    border-radius: 12px 12px 0 0;
    background: #3d3d3d;
    background-clip: padding-box;
    color: #fff;
}

.mkd-head b {
    font-size: 14.5px;
    font-weight: 600;
}

.mkd-x {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, .16);
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}

.mkd-x:hover {
    background: rgba(255, 255, 255, .28);
}

.mkd-loading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    padding: 46px 0;
    font-size: 12px;
    color: var(--fm-muted);
}

.mkd-loading i {
    font-size: 22px;
    color: var(--fm-primary);
}

.mkd-body [hidden] {
    display: none !important;
}

#mkd-detail .mkd-head {
    border-bottom: 1px solid #eceef2;
    background: var(--fm-tint-blue);
    color: var(--fm-text-strong);
}

#mkd-detail .mkd-x {
    background: #eceef2;
    color: #7c8290;
}

#mkd-detail .mkd-x:hover {
    background: #e0e3e9;
}

.mkd-body {
    padding: 16px;
    background: var(--fm-card);
    overflow-y: auto;
}

.mkd-title {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid #f0eee6;
}

.mkd-domain {
    font-size: 17px;
    font-weight: 700;
    color: var(--fm-text-strong);
}

.mkd-domain-ico {
    font-size: 13px;
    color: #9aa4b5;
    cursor: pointer;
}

.mkd-domain-ico:hover {
    color: var(--fm-primary);
}

.mkd-whois {
    margin: 0;
    padding: 0;
    list-style: none;
}

.mkd-whois li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 8px 0;
    border-bottom: 1px solid #f4f2ec;
    font-size: 12px;
}

.mkd-whois li:last-child {
    border-bottom: 0;
}

.mkd-whois span {
    flex: 0 0 84px;
    color: var(--fm-muted);
}

.mkd-whois b {
    flex: 1 1 auto;
    font-weight: 500;
    color: var(--fm-text);
    word-break: break-all;
    white-space: pre-line;
}

.mkd-whois-tip {
    margin: 10px 0 0;
    font-size: 10px;
    line-height: 1.7;
    color: var(--fm-muted);
}

.mkd-whois li.is-loading {
    justify-content: center;
    padding: 18px 0;
    border-bottom: 0;
}

.mkd-whois li.is-loading span {
    flex: 0 0 auto;
    color: var(--fm-primary);
}

.mkd-whois li.is-loading i {
    margin-right: 4px;
}

.mkd-verify {
    display: inline-flex;
    align-items: center;
    height: 22px;
    margin-left: auto;
    padding: 0 10px;
    border-radius: 4px;
    background: #f2c14e;
    color: #6b4d05;
    font-size: 12px;
}

.mkd-verify.is-ok {
    background: #2eb872;
    color: #fff;
}

.mkd-prices {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid #f0eee6;
}

.mkd-prices li {
    padding: 0;
}

.mkd-prices span {
    display: block;
    margin-bottom: 3px;
    font-size: 12px;
    color: #8d98a8;
}

.mkd-prices b {
    font-size: 15px;
    color: #2f7ed8;
}

.mkd-prices li:last-child b {
    color: #e03e3e;
}

.mkd-field {
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid #f0eee6;
}

.mkd-label {
    display: block;
    margin-bottom: 5px;
    font-size: 0.75rem;
    color: var(--fm-muted);
}

.mkd-text {
    margin: 0;
    font-size: 12px;
    line-height: 1.7;
    color: var(--fm-text);
    word-break: break-word;
}

.mkd-tip {
    margin-bottom: 10px;
    padding: 9px 12px;
    border: 1px solid #efe0b8;
    border-radius: 8px;
    background: var(--fm-tint-gold);
    font-size: 10px;
    line-height: 1.7;
    color: #8a7c4e;
}

.mkd-warn {
    margin-bottom: 12px;
    padding: 9px 12px;
    border: 1px solid #f5c6c6;
    border-radius: 8px;
    background: var(--fm-tint-red);
    font-size: 12.5px;
    line-height: 1.7;
    color: #c4534f;
}

.mkd-seller {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    border-radius: 8px;
    background: var(--fm-soft-2);
}

.mkd-avatar {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    overflow: hidden;
    border-radius: 50%;
}

.mkd-avatar img,
.mkd-avatar .forum-letter-avatar {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    font-size: 18px;
}

.mkd-seller-main {
    min-width: 0;
}

.mkd-seller-name {
    margin-right: 6px;
    font-size: 14px;
    color: var(--fm-text-strong);
}

.mkd-seller-uid,
.mkd-seller-time {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
}

.mkd-seller-time {
    display: block;
    margin-top: 3px;
}

.mkd-foot {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-top: 1px solid #f0eee6;

    background: var(--fm-card);
}

.mkd-btn {
    display: inline-flex;
    flex: 1 1 auto;
    align-items: center;
    justify-content: center;
    height: 34px;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 6px;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
}

.mkd-btn i {
    margin-right: 5px;
}

.mkd-btn-dark {
    background: #20242c;
    color: #fff;
}

.mkd-btn-main {
    background: #23b3a6;
    color: #fff;
}

.mkd-btn-warn {
    background: #38a83a;
    color: #fff;
}

.mkd-btn-plain {
    border-color: transparent;
    background: #2f9bd6;
    color: #fff;
}

.mkd-btn:hover {
    filter: brightness(1.05);
}

.mkd-escrow-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.mkd-escrow-avatar {
    width: 66px;
    height: 66px;
}

.mkd-escrow-avatar .mkd-escrow-img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    font-size: 26px;
}

.mkd-escrow-name {
    font-size: 16px;
    color: var(--fm-text-strong);
}

.mkd-escrow-tag {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 12px;
    border-radius: 999px;
    background: linear-gradient(90deg, #f6d488, #e9b352);
    color: #6b4d05;
    font-size: 12px;
}

.mkd-contacts {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-bottom: 14px;
}

.mkd-contacts li {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 12px;
    border-radius: 8px;
    background: var(--fm-soft-2);
}

.mkd-contact-pay {
    grid-column: 1 / -1;
}

.mkd-contacts i {
    font-size: 15px;
}

.mkd-c-wechat {
    color: #2eb872;
}

.mkd-c-tg {
    color: #3aa6e0;
}

.mkd-c-pay {
    color: #f0b429;
}

.mkd-contact-copy {
    cursor: pointer;
    transition: background .15s, box-shadow .15s;
}

.mkd-contact-copy:hover {
    background: var(--fm-soft-2);
}

.mkd-contact-copy:active {
    background: var(--fm-soft-2);
}

.mkd-contact-copy:focus-visible {
    outline: 2px solid #2f9bd6;
    outline-offset: 2px;
}

.mkd-contact-copy > div {
    flex: 1;
    min-width: 0;
}

.mkd-c-copy {
    flex: none;
    margin-left: auto;
    font-size: 12px !important;
    color: #b6b2a5;
    opacity: .6;
    transition: opacity .15s, color .15s;
}

.mkd-contact-copy:hover .mkd-c-copy {
    opacity: 1;
    color: #2f9bd6;
}

.mkd-c-copy.is-done {
    opacity: 1;
    color: #2eb872;
}

.mkd-contacts div > span {
    display: block;
    font-size: 12px;
    color: var(--fm-muted);
}

.mkd-contacts b {
    font-size: 13.5px;
    color: var(--fm-text);
    word-break: break-all;
}

.mkd-fee {
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid #f3e2b4;
    border-radius: 8px;
    background: var(--fm-tint-gold);
}

.mkd-fee-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
}

.mkd-fee-head b {
    font-size: 13.5px;
    color: var(--fm-text);
}

.mkd-fee-head i {
    margin-right: 5px;
    color: #e0a52a;
}

.mkd-fee-calc {
    height: 24px;
    padding: 0 10px;
    border: 1px solid #e5cf8d;
    border-radius: 999px;
    background: var(--fm-card);
    font-size: 12px;
    color: #a3802c;
    cursor: pointer;
}

.mkd-fee-calc:hover {
    border-color: #d8b95e;
    color: #8a6a1e;
}

.mkd-fee-main {
    margin: 0 0 8px;
    font-size: 13px;
    color: #8a7c4e;
}

.mkd-fee-main b {
    color: #e03e3e;
}

.mkd-fee-terms {
    margin: 0;
    padding: 0;
    list-style: none;
}

.mkd-fee-terms li {
    font-size: 12.5px;
    line-height: 1.8;
    color: #9a8f6c;
}

.mkd-fee-terms b {
    color: #a3802c;
}

.mkd-steps {
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid #ece9df;
    border-radius: 8px;
}

.mkd-steps-title {
    display: block;
    margin-bottom: 8px;
    font-size: 13.5px;
    color: var(--fm-text);
}

.mkd-steps-title i {
    margin-right: 5px;
    color: var(--fm-primary);
}

.mkd-steps ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.mkd-steps li {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.mkd-steps em {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 11px;
    font-style: normal;
}

.mkd-notice {
    padding: 10px 12px;
    border: 1px solid #f5c6c6;
    border-radius: 8px;
    background: var(--fm-tint-red);
    font-size: 12.5px;
    line-height: 1.75;
    color: #c4534f;
}

.mkd-fee-desc {
    margin: 0 0 12px;
    font-size: 13px;
    line-height: 1.8;
    color: var(--fm-text-sub);
}

.mkd-fee-input {
    width: 100%;
    height: 38px;
    margin-bottom: 12px;
    padding: 0 12px;
    border: 1px solid #e3e0d6;
    border-radius: 8px;
    background: var(--fm-card);
    font-size: 13.5px;
    color: var(--fm-text);
}

.mkd-fee-result {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    border-radius: 8px;
    background: var(--fm-tint-gold);
}

.mkd-fee-result span {
    font-size: 12.5px;
    color: #8a7c4e;
}

.mkd-fee-result b {
    font-size: 17px;
    color: #e03e3e;
}

.mkd-fee-rule {
    margin: 10px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
}

@media (max-width: 640px) {
    .mkd {
        padding: 12px 10px;
    }

    .mkd-contacts {
        grid-template-columns: 1fr;
    }

    .mkd-foot {
        flex-wrap: wrap;
    }

    .mkd-btn {
        flex: 1 1 40%;
    }
}

@media (max-width: 640px) {

    .mk-home-search {
        margin-left: 0;
    }

    .mk-home-row {
        gap: 8px;
    }

    .mk-home-row + .mk-home-row {
        margin-top: 8px;
    }

    .mk-home-tabs {
        gap: 6px;
    }

    .mk-home-tabs a {
        padding: 0 11px;
    }

    .mk-home-bar select {
        padding: 0 6px;
    }

    .mk-home-search {
        flex: 1 1 132px;
        width: auto;
        min-width: 110px;
        max-width: none;
    }

    .mk-home-search .btn {
        padding: 0 12px;
    }
}

@media (max-width: 400px) {
    .mk-home-tabs {
        gap: 5px;
    }

    .mk-home-tabs a {
        padding: 0 8px;
    }

    .mk-home-sort,
    .mk-tld-btn {
        padding: 0 8px;
    }

    .mk-home-sell {
        padding: 0 12px;
    }

    .mk-home-search .btn {
        padding: 0 11px;
    }
}

@media (max-width: 640px) {
    .mk-author {
        margin-left: -14px;
        margin-right: -14px;
    }

    .mk-author-head {
        padding: 10px 14px;
    }

    .mk-author-list {
        padding: 4px 14px 6px;
    }

    .mk-modal {
        padding: 12px;
    }
}

.mk-ops {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.mk-op {
    display: inline-flex;
    align-items: center;
    height: 26px;
    padding: 0 10px;
    border: 0;
    border-radius: 3px;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
    transition: filter .15s;
}

.mk-op:hover {
    filter: brightness(1.06);
}

.mk-op-warn {
    background: #eda13c;
}

.mk-op-ok {
    background: #4fae5c;
}

.mk-op-danger {
    background: #df5652;
}

.mk-verify-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 12px;
    font-size: 13px;
}

.mk-verify-row>span {
    flex: 0 0 auto;
    color: #8a93a5;
}

.mk-verify-row>b {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    color: var(--fm-text);
    word-break: break-all;
}

.mk-copy {
    flex: 0 0 auto;
    height: 24px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: 3px;
    background: var(--fm-card);
    font-size: 12px;
    color: var(--fm-text-sub);
    cursor: pointer;
}

.mk-copy:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.mk-verify-guide {
    margin-bottom: 16px;
}

.mk-verify-guide>p {
    margin: 0 0 6px;
    font-size: 13px;
    color: #8a93a5;
}

.mk-verify-guide ol {
    margin: 0;
    padding-left: 20px;
}

.mk-verify-guide li {
    margin-bottom: 5px;
    font-size: 12.5px;
    line-height: 1.7;
    color: var(--fm-text-sub);
}

.mk-verify-guide li i {
    color: #9aa3b5;
}

.mk-verify-server {
    margin-top: 16px;
    margin-bottom: 0;
}

.mk-foot-left {
    margin-right: auto;
}

.mk-author-panel {
    margin-top: 25px;
    border-radius: 10px;
}

.mk-author {
    margin: 0;
}

.auth-invite-row {
    align-items: stretch;
}

.auth-invite-buy {
    flex: 0 0 auto;
    height: 42px;
    padding: 0 14px;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
    cursor: pointer;
    white-space: nowrap;
}

.auth-invite-buy:hover {
    background: var(--fm-primary-dark);
}

.auth-invite-tip {
    margin: -4px 0 0;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.auth-invite-tip b {
    color: var(--fm-primary);
}

.invite-mask {
    position: fixed;
    inset: 0;
    background: rgba(38, 36, 28, .45);
    z-index: 1002;
    display: none;
}

.invite-mask.show {
    display: block;
}

.invite-modal {
    position: fixed;
    inset: 0;
    z-index: 1003;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.invite-modal.show {
    display: flex;
}

.invite-card {
    position: relative;
    width: 100%;
    max-width: 420px;
    max-height: 90vh;
    overflow-y: auto;
    padding: 22px;
    background: var(--fm-card);
    border-radius: 0.25rem;
    box-shadow: 0 20px 50px rgba(40, 36, 24, .25);
}

.invite-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    border: 0;
    background: transparent;
    font-size: 22px;
    line-height: 1;
    color: var(--fm-muted);
    cursor: pointer;
}

.invite-close:hover {
    color: var(--fm-text);
}

.invite-tabs {
    display: flex;
    gap: 18px;
    border-bottom: 1px solid var(--fm-line);
    margin-bottom: 18px;
}

.invite-tabs a {
    padding: 0 0 12px;
    font-size: 15px;
    color: var(--fm-text-sub);
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
}

.invite-tabs a.active {
    color: var(--fm-primary);
    border-bottom-color: var(--fm-primary);
    font-weight: 600;
}

.invite-title {
    margin: 0 0 14px;
    font-size: 17px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.invite-label {
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.invite-channels {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.invite-channel {
    display: inline-flex;
    position: relative;
}

.invite-channel input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    pointer-events: none;
}

.invite-channel > span {
    display: inline-flex;
    align-items: center;
    height: 34px;
    padding: 0 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
}

.invite-channel input:checked + span {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
    font-weight: 600;
}

.invite-channel input:focus-visible + span {
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .18);
}

.invite-rate {
    margin-top: 10px;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.invite-info {
    margin-top: 14px;
    padding: 12px 14px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    background: var(--fm-soft);
}

.invite-info > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
    line-height: 2;
    color: var(--fm-text-sub);
}

.invite-info b {
    color: var(--fm-primary);
    font-weight: 600;
}

.invite-note {
    margin-top: 12px;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.invite-btn {
    display: block;
    width: 100%;
    height: 42px;
    margin-top: 16px;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 15px;
    cursor: pointer;
    transition: background .15s;
}

.invite-btn:hover {
    background: var(--fm-primary-dark);
}

.invite-btn:disabled {
    opacity: .6;
    cursor: default;
}

.invite-qr {
    margin: 4px 0 12px;
    text-align: center;
}

.invite-qr img {
    display: inline-block;
    width: 180px;
    max-width: 100%;
    padding: 6px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.invite-pending {
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 1.8;
}

.invite-order {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 12px;
    padding: 10px 12px;
    border: 1px dashed var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.invite-order b {
    flex: 1 1 auto;
    font-weight: 500;
    color: var(--fm-text);
    word-break: break-all;
}

.invite-order a {
    flex: 0 0 auto;
    color: var(--fm-primary);
}

.invite-link {
    display: block;
    margin-top: 12px;
    text-align: center;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.invite-link:hover {
    color: var(--fm-primary);
}

.invite-done-tip {
    margin-bottom: 12px;
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.invite-code {
    padding: 16px;
    border: 1px dashed var(--fm-primary);
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font: 600 18px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: 1px;
    text-align: center;
    word-break: break-all;
}

.invite-tip {
    padding: 9px 12px;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 12px;
    line-height: 1.7;
}

.invite-query {
    margin-top: 16px;
    padding: 14px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
}

.invite-query-label {
    margin-bottom: 10px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.invite-query-row {
    display: flex;
    gap: 8px;
}

.invite-query-row input {
    flex: 1 1 auto;
    min-width: 0;
    height: 38px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    font-size: 13px;
    color: var(--fm-text);
}

.invite-query-row input:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.invite-query-row button {
    flex: 0 0 auto;
    height: 38px;
    padding: 0 16px;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}

.invite-query-row button:disabled {
    opacity: .6;
    cursor: default;
}

.invite-query-result {
    margin-top: 12px;
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 1.9;
    word-break: break-all;
}

.invite-query-result b {
    color: var(--fm-text);
    font-weight: 500;
}

.invite-local {
    margin-top: 18px;
}

.invite-local-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.invite-local-head a {
    font-size: 12px;
    font-weight: 400;
    color: var(--fm-primary);
}

.invite-local-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.invite-local-empty {
    padding: 22px;
    border-radius: 0.25rem;
    background: var(--fm-soft);
    color: var(--fm-muted);
    font-size: 13px;
    text-align: center;
}

.invite-local-item {
    padding: 12px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.8;
}

.invite-local-line b {
    color: var(--fm-text);
    font-weight: 500;
    word-break: break-all;
}

.invite-local-state {
    color: #c98a3f;
}

.invite-local-code {
    margin-top: 6px;
    padding: 8px 10px;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font: 600 14px/1.6 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    text-align: center;
    word-break: break-all;
}

.invite-local-ops {
    margin-top: 6px;
}

.invite-local-ops a {
    color: var(--fm-primary);
}

@media (max-width: 640px) {
    .mk-author {
        margin: 0;
    }

    .invite-modal {
        padding: 12px;
    }

    .invite-card {
        padding: 18px;
    }

    .invite-channel > span {
        height: 32px;
        padding: 0 12px;
        font-size: 12px;
    }
}

.auth-uid-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 14px;
    padding: 8px 12px;
    border: 1px dashed var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
}

.auth-uid-bar-tip {
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.6;
}

.auth-uid-entry {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    flex: 0 0 auto;
    height: 32px;
    padding: 0 12px;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 12px;
}

.auth-uid-entry:hover {
    background: var(--fm-primary-dark);
    color: #fff;
}

.auth-uid-locked {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 14px;
    padding: 9px 12px;
    border: 1px solid #cbe8d5;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    font-size: 12px;
    color: var(--fm-primary);
    line-height: 1.6;
}

.auth-uid-locked[hidden] {
    display: none;
}

.auth-uid-locked b {
    font-weight: 600;
}

.auth-uid-locked a {
    margin-left: auto;
    flex: 0 0 auto;
    color: var(--fm-text-sub);
}

.uid-page-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}

.uid-page-head h1 {
    margin-bottom: 6px;
}

.uid-plain-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    height: 34px;
    padding: 0 14px;
    border: 1px solid var(--fm-primary);
    border-radius: 0.25rem;
    background: var(--fm-card);
    color: var(--fm-primary);
    font-size: 13px;
}

.uid-plain-btn:hover {
    background: var(--fm-primary);
    color: #fff;
}

.uid-lock {
    margin-top: 18px;
}

.uid-lock-label {
    margin-bottom: 8px;
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uid-lock-row {
    display: flex;
    gap: 10px;
}

.uid-lock-row input {
    flex: 1 1 auto;
    min-width: 0;
    height: 42px;
    padding: 0 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    font-size: 14px;
    color: var(--fm-text);
}

.uid-lock-row input:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.uid-lock-row input::-webkit-outer-spin-button,
.uid-lock-row input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.uid-lock-row input[type=number] {
    -moz-appearance: textfield;
    appearance: textfield;
}

.uid-lock-row input.is-ok {
    border-color: var(--fm-primary);
}

.uid-lock-row input.is-err {
    border-color: #e0a09b;
}

.uid-lock-btn {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 42px;
    min-width: 118px;
    padding: 0 18px;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 14px;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
}

.uid-lock-btn i {
    flex: 0 0 auto;
}

.uid-lock-btn:hover {
    background: var(--fm-primary-dark);
}

.uid-lock-btn:disabled {
    opacity: .6;
    cursor: not-allowed;
}

.uid-lock-tip {
    margin-top: 8px;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.uid-lock-tip.is-ok {
    color: var(--fm-primary);
}

.uid-lock-tip.is-err {
    color: #c9453f;
}

.uid-note {
    margin-top: 10px;
    padding: 9px 12px;
    border-left: 3px solid #d8d3c4;
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 10px;
    line-height: 1.9;
    color: var(--fm-text-sub);
}

.uid-shop {
    margin-top: 26px;
    padding-top: 20px;
    border-top: 1px solid var(--fm-line);
}

.uid-shop-title {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uid-shop-sub {
    margin: 0 0 14px;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.uid-shop-empty {
    padding: 20px;
    border-radius: 0.25rem;
    background: var(--fm-soft);
    color: var(--fm-muted);
    font-size: 13px;
    text-align: center;
}

.uid-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.uid-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
    height: 46px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}

.uid-item:hover {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.uid-item:disabled {
    opacity: .6;
    cursor: default;
    box-shadow: none;
}

.uid-item b {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uid-item-price {
    flex: 0 0 auto;
    color: var(--fm-primary);
    font-weight: 600;
    font-size: 12px;
    white-space: nowrap;
}

body.uid-confirm-open {
    overflow: hidden;
}

.uid-confirm {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.uid-confirm[hidden] {
    display: none;
}

.uid-confirm-mask {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgba(38, 36, 30, .45);
}

.uid-confirm-box {
    position: relative;
    width: 100%;
    max-width: 430px;
    padding: 22px 24px 20px;
    border-radius: 0.5rem;
    background: var(--fm-card);
    box-shadow: 0 14px 34px rgba(30, 28, 24, .2);
    animation: uid-confirm-in .16s ease-out;
}

@keyframes uid-confirm-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.uid-confirm-title {
    margin: 0 0 10px;
    font-size: 18px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uid-confirm-desc {
    margin: 0 0 16px;
    font-size: 13.5px;
    line-height: 1.8;
    color: var(--fm-text-sub);
}

.uid-confirm-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    border: 1px solid #e6e1d3;
    border-radius: 0.5rem;
    background: var(--fm-soft-2);
}

.uid-confirm-num {
    font-size: 17px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uid-confirm-price {
    font-size: 17px;
    font-weight: 600;
    color: #e03e3e;
    white-space: nowrap;
}

.uid-confirm-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

.uid-confirm-btn {
    height: 40px;
    padding: 0 22px;
    border: 0;
    border-radius: 0.375rem;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color .15s, opacity .15s;
}

.uid-confirm-btn.is-cancel {
    background: var(--fm-soft-2);
    color: var(--fm-text);
}

.uid-confirm-btn.is-cancel:hover {
    background: var(--fm-soft-2);
}

.uid-confirm-btn.is-ok {
    background: var(--fm-primary);
    color: #fff;
}

.uid-confirm-btn.is-ok:hover {
    opacity: .9;
}

.uid-done-code {
    padding: 16px;
    border: 1px dashed var(--fm-primary);
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font: 600 18px/1.5 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: 1px;
    text-align: center;
    word-break: break-all;
}

.uid-step[hidden] {
    display: none;
}

.uid-countdown {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 18px;
    padding: 10px 14px;
    border: 1px solid #f3ded3;
    border-radius: 0.25rem;
    background: var(--fm-tint-red);
    font-size: 12.5px;
    color: #b06a45;
    line-height: 1.7;
}

.uid-countdown.is-pay {
    border-color: #cbe8d5;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
}

.uid-countdown .uid-time {
    flex: 0 0 auto;
    font: 600 15px/1 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    letter-spacing: 1px;
}

.uid-form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
    margin-top: 16px;
}

.uid-field {
    min-width: 0;
}

.uid-field-full {
    margin-top: 14px;
}

.uid-field label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    color: var(--fm-text-strong);
}

.uid-field input[type=text],
.uid-field input[type=password],
.uid-field select {
    width: 100%;
    height: 42px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13.5px;
    color: var(--fm-text);
}

.uid-field input:focus,
.uid-field select:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px rgba(63, 158, 99, .1);
}

.uid-field-tip {
    margin-top: 6px;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.6;
}

.uid-field-tip.is-ok {
    color: var(--fm-primary);
}

.uid-field-tip.is-err {
    color: #c9453f;
}

.uid-agree {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 16px;
    font-size: 12.5px;
    color: var(--fm-text-sub);
    line-height: 1.7;
    cursor: pointer;
}

.uid-agree input {
    flex: 0 0 auto;
    margin-top: 3px;
}

.uid-migrate-title {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.uid-migrate-desc {
    display: block;
    margin-top: 2px;
    font-size: 12px;
    font-style: normal;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.uid-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 18px;
}

.uid-cancel {
    font-size: 13px;
    color: var(--fm-text-sub);
}

.uid-cancel:hover {
    color: var(--fm-primary);
}

.uid-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 42px;
    padding: 0 22px;
    border: 0;
    border-radius: 0.25rem;
    background: var(--fm-primary);
    color: #fff;
    font-size: 14px;
    cursor: pointer;
    transition: background .15s;
}

.uid-submit:hover {
    background: var(--fm-primary-dark);
    color: #fff;
}

.uid-submit:disabled {
    opacity: .6;
    cursor: default;
}

.uid-hold-status {
    margin-top: 16px;
    padding: 10px 14px;
    border-radius: 0.25rem;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 13px;
    line-height: 1.7;
}

.uid-hold-status b {
    font-weight: 600;
}

.uid-pay-no {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    padding: 10px 12px;
    border: 1px dashed var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.uid-pay-no b {
    flex: 1 1 auto;
    font-weight: 500;
    color: var(--fm-text);
    word-break: break-all;
}

.uid-pay-no a {
    flex: 0 0 auto;
    color: var(--fm-primary);
}

.uid-qr {
    margin: 14px 0 0;
    text-align: center;
}

.uid-qr img {
    display: inline-block;
    width: 180px;
    max-width: 100%;
    padding: 6px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.uid-pay-tip {
    margin-top: 12px;
    font-size: 12.5px;
    color: var(--fm-text-sub);
    line-height: 1.8;
}

.uid-done-box {
    margin-top: 18px;
    text-align: center;
}

.uid-done-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--fm-primary);
}

.uid-done-title i {
    margin-right: 6px;
}

.uid-done-tip {
    margin: 12px 0 18px;
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 1.8;
}

.uid-done-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 18px;
    padding: 8px 14px;
    border-radius: 0.25rem;
    background: var(--fm-tint-gold);
    color: #9a7b1a;
    font-size: 13px;
}

.uid-done-badge img {
    width: 16px;
    height: 16px;
}

@media (max-width: 640px) {
    .uid-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .uid-lock-row {
        flex-wrap: wrap;
    }

    .uid-page-head {
        flex-direction: column;
    }

    .uid-form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .uid-actions {
        flex-direction: column-reverse;
        align-items: stretch;
    }

    .uid-submit {
        width: 100%;
    }
}

.vip-badge {
    height: 16px;
    width: auto;
    margin-left: 4px;
    vertical-align: -3px;
}

.vip-name.vip-name {
    color: #7c5bd1;
}

a.vip-name.vip-name:hover,
a.vip-name.vip-name:focus {
    color: #6a49c8;
}

.vip-badge-text {
    display: inline-block;
    height: 16px;
    padding: 0 6px;
    border-radius: 3px;
    background: #7c5bd1;
    color: #fff;
    font-size: 11px;
    font-style: normal;
    line-height: 16px;
}

.vip-card {
    position: relative;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: 92px;
    box-sizing: border-box;
    flex-shrink: 0;
    text-align: left;
    margin-bottom: 18px;
    padding: 18px 20px;
    border-radius: 8px;
    background: #18243099;
    background-image: url("../images/vip-banner.png"), linear-gradient(to right, #ece9fd, #bab2f8);
    background-repeat: no-repeat;
    background-position: left;
    background-size: 100% 100%;
    overflow: hidden;
}

.vip-card+.uc-tabs {
    display: flex;
    margin: 0;
    padding: 0;
    background: var(--fm-soft);
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem 0.25rem 0 0;
}

.vip-card+.uc-tabs a,
.vip-card+.uc-tabs>span {
    flex: 1 1 0;
    padding: 12px 8px;
    border: 0;
    border-bottom: 3px solid transparent;
    border-radius: 0;
    background: transparent;
    color: #7b786a;
    font-size: 14px;
    text-align: center;
}

.vip-card+.uc-tabs a:hover {
    color: #c000ff;
}

.vip-card+.uc-tabs a.active,
.vip-card+.uc-tabs>span.active {
    margin-bottom: 0;
    padding-bottom: 12px;
    background: var(--fm-card);
    border-bottom: 3px solid #c000ff;
    color: #c000ff;
    font-weight: 600;
}

.vip-card-avatar {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    border-radius: 50%;
    overflow: hidden;
    line-height: 0;
}

.vip-card-avatar img,
.vip-card-avatar .forum-letter-avatar {
    flex: 0 0 auto;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    font-size: 20px;
}

.vip-card-main {
    position: relative;
    z-index: 1;
    flex: 1 1 auto;
    min-width: 0;
}

.vip-card-name {
    display: block;
    font-size: 15px;
    color: #3a2f5c;
}

.vip-card-tip {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: #6b5f8c;
}

.vip-card-btn {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    height: 32px;
    padding: 0 16px;
    border: 0;
    border-radius: 16px;
    background: #7c5bd1;
    color: #fff;
    font-size: 13px;
    cursor: pointer;
}

.vip-card-btn:hover {
    background: #6a49c8;
}

.vip-benefits {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 4px 0;
}

.vip-benefit {
    display: flex;
    gap: 10px;
    padding: 11px 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
}

.vip-benefit:hover {
    border-color: #e4ddc9;
    background: var(--fm-soft);
}

.vip-benefit-no {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border-radius: 4px;
    background: var(--fm-primary);   
    color: #fff;
    font-size: 12px;
    font-style: normal;
    line-height: 20px;
    text-align: center;
}

.vip-benefit-main {
    min-width: 0;
}

.vip-benefit-main b {
    display: block;
    font-size: 13px;
    color: var(--fm-text);
}

.vip-benefit-main b .vip-purple {
    font-style: normal;
    color: #7c5bd1;
}

.vip-benefit-main span {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: var(--fm-muted);
    line-height: 1.7;
}

.vip-checkin {
    padding: 4px 0 8px;
}

.vip-checkin-top {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
}

.vip-chip {
    padding: 4px 10px;
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.vip-chip b {
    color: var(--fm-text);
}

.vip-checkin-btn {
    margin-left: auto;
}

.vip-checkin-btn.is-done {
    background: var(--fm-soft-2);
    color: var(--fm-muted);
    cursor: default;
}

.vip-checkin-top .vip-checkin-btn,
.vip-checkin-top .vip-claim-btn {
    height: 34px;
    padding: 0 18px;
    margin-top: 0;
    border-radius: 0.25rem;
    font-size: 13px;
}

.vip-checkin-top .vip-claim-btn:disabled {
    background: var(--fm-soft-2);
    color: var(--fm-muted);
    cursor: default;
}

.vip-hint {
    margin: 10px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
}

.vip-hint b {
    color: var(--fm-primary);
}

.vip-cal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 18px 0 10px;
}

.vip-cal-title {
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text);
}

.vip-cal-nav {
    display: inline-flex;
    gap: 8px;
}

.vip-cal-nav a {
    padding: 4px 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 12px;
    color: var(--fm-text-sub);
}

.vip-cal-nav a:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.vip-cal {
    padding: 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
}

.vip-cal-week,
.vip-cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 6px;
}

.vip-cal-week span {
    text-align: center;
    font-size: 12px;
    color: var(--fm-muted);
}

.vip-cal-grid {
    margin-top: 6px;
}

.vip-cal-day {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 34px;
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.vip-cal-day.is-empty {
    background: transparent;
}

.vip-cal-day.is-signed {
    background: var(--fm-tint-purple);
    color: #6a49c8;
    font-weight: 600;
}

.vip-cal-day.is-today {
    outline: 1px solid var(--fm-primary);
}

.vip-growth {
    padding: 4px 0 8px;
}

.vip-growth-bar {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 18px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: linear-gradient(115deg, #fbf9ff 0%, #fff 52%);
}

.vip-growth-side {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}

.vip-growth-side em {
    font-style: normal;
    font-size: 11px;
    line-height: 1;
    color: var(--fm-text-sub);
}

.vip-growth-side .vip-badge {
    height: 24px;
    margin-left: 0;
}

.vip-growth-main {
    flex: 1 1 auto;
    min-width: 0;
}

.vip-growth-row {
    display: flex;
    align-items: center;
    gap: 10px;
}

.vip-growth-track {
    flex: 1 1 auto;
    height: 14px;
    border-radius: 999px;
    background: var(--fm-line);
    box-shadow: inset 0 1px 2px rgba(90, 82, 60, .1);
    overflow: hidden;
}

.vip-growth-track i {
    display: block;
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #b49df2, #7c5bd1);
    transition: width .3s;
}

.vip-growth-pct {
    flex: 0 0 auto;
    min-width: 34px;
    text-align: right;
    font-size: 12px;
    color: #7c5bd1;
}

.vip-growth-text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 8px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.vip-growth-text span b {
    font-size: 13px;
    color: var(--fm-text);
}

.vip-growth-text em {
    font-style: normal;
    color: var(--fm-muted);
}

.vip-growth-text em b {
    color: #7c5bd1;
}

.uc-vip-table {
    margin-top: 14px;
    border: 1px solid var(--fm-border);
}

.uc-vip-table th,
.uc-vip-table td {
    border: 1px solid var(--fm-border);
}

.vip-exp-change.up {
    color: #3f9e63;
    font-weight: 600;
}

.vip-exp-change.down {
    color: #d9534f;
    font-weight: 600;
}

.vip-rank-user {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.vip-rank-avatar {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    overflow: hidden;
    line-height: 0;
}

.vip-rank-avatar img,
.vip-rank-avatar .forum-letter-avatar {
    flex: 0 0 auto;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    font-size: 12px;
}

.vip-rank-name {
    color: var(--fm-text);
}

.vip-rank-uid,
.vip-rank-exp {
    margin-left: 4px;
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.vip-rank-box .vip-badge {
    margin-left: 0;
}

.vip-rank-box {
    max-height: 400px;
    margin-top: 14px;
    overflow-y: auto;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    scrollbar-width: thin;
    scrollbar-color: var(--fm-border) transparent;
}

.vip-rank-box::-webkit-scrollbar {
    width: 6px;
}

.vip-rank-box::-webkit-scrollbar-thumb {
    border-radius: 0.25rem;
    background: var(--fm-soft-2);
}

.vip-rank-box::-webkit-scrollbar-track {
    background: transparent;
}

.vip-rank-box .uc-vip-table {
    margin-top: 0;
    border: 0;
}

.vip-rank-box .uc-vip-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--fm-soft);
}

.vip-rank-box .uc-vip-table thead th {
    border-top: 0;
}

.vip-rank-box .uc-vip-table th:first-child,
.vip-rank-box .uc-vip-table td:first-child {
    border-left: 0;
}

.vip-rank-box .uc-vip-table th:last-child,
.vip-rank-box .uc-vip-table td:last-child {
    border-right: 0;
}

.vip-rank-box .uc-vip-table tbody tr:last-child td {
    border-bottom: 0;
}

.vip-notice {
    margin: 14px 0 0;
    padding: 10px 12px;
    border-radius: 0.25rem;
    background: var(--fm-tint-gold);
    font-size: 12px;
    color: #b98b1f;
    line-height: 1.8;
}

.uc-vip-page {
    padding: 18px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    overflow: hidden;
}

.uc-vip-page>.uc-tabs.uc-vip-nav {
    margin: -18px -18px 18px;
    padding: 10px 14px 0;
    border: 0;
    border-radius: 0.25rem 0.25rem 0 0;
}

.uc-vip-page>.uc-tabs.uc-vip-nav a.active,
.uc-vip-page>.uc-tabs.uc-vip-nav>span.active {
    margin-bottom: 0;
    padding-bottom: 11px;
    background: var(--fm-card);
    border-color: var(--fm-border);
    border-bottom-color: var(--fm-card);
}

.uc-vip-page>.uc-panel {
    margin-bottom: 0;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
}

.uc-vip-page>.vip-card+.uc-tabs+.uc-panel {
    margin: 0;
    border-top: 0;
    border-radius: 0 0 0.25rem 0.25rem;
}

.uc-vip-page .vip-benefit {
    border-left: 3px solid var(--fm-primary);
}

.uc-vip-invite-panel {
    padding: 22px 24px 24px;
}

.vip-invite-center {
    padding: 16px 18px;
    border: 1px solid #e7def8;
    border-radius: 0.25rem;
    background: linear-gradient(115deg, #f7f3ff 0%, #fbf9ff 52%, #f5f2fd 100%);
}

.vip-invite-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.vip-invite-head-main {
    flex: 1 1 auto;
    min-width: 0;
}

.vip-invite-title {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #7c5bd1;
}

.vip-invite-desc {
    display: block;
    margin-top: 6px;
    font-size: 14px;
    color: var(--fm-text);
}

.vip-invite-rights {
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid #ebe4f8;
}

.vip-invite-rights>b {
    display: block;
    font-size: 14px;
    color: var(--fm-text);
}

.vip-invite-pill {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 10px;
    padding: 6px 12px;
    border-radius: 0.25rem;
    background: var(--fm-tint-purple);
    font-size: 13px;
    color: #7a7096;
}

.vip-invite-pill .vip-invite-icon {
    flex: 0 0 auto;
    width: 15px;
    height: 15px;
    object-fit: contain;
}

.vip-invite-pill a {
    color: #7c5bd1;
}

.vip-invite-pill em {
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.vip-invite-make {
    height: 26px;
    padding: 0 12px;
    border: 0;
    border-radius: 0.25rem;
    background: #7c5bd1;
    font-size: 12px;
    color: #fff;
    cursor: pointer;
}

.vip-invite-make:hover {
    background: #6a49c8;
}

.vip-invite-make:disabled {
    background: #c3b7e4;
    cursor: default;
}

.vip-invite-tabs {
    display: flex;
    gap: 10px;
    margin: 18px 0 12px;
}

.vip-invite-tabs a {
    padding: 7px 16px;
    border: 1px solid #e6e3d8;
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
}

.vip-invite-tabs a.active {
    border-color: #cfd4dc;
    background: #cfd4dc;
}

.vip-invite-table td.uc-empty {
    background: var(--fm-soft-2);
}

.vip-invite-code {
    font-family: Consolas, Menlo, monospace;
    letter-spacing: 1px;
    color: var(--fm-text);
}

/* 前端资源媒体库弹窗（不依赖后台 Bootstrap #mediaModal） */
.fm-modal-mask {
    position: fixed;
    inset: 0;
    z-index: 99990;
    background: rgba(0, 0, 0, .45);
    display: flex;
    align-items: center;
    justify-content: center;
}

.fm-modal-mask[hidden] {
    display: none;
}

.fm-modal {
    background: var(--fm-card);
    border-radius: var(--fm-radius);
    width: min(720px, 92vw);
    max-height: 82vh;
    display: flex;
    flex-direction: column;
    box-shadow: var(--fm-shadow);
    overflow: hidden;
}

.fm-modal-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--fm-line);
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.fm-medialib-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.fm-medialib-upload {
    display: inline-block;
    padding: 5px 12px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: var(--fm-primary);
    border-radius: 6px;
    cursor: pointer;
    user-select: none;
}

.fm-medialib-upload:hover {
    opacity: .88;
}

.fm-medialib-status {
    font-size: 12px;
    font-weight: 400;
    color: var(--fm-muted);
}

.fm-modal-close {
    border: 0;
    background: none;
    font-size: 22px;
    line-height: 1;
    color: var(--fm-text-sub);
    cursor: pointer;
}

.fm-modal-body {
    padding: 16px;
    overflow: auto;
}

.fm-medialib-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
    gap: 10px;
}

.fm-medialib-item {
    display: block;
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    overflow: hidden;
    background: var(--fm-soft);
}

.fm-medialib-item img {
    display: block;
    width: 100%;
    height: 90px;
    object-fit: cover;
}

.fm-medialib-item:hover {
    border-color: var(--fm-primary);
}

.fm-medialib-item-file {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 6px;
    padding: 8px;
    box-sizing: border-box;
    height: 90px;
    text-align: center;
}

.fm-medialib-file-ext {
    font-size: 14px;
    font-weight: 700;
    color: var(--fm-primary);
    background: color-mix(in srgb, var(--fm-primary) 14%, var(--fm-card));
    border-radius: 4px;
    padding: 6px 8px;
    min-width: 42px;
    line-height: 1;
}

.fm-medialib-file-name {
    font-size: 11px;
    color: var(--fm-muted);
    word-break: break-all;
    line-height: 1.3;
    max-height: 2.6em;
    overflow: hidden;
}

/* 举报弹窗 */
.fm-report-modal {
    width: min(400px, 92vw);
    max-height: 86vh;
    overflow-y: auto;
}
.fm-report-form {
    padding: 2px;
}
.fm-report-label {
    display: block;
    margin: 8px 0 5px;
    font-size: 13px;
    color: #444;
    font-weight: 600;
}
.fm-report-label:first-child {
    margin-top: 0;
}
.fm-report-select,
.fm-report-detail {
    width: 100%;
    box-sizing: border-box;
    border: 1px solid #dfe3e8;
    border-radius: 6px;
    padding: 8px 10px;
    font-size: 14px;
    color: #333;
    background: #fff;
    outline: none;
}
.fm-report-select:focus,
.fm-report-detail:focus {
    border-color: var(--fm-primary, #3f9e63);
}
.fm-report-detail {
    resize: vertical;
    line-height: 1.6;
}
.fm-report-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 12px;
}
.fm-btn {
    border: 0;
    border-radius: 6px;
    padding: 8px 16px;
    font-size: 14px;
    cursor: pointer;
    line-height: 1;
}
.fm-btn-primary {
    background: var(--fm-primary, #3f9e63);
    color: #fff;
}
.fm-btn-primary:hover {
    filter: brightness(0.94);
}
.fm-btn-ghost {
    background: #f0f1f3;
    color: #555;
}
.fm-btn-ghost:hover {
    background: #e4e6ea;
}

/* 评论与文章举报入口，颜色跟随主题 */
.floor-report {
    color: var(--fm-primary, #3f9e63);
    text-decoration: none;
    font-size: 13px;
}
.floor-report:hover {
    filter: brightness(0.9);
    text-decoration: underline;
}
.act-report {
    color: var(--fm-primary, #3f9e63) !important;
}
.act-report:hover {
    filter: brightness(0.9) !important;
}

.fm-medialib-loading,
.fm-medialib-empty {
    padding: 24px;
    text-align: center;
    color: var(--fm-muted);
    font-size: 13px;
}

/* 修复 Editor.md 弹窗底部按钮溢出面板：emlog 改版弹窗内容行变多，
   而 createDialog 按插件写死的固定高度（如图片弹窗 254px）设置了行内 height，
   内容超出后 footer 被挤出面板。改为自适应内容高度（仅前台，不影响后台）。 */
#editor-md-dialog .editormd-dialog {
    height: auto !important;
    max-height: 90vh;
    overflow-y: auto;
}

/* 添加图片弹窗：本地上传/资源媒体库按钮行
   image-dialog.js 使用了 Bootstrap 工具类（d-flex/align-items-center/mt-2/mb-3），
   前台未加载 Bootstrap，导致按钮行挤在一起、无间距、与输入框错位 */
#editor-md-dialog .editormd-form .d-flex {
    display: flex;
    align-items: center;
    gap: 10px;
    /* 与输入框左缘对齐：label 浮动宽 75px + 左内边距 5px */
    margin: 10px 0 14px 80px;
}

#editor-md-dialog .editormd-form .d-flex .editormd-file-input {
    margin-left: 0;
}

/* 移动端：编辑器与功能弹窗自适应
   弹窗宽度改为随视口（dialogPosition 按实际渲染宽度居中，并在 resize 时重算），
   表单纵向堆叠、输入框占满行宽，工具栏窄屏可横向滚动 */
@media (max-width: 640px) {
    #editor-md-dialog .editormd-dialog {
        width: 94vw !important;
        min-width: 0 !important;
        max-height: 86vh;
    }

    #editor-md-dialog .editormd-dialog-container {
        padding: 14px 12px;
        box-sizing: border-box;
    }

    #editor-md-dialog .editormd-form label {
        float: none;
        width: auto;
        padding: 6px 0 4px;
    }

    #editor-md-dialog .editormd-form input[type="text"],
    #editor-md-dialog .editormd-form input[type="number"] {
        width: 100%;
        box-sizing: border-box;
    }

    #editor-md-dialog .editormd-form .d-flex {
        flex-wrap: wrap;
        margin-left: 0;
    }

    #editor-md-dialog .editormd-dialog-footer {
        display: flex;
        justify-content: flex-end;
        flex-wrap: wrap;
        gap: 8px;
    }

    /* 资源媒体库弹窗：上传工具行窄屏换行 */
    #forumMediaModal .fm-medialib-toolbar {
        flex-wrap: wrap;
    }

    /* 编辑器工具栏：窄屏一行内横向滚动，避免图标被裁切 */
    #fp-editor .editormd-toolbar {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    #fp-editor .editormd-toolbar-container {
        min-width: max-content;
    }
}

.vip-invite-code:hover {
    color: #7c5bd1;
}

.vip-invite-code.is-used {
    color: var(--fm-muted);
}

.vip-invite-notice {
    margin-top: 16px;
}

body.vip-modal-open {
    overflow: hidden;
}

.vip-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.vip-modal[hidden] {
    display: none;
}

.vip-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(38, 34, 26, .45);
}

.vip-modal-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 440px;
    max-height: 88vh;
    border-radius: 0.375rem;
    background: var(--fm-card);
    box-shadow: 0 22px 56px rgba(0, 0, 0, .2);
    overflow: hidden;
}

.vip-modal-head {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 16px 20px 10px;
}

.vip-modal-head b {
    font-size: 16px;
    color: var(--fm-text-strong);
}

.vip-modal-close {
    padding: 0 4px;
    border: 0;
    background: none;
    font-size: 24px;
    line-height: 1;
    color: #c2bdae;
    cursor: pointer;
}

.vip-modal-close:hover {
    color: var(--fm-text-sub);
}

.vip-modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 4px 20px 20px;
}

.vip-gift {
    margin: 0 0 10px;
    padding: 8px 12px;
    border-radius: 0.25rem;
    background: var(--fm-tint-gold);
    font-size: 13px;
    color: #b98b1f;
}

.vip-gift b {
    color: #e8542f;
}

.vip-price {
    margin-bottom: 14px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.vip-price b {
    font-size: 17px;
    color: #e8542f;
}

.vip-field {
    margin-bottom: 14px;
}

.vip-field>label {
    display: block;
    margin-bottom: 8px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.vip-opts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.vip-opts a {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text-sub);
}

.vip-opts a:hover {
    border-color: #b9a6ea;
    color: #6a49c8;
}

.vip-opts a.active {
    border-color: #7c5bd1;
    background: var(--fm-tint-purple);
    color: #6a49c8;
    font-weight: 600;
}

.vip-note {
    margin: 10px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
    line-height: 1.7;
}

.vip-empty-tip {
    margin: 0;
    font-size: 12.5px;
    color: #d9534f;
}

.vip-modal-foot {
    margin-top: 18px;
}

.vip-pay-btn {
    display: block;
    width: 100%;
    height: 44px;
    border: 0;
    border-radius: 0.25rem;
    background: #7c5bd1;
    color: #fff;
    font-size: 15px;
    cursor: pointer;
}

.vip-pay-btn:hover {
    background: #6a49c8;
}

.vip-pay-btn[disabled] {
    background: #c9c2dd;
    cursor: not-allowed;
}

.vip-manual {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #f0ece1;
    text-align: center;
}

.vip-manual-tip {
    margin: 0 0 10px;
    font-size: 12px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.vip-manual-qr {
    width: 180px;
    height: 180px;
    object-fit: contain;
}

@media (max-width: 640px) {
    .vip-card {
        flex-wrap: wrap;
    }

    .vip-card-btn {
        margin-left: auto;
    }

    .vip-checkin-btn {
        margin-left: 0;
    }
}

.cl-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 32px;
    padding: 0 16px;
    border: 1px solid transparent;
    border-radius: 0.25rem;
    font-size: 13px;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    transition: border-color .15s, color .15s, background-color .15s, filter .15s;
}

.cl-btn:disabled {
    cursor: not-allowed;
}

.cl-btn-main {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.cl-btn-main:not(:disabled):hover {
    filter: brightness(1.06);
    color: #fff;
}

.cl-btn-ghost {
    border-color: var(--fm-border);
    background: var(--fm-card);
    color: var(--fm-text-sub);
}

.cl-btn-ghost:not(:disabled):hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-btn-danger {
    border-color: #df5652;
    background: #df5652;
    color: #fff;
}

.cl-btn-danger:not(:disabled):hover {
    filter: brightness(1.06);
    color: #fff;
}

.cl-btn-danger:disabled {
    border-color: #e3ded0;
    background: var(--fm-soft-2);
    color: #fff;
}

.cl-input,
.cl-textarea,
.cl-select {
    width: 100%;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    transition: border-color .15s, box-shadow .15s;
}

.cl-input,
.cl-select {
    height: 36px;
}

.cl-select {
    padding-right: 6px;
    cursor: pointer;
}

.cl-textarea {
    padding: 8px 10px;
    line-height: 1.7;
    resize: vertical;
}

.cl-input:focus,
.cl-textarea:focus,
.cl-select:focus {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--fm-primary) 12%, transparent);
}

.cl-select-native {
    display: none !important;
}

.cl-select-wrap {
    position: relative;
    display: inline-flex;
    vertical-align: middle;
}

.cl-select-btn {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-width: 128px;
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
    transition: border-color .15s, box-shadow .15s;
}

.cl-select-btn:hover {
    border-color: var(--fm-primary);
}

.cl-select-btn i {
    font-size: 11px;
    color: var(--fm-muted);
    transition: transform .15s;
}

.cl-select-wrap.is-open .cl-select-btn {
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--fm-primary) 12%, transparent);
}

.cl-select-wrap.is-open .cl-select-btn i {
    transform: rotate(180deg);
}

.cl-select-list {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    right: auto;
    min-width: 100%;
    max-height: 260px;
    overflow-y: auto;
    padding: 4px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
    z-index: 30;
}

.cl-select-item {
    display: block;
    padding: 7px 10px;
    border-radius: 0.2rem;
    font-size: 13px;
    color: var(--fm-text);
    white-space: nowrap;
    cursor: pointer;
}

.cl-select-item:hover {
    background: color-mix(in srgb, var(--fm-primary) 10%, transparent);
    color: var(--fm-primary);
}

.cl-select-item.is-active {
    background: var(--fm-primary);
    color: #fff;
}

.cl-bar .cl-select-btn {
    width: 128px;
    height: 32px;
}

.cl-bar .cl-select-list {
    width: 128px;
    min-width: 128px;
}

.cl-field {
    margin-bottom: 14px;
}

.cl-field>label,
.cl-danger-act>label {
    display: block;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-req {
    color: #df5652;
    font-style: normal;
}

.cl-hint {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 6px 0 0;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-count-wrap {
    flex: 0 0 auto;
    color: var(--fm-muted);
}

.cl-muted {
    color: var(--fm-muted);
}

.cl-count {
    font-style: normal;
    color: var(--fm-muted);
}

.cl-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 16px;
}

.cl-sec-title {
    margin: 4px 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-check {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
}

.cl-check input {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}

.cl-check i {
    position: relative;
    display: block;
    width: 20px;
    height: 20px;
    border: 1px solid var(--fm-border);
    border-radius: 4px;
    background: var(--fm-card);
    transition: border-color .15s, background-color .15s;
}

.cl-check input:checked+i {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
}

.cl-check input:checked+i::after {
    content: "";
    position: absolute;
    left: 6px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.cl-modal {
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.cl-modal[hidden] {
    display: none;
}

.cl-modal-mask {
    position: absolute;
    inset: 0;
    background: rgba(40, 36, 26, .45);
}

.cl-modal-box {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 560px;
    max-height: 88vh;
    border-radius: 6px;
    background: var(--fm-card);
    box-shadow: 0 18px 48px rgba(0, 0, 0, .18);
    animation: cl-modal-in .16s ease-out;
}

.cl-modal-narrow {
    max-width: 420px;
}

@keyframes cl-modal-in {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.cl-modal-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 18px 22px 12px;
}

.cl-modal-titles {
    flex: 1 1 auto;
}

.cl-modal-titles b {
    display: block;
    font-size: 16px;
    color: var(--fm-text-strong);
}

.cl-modal-titles span {
    display: block;
    margin-top: 5px;
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.cl-modal-x {
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--fm-muted);
    font-size: 20px;
    line-height: 1;
    cursor: pointer;
    transition: color .15s;
}

.cl-modal-x:hover {
    color: var(--fm-primary);
}

.cl-modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 4px 22px 8px;
}

.cl-modal-foot {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 14px 22px 18px;
}

.cl-warn {
    flex: 1 1 auto;
    font-size: 12.5px;
    font-style: normal;
    color: #df5652;
}

.cl-field-owner .cl-owner,
.cl-owner {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cl-owner b {
    font-size: 13.5px;
    color: var(--fm-text);
}

.cl-slug-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cl-slug-owner {
    flex: 0 0 auto;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.cl-config {
    border: 1px solid var(--fm-line);
    border-radius: 0.375rem;
    overflow: visible;
    margin-bottom: 6px;
}

.cl-config-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border-top: 1px solid var(--fm-line);
}

.cl-config-row:first-child {
    border-top: 0;
}

.cl-config-label {
    min-width: 0;
}

.cl-config-label b {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--fm-text);
}

.cl-config-label b i {
    width: 15px;
    margin-right: 4px;
    color: var(--fm-text-sub);
}

.cl-config-label span {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-config-row .cl-select {
    flex: 0 0 auto;
    width: 190px;
}

.cl-field-inline {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cl-confirm-text {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    padding: 4px 0 8px;
    font-size: 13px;
    line-height: 1.8;
    color: var(--fm-text);
}

.cl-confirm-text>i {
    flex: 0 0 auto;
    margin-top: 4px;
    color: #df5652;
}

.cl-confirm-text>span {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-confirm-text b {
    color: var(--fm-text-strong);
}

.cl-avatar {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    object-fit: cover;
    overflow: hidden;
    background: var(--fm-soft-2);
}

.cl-avatar-sm {
    width: 22px;
    height: 22px;
    font-size: 11px;
}

.cl-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    margin-bottom: 16px;
}

.cl-title {
    margin: 0;
    font-size: 18px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-sub {
    margin: 6px 0 0;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.cl-head-ops {
    display: inline-flex;
    gap: 8px;
}

.cl-empty {
    padding: 44px 0 40px;
    text-align: center;
}

.cl-home-main .cl-empty {
    border-radius: 5px;
    background: var(--fm-soft);
}

.cl-empty i {
    font-size: 44px;
    color: #e4dfd1;
}

.cl-empty p {
    margin: 14px 0 5px;
    font-size: 14px;
    color: var(--fm-text-sub);
}

.cl-empty span {
    font-size: 12.5px;
    color: var(--fm-muted);
}

.cl-empty-pane {
    padding: 70px 0 60px;
}

.cl-empty-pic img {
    display: block;
    width: 150px;
    max-width: 60%;
    height: auto;
    margin: 0 auto;
    opacity: .9;
}

.cl-box {
    border: 1px solid var(--fm-border);
    border-radius: 0.375rem;
    background: var(--fm-card);
    overflow: hidden;
}

.cl-box-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--fm-line);
    background: var(--fm-soft);
}

.cl-box-head b {
    font-size: 13.5px;
    color: var(--fm-text-strong);
}

.cl-box-head span {
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.cl-repos {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cl-repo {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border-top: 1px solid var(--fm-line);
}

.cl-repo:first-child {
    border-top: 0;
}

.cl-repo-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 32px;
    height: 32px;
    border: 1px solid var(--fm-line);
    border-radius: 6px;
    background: var(--fm-soft);
    color: var(--fm-text-sub);
    font-size: 13px;
}

.cl-repo-main {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-repo-line {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cl-repo-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text-strong);
    text-decoration: none;
}

a.cl-repo-name:hover {
    color: var(--fm-primary);
}

.cl-repo-des {
    margin: 5px 0 0;
    font-size: 12.5px;
    color: var(--fm-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-repo-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 7px;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-repo-meta i {
    margin-right: 3px;
}

.cl-repo-ops {
    display: inline-flex;
    flex: 0 0 auto;
    gap: 8px;
}

.cl-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.3em;
    padding: 0.25em 0.4em;
    border-radius: 0.25rem;
    font-size: 75%;
    font-weight: 700;
    font-style: normal;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
}

.cl-badge-private {
    background: var(--fm-soft);
    color: var(--fm-text-sub);
}

.cl-badge-public {
    border: 1px solid var(--fm-line);
    background: var(--fm-soft-2);
    color: var(--fm-primary);
}

.cl-main {
    padding-top: 18px;
}

.cl-home {
    padding: 16px 18px 18px;
    border: 1px solid var(--fm-border);
    border-radius: 5px;
    background: var(--fm-card);
    box-shadow: var(--fm-shadow);
}

.cl-home-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 12px;
    padding: 0 0 14px;
    border-bottom: 1px solid var(--fm-line);
}

.cl-home-brand {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cl-home-logo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    background: var(--fm-primary);
    background: linear-gradient(135deg, color-mix(in srgb, var(--fm-primary) 78%, #fff), var(--fm-primary));
    color: #fff;
    font-size: 18px;
    box-shadow: 0 2px 6px color-mix(in srgb, var(--fm-primary) 35%, transparent);
}

.cl-home-brand h1 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--fm-text-strong);
}

.cl-home-brand p {
    margin: 3px 0 0;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.cl-home-head .cl-btn-main {
    height: 36px;
    padding: 0 18px;
    font-weight: 600;
    border-radius: 6px;
}

.cl-home-layout {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    margin-top: 16px;
}

.cl-home-main {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-home-aside {
    flex: 0 0 280px;
    width: 280px;
    padding-left: 16px;
    border-left: 1px solid var(--fm-line);
}

.cl-bar {
    padding: 0 0 12px;
    margin-bottom: 12px;
}

.cl-bar-row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.cl-tabs {
    display: inline-flex;
    gap: 0;
}

.cl-tabs a + a {
    margin-left: -1px;
}

.cl-tabs a:first-child {
    border-radius: 0.25rem 0 0 0.25rem;
}

.cl-tabs a:last-child {
    border-radius: 0 0.25rem 0.25rem 0;
}

.cl-tabs a.active {
    position: relative;
    z-index: 1;
}

.cl-tabs a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 32px;
    padding: 0 16px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 13px;
    color: var(--fm-text);
    transition: border-color .15s, color .15s, background-color .15s;
}

.cl-tabs a:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-tabs a.active {
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.cl-bar-search {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 220px;
    min-width: 180px;
}

.cl-bar-search>i {
    position: absolute;
    left: 11px;
    color: var(--fm-muted);
    font-size: 12px;
}

.cl-bar-search input {
    flex: 1 1 auto;
    height: 34px;
    padding: 0 10px 0 30px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 13px;
}

.cl-bar-search input:focus {
    border-color: var(--fm-primary);
    background: var(--fm-card);
}

.cl-bar-search .cl-btn {
    margin-left: 8px;
    height: 34px;
}

.cl-bar .cl-select {
    flex: 0 0 auto;
    width: 128px;
    height: 32px;
}

.cl-list {
    list-style: none;
    margin: 0;
    padding: 0;
    background: transparent;
}

.cl-item {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid var(--fm-border);
    border-radius: 5px;
    background: var(--fm-card);
    box-shadow: var(--fm-shadow);
    margin-top: 10px;
}

.cl-item:first-child {
    margin-top: 0;
}

.cl-item-main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
}

.cl-item-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border: 1px solid var(--fm-line);
    border-radius: 7px;
    background: var(--fm-soft);
    color: var(--fm-text-sub);
    font-size: 14px;
}

.cl-item-ico:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-item-body {
    min-width: 0;
}

.cl-item-title {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cl-item-title a {
    font-size: 14px;
    color: var(--fm-text-strong);
    text-decoration: none;
}

.cl-item-title a b {
    color: var(--fm-primary);
    font-weight: 600;
}

.cl-item-owner {
    color: var(--fm-text-sub);
}

.cl-item-title em {
    color: var(--fm-muted);
    font-style: normal;
}

.cl-item-title b {
    font-weight: 600;
}

.cl-item-des {
    margin: 5px 0 0;
    font-size: 12.5px;
    color: var(--fm-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-item-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 14px;
    margin-top: 8px;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-item-meta i {
    margin-right: 3px;
}

.cl-item-meta em {
    font-style: normal;
}

.cl-lang {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-style: normal;
    color: var(--fm-text-sub);
}

.cl-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
}

.cl-item-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
    align-self: stretch;
    flex: 0 0 auto;
    gap: 10px;
}

.cl-star {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 28px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 12.5px;
    color: var(--fm-text-sub);
    text-decoration: none;
    cursor: pointer;
    transition: border-color .15s, color .15s;
}

.cl-star:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-star em {
    font-style: normal;
    color: var(--fm-muted);
    margin-left: 2px;
    padding-left: 9px;
    border-left: 1px solid var(--fm-border);
}

.cl-star.is-on {
    border-color: #e8c25a;
    background: var(--fm-tint-gold);
    color: #b98b1f;
}

.cl-star.is-on em {
    color: #b98b1f;
}

.cl-item-time {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-side-box {
    margin-bottom: 0;
}

.cl-side-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 0 0 12px;
}

.cl-side-head-wrap {
    flex-wrap: wrap;
}

.cl-side-head-wrap > b {
    flex: 1 1 auto;
}

.cl-side-head-wrap > span {
    flex: 0 0 100%;
}

.cl-side-head b {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--fm-text-strong);
}

.cl-side-head span {
    display: block;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-side-head a {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.cl-side-head a:hover {
    color: var(--fm-primary);
}

.cl-side-btns {
    display: flex;
    align-items: center;
    gap: 0;
    flex: 0 0 auto;
}

.cl-side-btn {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 26px;
    padding: 0 10px;
    border: 1px solid var(--fm-border);
    background: var(--fm-card);
    font-size: 12px;
    color: var(--fm-text);
    text-decoration: none;
    transition: border-color .15s, color .15s;
}

.cl-side-btn:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-side-btn + .cl-side-btn {
    margin-left: -1px;
}

.cl-side-btn:first-child {
    border-radius: 0.25rem 0 0 0.25rem;
}

.cl-side-btn:last-child {
    border-radius: 0 0.25rem 0.25rem 0;
}

.cl-side-head .cl-side-btn {
    color: var(--fm-text);
}

.cl-side-head .cl-side-btn:hover {
    color: var(--fm-primary);
}

.cl-side-head .cl-side-btn-main,
.cl-side-head .cl-side-btn-main:hover {
    color: #fff;
}

.cl-side-btn-main {
    position: relative;
    z-index: 1;
    border-color: var(--fm-primary);
    background: var(--fm-primary);
    color: #fff;
}

.cl-side-btn-main:hover {
    background: var(--fm-primary);
    color: #fff;
    opacity: .88;
}

.cl-side-empty {
    padding: 26px 0;
    text-align: center;
    font-size: 12.5px;
    color: var(--fm-muted);
}

.cl-side-empty-star {
    padding: 36px 0 32px;
}

.cl-side-empty-star i {
    display: block;
    margin-bottom: 10px;
    font-size: 34px;
    color: #d8d3c2;
}

.cl-side-empty-star p {
    margin: 0;
    font-size: 12.5px;
    color: var(--fm-muted);
}

.cl-feed {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cl-feed li {
    padding: 12px 0;
    border-top: 1px solid var(--fm-line);
}

.cl-feed li:first-child {
    border-top: 0;
}

.cl-feed-top {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cl-feed-user {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.cl-feed-user > span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-feed-user b {
    color: var(--fm-text);
}

.cl-feed-user .cl-feed-time {
    display: block;
    margin-top: 3px;
}

.cl-feed-repo {
    display: block;
    margin: 8px 0 0 34px;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--fm-primary);
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-feed-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin: 7px 0 0 34px;
    padding: 6px 10px;
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 12px;
    color: var(--fm-text-sub);
}

.cl-feed-note {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-feed-strip em {
    flex: 0 0 auto;
    font-style: normal;
    font-size: 11.5px;
    color: var(--fm-muted);
}

.cl-feed-time {
    flex: 0 0 auto;
    font-size: 11.5px;
    font-style: normal;
    color: var(--fm-muted);
}

.cl-detail-head {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    padding: 16px 0 10px;
}

.cl-crumb {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.cl-crumb-ico {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 7px;
    background: var(--fm-primary);
    color: #fff;
    font-size: 13px;
}

.cl-crumb-owner {
    color: var(--fm-text-sub);
    font-size: 13.5px;
}

.cl-crumb em {
    color: var(--fm-muted);
    font-style: normal;
}

.cl-crumb b {
    font-size: 15px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-crumb-badge {
    margin-left: auto;
}

.cl-detail-ops {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-left: auto;
    align-self: center;
    height: 42px;
    padding: 0;
    position: relative;
    z-index: 2;
}

.cl-stat {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 12.5px;
    color: var(--fm-text);
    cursor: pointer;
    transition: border-color .15s, color .15s;
}

.cl-stat:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-stat em {
    font-style: normal;
    color: var(--fm-text);
    font-weight: 600;
    padding-left: 10px;
    margin-left: 2px;
    border-left: 1px solid var(--fm-border);
}

.cl-stat.is-on {
    border-color: #e8c25a;
    background: var(--fm-tint-gold);
    color: #b98b1f;
}

.cl-stat.is-on em {
    color: #b98b1f;
}

.cl-detail-tabs {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    padding: 0;
    border-bottom: 1px solid var(--fm-border);
}

.cl-detail-tabs a {
    position: relative;
    padding: 10px 14px;
    font-size: 13.5px;
    color: var(--fm-text-sub);

    box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0);
    margin-bottom: -1px;
    text-decoration: none;
}

.cl-detail-tabs a i {
    margin-right: 6px;
    color: #9a967f;
}

.cl-detail-tabs a:hover i,
.cl-detail-tabs a.active i {
    color: var(--fm-primary);
}

.cl-detail-tabs a:hover {
    color: var(--fm-primary);
}

.cl-detail-tabs a.active {
    color: var(--fm-primary);
    font-weight: 600;
    box-shadow: inset 0 -2px 0 var(--fm-primary);
}

.cl-detail-grid {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 0 0;
}

.cl-detail-main {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-detail-aside {
    flex: 0 0 280px;
    width: 280px;
}

.cl-aside-sec {
    padding: 16px 0 18px;
    border-bottom: 1px solid var(--fm-line);
}

.cl-aside-sec:first-child {
    padding-top: 2px;
}

.cl-aside-sec:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.cl-aside-sec h4 {
    margin: 0 0 10px;
    font-size: 14px;
    font-weight: 700;
    color: var(--fm-text-strong);
}

.cl-about {
    margin: 0;
    font-size: 13px;
    line-height: 1.7;
    color: var(--fm-text-sub);
    word-break: break-word;
}

.cl-stat-list {
    list-style: none;
    margin: 12px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.cl-stat-list li {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    line-height: 1.4;
}

.cl-stat-list li i {
    flex: 0 0 auto;
    width: 16px;
    text-align: center;
    font-size: 13px;
    color: var(--fm-muted);
}

.cl-stat-list li b {
    font-weight: 700;
    color: var(--fm-text-strong);
}

.cl-stat-list li span {
    color: var(--fm-text-sub);
}

.cl-upd {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.cl-upd i {
    color: var(--fm-muted);
}

.cl-aside-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size: 12.5px;
    color: var(--fm-primary);
    text-decoration: none;
}

.cl-rel {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    text-decoration: none;
    color: var(--fm-text-strong);
}

.cl-rel i {
    color: var(--fm-primary);
}

.cl-rel b {
    font-weight: 600;
}

.cl-rel em {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-rel-name {
    margin: 8px 0 0;
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.cl-avatar-md {
    width: 36px;
    height: 36px;
    font-size: 14px;
}

.cl-author {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: var(--fm-text-strong);
    font-size: 14px;
}

.cl-author b {
    font-weight: 600;
}

.cl-author:hover b {
    color: var(--fm-primary);
}

.cl-repo-toolbar {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.cl-branch {
    flex: 0 0 auto;
}

.cl-branch-repo {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: 10px;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--fm-text-strong);
    text-decoration: none;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-branch-repo:hover {
    color: var(--fm-primary);
}

.cl-branch-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    background: var(--fm-card);
    color: var(--fm-text-strong);
    font-size: 13px;
    cursor: pointer;
}

.cl-branch-btn i:first-child {
    color: var(--fm-muted);
}

.cl-branch-btn b {
    font-weight: 600;
}

.cl-branch-btn:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-repo-ops {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-left: auto;
}

.cl-files {
    border: 1px solid var(--fm-line);
    border-radius: 0.375rem;
    overflow: hidden;
}

.cl-files-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 14px;
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-line);
    border-radius: 0.375rem 0.375rem 0 0;
    font-size: 13px;
}

.cl-commit-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 14px;
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-line);
    border-radius: 0.375rem 0.375rem 0 0;
    font-size: 13px;
    min-width: 0;
}

.cl-files-head:not(:first-child) {
    border-radius: 0;
}

.cl-commit-bar b {
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-commit-bar .cl-commit-msg {
    color: var(--fm-text-sub);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}

.cl-commit-bar em {
    margin-left: auto;
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
    white-space: nowrap;
}

.cl-upload-panel {
    padding: 14px;
    border-bottom: 1px solid var(--fm-line);
    background: var(--fm-card);
}

.cl-up-drop {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 34px 16px;
    border: 1px dashed var(--fm-border);
    border-radius: 6px;
    background: var(--fm-soft);
    text-align: center;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease;
}

.cl-up-drop:hover,
.cl-up-drop:focus-visible,
.cl-up-drop.is-over {
    border-color: var(--fm-primary);
    background: var(--fm-tint-green);
}

.cl-up-drop i {
    font-size: 22px;
    color: var(--fm-muted);
}

.cl-up-drop.is-over i {
    color: var(--fm-primary);
}

.cl-up-drop b {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-up-drop em {
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.cl-up-msg {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 12px;
}

.cl-up-msg label {
    font-size: 13px;
    color: var(--fm-text-strong);
    white-space: nowrap;
}

.cl-up-msg .cl-input {
    flex: 1 1 auto;
}

.cl-up-foot {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

.cl-files-head b {
    color: var(--fm-text-strong);
}

.cl-files-head em {
    color: var(--fm-muted);
    font-style: normal;
    margin: 0 2px;
}

.cl-files-head span {
    font-size: 12px;
    color: var(--fm-text-sub);
}

.cl-drop {
    position: relative;
    display: inline-flex;
}

.cl-drop-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 30;
    min-width: 200px;
    padding: 6px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    box-shadow: var(--fm-shadow);
}

.cl-drop-menu button {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 10px;
    border: 0;
    border-radius: 5px;
    background: none;
    text-align: left;
    cursor: pointer;
    color: var(--fm-text-strong);
}

.cl-drop-menu button:hover {
    background: var(--fm-soft);
}

.cl-drop-menu button i {
    font-size: 14px;
    color: var(--fm-text-sub);
}

.cl-drop-menu button b {
    display: block;
    font-size: 13px;
    font-weight: 600;
}

.cl-drop-menu button em {
    display: block;
    margin-top: 1px;
    font-size: 11.5px;
    font-style: normal;
    color: var(--fm-muted);
}

.cl-file-row.is-dir i {
    color: var(--fm-primary);
}

.cl-file-row.is-dir span {
    font-weight: 600;
}

.cl-files-crumb {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px;
    min-width: 0;
}

.cl-files-crumb a {
    color: var(--fm-text-strong);
    text-decoration: none;
}

.cl-files-crumb a:hover {
    color: var(--fm-primary);
}

.cl-files-crumb em {
    color: var(--fm-muted);
    font-style: normal;
}

.cl-files-crumb .cl-files-up {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: 10px;
    padding: 2px 8px;
    font-size: 12px;
    color: var(--fm-text-sub);
    border: 1px solid var(--fm-border);
    border-radius: 4px;
}

.cl-files-crumb .cl-files-up:hover {
    color: var(--fm-primary);
    border-color: var(--fm-primary);
}

.cl-fileview {
    border: 1px solid var(--fm-line);
    border-radius: 0.375rem;
    overflow: hidden;
}

.cl-fileview-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 11px 14px;
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-line);
    flex-wrap: wrap;
}

.cl-fileview-ops {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.cl-fileview-meta {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 9px 14px;
    background: var(--fm-card);
    border-bottom: 1px solid var(--fm-line);
    font-size: 12px;
    color: var(--fm-text-sub);
}

.cl-fileview-meta span i {
    margin-right: 4px;
}

.cl-code {
    margin: 0;
    padding: 16px;
    background: var(--fm-card);
    max-height: 70vh;
    overflow: auto;
    font-size: 13px;
    line-height: 1.6;
}

.cl-code-block {
    font-family: Consolas, Monaco, 'Courier New', monospace;
    white-space: pre;
}

.cl-editor {
    padding: 14px;
    background: var(--fm-card);
}

.cl-editor-area {
    width: 100%;
    font-family: Consolas, Monaco, 'Courier New', monospace;
    font-size: 13px;
    line-height: 1.6;
    resize: vertical;
}

.cl-editor-ops {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 12px;
}

.cl-his {
    display: flex;
    align-items: flex-start;
    gap: 14px;
}

.cl-his-left {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-his-right {
    display: none;
}

.cl-his.is-pick .cl-his-left {
    flex: 0 0 300px;
    width: 300px;
}

.cl-his.is-pick .cl-his-right {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
}

.cl-his-sec {
    margin-bottom: 14px;
}

.cl-his-sec:last-child {
    margin-bottom: 0;
}

.cl-his-loading {
    padding: 70px 20px;
    text-align: center;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.cl-his-loading i {
    margin-right: 6px;
}

.cl-his-loading.is-error {
    color: #d9534f;
}

.cl-his-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 14px;
    border-bottom: 1px solid var(--fm-line);
}

.cl-his-head b {
    font-size: 14.5px;
    color: var(--fm-text-strong);
}

.cl-his-head em {
    font-style: normal;
    font-size: 12.5px;
    color: var(--fm-muted);
}

.cl-his-refresh {
    margin-left: auto;
    color: var(--fm-muted);
    text-decoration: none;
}

.cl-his-refresh:hover {
    color: var(--fm-primary);
}

.cl-his-list {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 640px;
    overflow-y: auto;
}

.cl-his-item {
    border-top: 1px solid var(--fm-line);
}

.cl-his-item:first-child {
    border-top: 0;
}

.cl-his-row {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    width: 100%;
    padding: 12px 14px;
    border: 0;
    border-left: 3px solid transparent;
    background: transparent;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}

.cl-his-row:hover {
    background: var(--fm-soft);
}

.cl-his-row.is-active {
    border-left-color: var(--fm-primary);
    background: color-mix(in srgb, var(--fm-primary) 6%, transparent);
}

.cl-his-ico {
    flex: 0 0 auto;
    padding-top: 2px;
    color: var(--fm-muted);
}

.cl-his-row.is-active .cl-his-ico {
    color: var(--fm-primary);
}

.cl-his-body {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-his-body b {
    display: block;
    font-size: 13.5px;
    font-weight: 600;
    color: var(--fm-text-strong);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cl-his-body span {
    display: block;
    margin-top: 4px;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.cl-his-hash {
    flex: 0 0 auto;
    margin-left: auto;
    padding-top: 2px;
    font-style: normal;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 11.5px;
    color: var(--fm-muted);
}

.cl-his-meta {
    list-style: none;
    margin: 0;
    padding: 12px 14px;
}

.cl-his-meta li {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    line-height: 2.1;
}

.cl-his-meta span {
    flex: 0 0 76px;
    color: var(--fm-text-sub);
}

.cl-his-meta b {
    min-width: 0;
    font-weight: 500;
    color: var(--fm-text-strong);
    word-break: break-all;
}

.cl-his-meta li:first-child b {
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.cl-his-meta em {
    margin-left: auto;
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
    font-family: Consolas, Monaco, "Courier New", monospace;
}

.cl-his-ops {
    display: flex;
    gap: 10px;
    padding: 0 14px 14px;
}

.cl-his-files {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.cl-his-files th {
    padding: 9px 14px;
    text-align: left;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--fm-text-sub);
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-line);
}

.cl-his-files th:nth-child(2),
.cl-his-files th:nth-child(3) {
    width: 90px;
    text-align: right;
}

.cl-his-files td {
    padding: 9px 14px;
    border-bottom: 1px solid #f2f0e8;
    color: var(--fm-text);
    word-break: break-all;
}

.cl-his-files td:nth-child(2),
.cl-his-files td:nth-child(3) {
    text-align: right;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 12.5px;
}

.cl-his-files tbody tr:last-child td {
    border-bottom: 0;
}

.cl-his-files td i {
    margin-right: 6px;
    color: var(--fm-muted);
    font-size: 11px;
}

.cl-his-add {
    color: #1e7a3c;
    font-style: normal;
}

.cl-his-del {
    color: #d9534f;
    font-style: normal;
}

.cl-his-sum td {
    background: var(--fm-soft);
    font-weight: 600;
}

.cl-his-none {
    margin: 0;
    padding: 22px 14px;
    text-align: center;
    font-size: 13px;
    color: var(--fm-muted);
}

.cl-his-diffs {
    padding: 12px 14px;
}

.cl-his-file {
    margin-bottom: 10px;
    border: 1px solid var(--fm-line);
    border-radius: 0.25rem;
    overflow: hidden;
}

.cl-his-file:last-child {
    margin-bottom: 0;
}

.cl-his-file summary {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 9px 12px;
    background: var(--fm-soft);
    font-size: 13px;
    color: var(--fm-text);
    cursor: pointer;
    list-style: none;
}

.cl-his-file summary::-webkit-details-marker {
    display: none;
}

.cl-his-file summary i {
    color: var(--fm-muted);
}

.cl-his-file-arrow {
    flex: 0 0 auto;
    font-size: 12px;
    transition: transform .18s;
}

.cl-his-file[open] .cl-his-file-arrow {
    transform: rotate(90deg);
}

.cl-his-file summary em {
    font-style: normal;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 12.5px;
}

.cl-his-file summary em:first-of-type {
    margin-left: auto;
}

.cl-his-lines {
    width: 100%;
    border-collapse: collapse;
    font-family: Consolas, Monaco, "Courier New", monospace;
    font-size: 12.5px;
    background: var(--fm-card);
}

.cl-his-lines td {
    padding: 2px 8px;
    vertical-align: top;
}

.cl-his-ln {
    width: 42px;
    text-align: right;
    color: var(--fm-muted);
    background: var(--fm-soft);
    user-select: none;
}

.cl-his-code {
    white-space: pre-wrap;
    word-break: break-all;
    color: var(--fm-text);
}

.cl-his-code em {
    display: inline-block;
    width: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.cl-his-line.is-add {
    background: var(--fm-tint-green);
}

.cl-his-line.is-add .cl-his-code,
.cl-his-line.is-add .cl-his-code em {
    color: #1e7a3c;
}

.cl-his-line.is-del {
    background: var(--fm-tint-red);
}

.cl-his-line.is-del .cl-his-code,
.cl-his-line.is-del .cl-his-code em {
    color: #a33;
}

.cl-his-hunk td {
    padding: 4px 8px;
    background: var(--fm-tint-blue);
    color: #4f7bbd;
    font-size: 12px;
}

.cl-release-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.cl-release-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 2px 2px 10px;
}

.cl-release-head b {
    font-size: 15px;
    color: var(--fm-text-strong);
}

.cl-release-head b i {
    margin-right: 6px;
    color: var(--fm-primary);
}

.cl-release {
    padding: 16px;
    border: 1px solid var(--fm-line);
    border-radius: 0.375rem;
    background: var(--fm-card);
}

.cl-release-tag {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.cl-release-name {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: var(--fm-primary);
    border-radius: 20px;
}

.cl-release-tag em {
    font-style: normal;
    font-size: 12px;
    color: var(--fm-text-sub);
}

.cl-release-title {
    display: block;
    margin-top: 10px;
    font-size: 15px;
    color: var(--fm-text-strong);
}

.cl-release-des {
    margin: 8px 0 0;
    font-size: 13px;
    color: #6f6c5f;
    white-space: pre-wrap;
}

.cl-release-ops {
    display: flex;
    gap: 8px;
    margin-top: 14px;
}

.cl-file-row {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    font-size: 13px;
    color: var(--fm-text);
}

.cl-file-row i {
    color: var(--fm-text-sub);
}

.cl-file-row em {
    margin-left: auto;
    font-size: 12px;
    font-style: normal;
    color: var(--fm-muted);
}

.cl-file-none {
    padding: 26px 14px;
    text-align: center;
    font-size: 12.5px;
    color: var(--fm-muted);
}

.cl-readme {
    margin-top: 16px;
    border: 1px solid var(--fm-line);
    border-radius: 0.375rem;
    overflow: hidden;
    background: var(--fm-card);
}

.cl-readme-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 14px;
    background: var(--fm-soft);
    border-bottom: 1px solid var(--fm-line);
    font-size: 13px;
    color: var(--fm-text-strong);
}

.cl-readme-head i {
    color: var(--fm-text-sub);
    margin-right: 6px;
}

.cl-readme-ops {
    display: flex;
    align-items: center;
    gap: 12px;
}

.cl-readme-ops a {
    color: var(--fm-text-sub);
    font-size: 12.5px;
    text-decoration: none;
}

.cl-readme-ops a:hover {
    color: var(--fm-primary);
}

.cl-readme-body {
    padding: 16px 18px;
    font-size: 13.5px;
    line-height: 1.9;
    color: var(--fm-text);
}

.cl-readme-body > :first-child {
    margin-top: 0;
}

.cl-readme-body > :last-child {
    margin-bottom: 0;
}

.cl-author-repos {
    padding: 0;
}

.cl-author-repos-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--fm-line);
    font-size: 14px;
}

.cl-author-repos-head b {
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-author-repos-head span {
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-author-repos-none {
    padding: 34px 18px;
    text-align: center;
    font-size: 13px;
    color: var(--fm-muted);
}

.cl-author-repos-list {
    list-style: none;
    margin: 0;
    padding: 12px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.cl-author-repo {
    padding: 14px;
    border: 1px solid var(--fm-line);
    border-radius: 0.375rem;
    transition: border-color 0.15s ease;
}

.cl-author-repo:hover {
    border-color: var(--fm-border);
}

.cl-author-repo-top {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cl-author-repo-top a {
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-primary);
    text-decoration: none;
}

.cl-author-repo-des {
    margin: 7px 0 0;
    font-size: 13px;
    color: var(--fm-text-sub);
    line-height: 1.7;
}

.cl-author-repo-meta {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 10px;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-author-repo-meta span i {
    margin-right: 3px;
}

.cl-dc {
    margin-top: 0;
}

.cl-dc-head {
    background: var(--fm-card);
    padding: 14px 18px;
}

.cl-dc-head-main b {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--fm-text-strong);
}

.cl-dc-head-main span {
    display: block;
    margin-top: 3px;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-dc-total {
    flex: 0 0 auto;
    font-style: normal;
    font-size: 12.5px;
    color: var(--fm-muted);
}

.cl-dc-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cl-dc-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 18px;
    border-top: 1px solid var(--fm-line);
}

.cl-dc-item:first-child {
    border-top: 0;
}

.cl-dc-main {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-dc-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
    font-size: 12.5px;
    color: var(--fm-muted);
}

.cl-dc-line b {
    font-size: 13.5px;
    color: var(--fm-text-strong);
}

.cl-dc-owner {
    padding: 1px 6px;
    border-radius: 3px;
    background: color-mix(in srgb, var(--fm-primary) 12%, transparent);
    color: var(--fm-primary);
    font-size: 11px;
}

.cl-dc-floor {
    font-style: normal;
    color: var(--fm-muted);
}

.cl-dc-re,
.cl-dc-line time {
    color: var(--fm-muted);
}

.cl-dc-reply-btn,
.cl-dc-del {
    color: var(--fm-text-sub);
    text-decoration: none;
}

.cl-dc-reply-btn:hover {
    color: var(--fm-primary);
}

.cl-dc-del:hover {
    color: #d9534f;
}

.cl-dc-text {
    margin-top: 7px;
    font-size: 13.5px;
    line-height: 1.9;
    color: var(--fm-text);
    word-break: break-word;
}

.cl-dc-text img.cl-dc-img {
    display: block;
    max-width: 100%;
    margin: 8px 0 0;
    border-radius: 0.25rem;
}

.cl-dc-at {
    color: var(--fm-primary);
}

.cl-dc-replies {
    list-style: none;
    margin: 10px 0 0;
    padding: 4px 12px;
    border-radius: 0.25rem;
    background: var(--fm-soft);
}

.cl-dc-replies>li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 10px 0;
    border-top: 1px dashed var(--fm-line);
}

.cl-dc-replies>li:first-child {
    border-top: 0;
}

.cl-dc-composer {
    padding: 16px 18px;
    border-top: 1px solid var(--fm-line);
}

.cl-dc-comp-head h4 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--fm-text-strong);
}

.cl-dc-comp-head span {
    display: block;
    margin: 3px 0 12px;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-dc-login {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px 16px;
    background: var(--fm-soft);
    border-radius: 0.25rem;
}

.cl-dc-login p {
    margin: 0;
    font-size: 13.5px;
    color: var(--fm-text);
}

.cl-dc-login .cl-btn {
    flex: 0 0 auto;
}

.cl-dc-comp-body {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.cl-dc-comp-main {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-dc-input {
    width: 100%;
    min-height: 110px;
}

.cl-dc-tip {
    margin-top: 8px;
    padding: 7px 10px;
    border-radius: 0.25rem;
    background: var(--fm-soft);
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.cl-dc-tip a {
    color: var(--fm-primary);
    text-decoration: none;
}

.cl-dc-tools {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-top: 10px;
}

.cl-dc-tools-left {
    display: flex;
    align-items: center;
    gap: 14px;
}

.cl-dc-tool {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12.5px;
    color: var(--fm-text-sub);
    text-decoration: none;
}

.cl-dc-tool:hover {
    color: var(--fm-primary);
}

.cl-dc-count {
    margin-left: auto;
    font-style: normal;
    font-size: 12px;
    color: var(--fm-muted);
}

.cl-dc-count b {
    font-weight: 600;
    color: var(--fm-text-sub);
}

.cl-modal-dcimg {
    max-width: 480px;
}

.cl-dc-imgrow {
    display: flex;
    align-items: center;
    gap: 8px;
}

.cl-dc-imgrow .cl-input {
    flex: 1 1 auto;
    min-width: 0;
}

.cl-dc-imgup {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 38px;
    height: 38px;
    border: 1px solid var(--fm-border);
    border-radius: 0.25rem;
    background: var(--fm-card);
    font-size: 14px;
    color: var(--fm-text-sub);
    cursor: pointer;
    transition: border-color .15s, color .15s;
}

.cl-dc-imgup:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.cl-dc-imgsize {
    align-items: flex-start;
}

.cl-dc-imgsize .cl-field {
    flex: 1 1 0;
    min-width: 0;
    margin-bottom: 0;
}

.cl-item-version {
    color: var(--fm-text-sub);
}

.cl-item-version i {
    color: var(--fm-muted);
}

.cl-form {
    border: 1px solid var(--fm-line);
    border-radius: 0.375rem;
    padding: 18px;
}

.cl-form-title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    font-size: 14px;
    font-weight: 600;
    color: var(--fm-text-strong);
}

.cl-form-title i {
    color: var(--fm-text-sub);
}

.cl-form-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: 4px;
}

.cl-danger {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 18px;
    margin-top: 18px;
    padding: 18px;
    border: 1px solid #f0d3d1;
    border-radius: 0.375rem;
    background: var(--fm-tint-red);
}

.cl-danger-text {
    flex: 1 1 300px;
    min-width: 0;
}

.cl-danger-text b {
    font-size: 14px;
    color: #d9534f;
}

.cl-danger-text p {
    margin: 8px 0 0;
    font-size: 12.5px;
    line-height: 1.8;
    color: var(--fm-text-sub);
}

.cl-danger-act {
    flex: 0 0 300px;
    width: 300px;
}

.cl-danger-act>label {
    font-weight: 400;
    font-size: 12.5px;
    color: var(--fm-text-sub);
}

.cl-danger-act>label b {
    color: #d9534f;
}

.cl-danger-act .cl-input {
    margin-bottom: 10px;
}

.cl-danger-act .cl-btn {
    width: 100%;
}

.cl-danger-tip {
    display: block;
    margin-top: 8px;
    font-size: 12px;
    font-style: normal;
    color: #d9534f;
}

.cl-danger-tip[hidden] {
    display: none;
}

@media (max-width: 900px) {
    .cl-home-layout {
        flex-wrap: wrap;
    }

    .cl-home-aside {
        flex: 1 1 100%;
        width: 100%;
        padding: 14px 0 0;
        border-left: 0;
        border-top: 1px solid var(--fm-line);
    }

    .cl-detail-grid {
        flex-direction: column;
        gap: 12px;
        padding: 14px 0 0;
    }

    .cl-detail-aside {
        flex: 1 1 auto;
        width: 100%;
    }

    .cl-his {
        flex-direction: column;
        gap: 12px;
    }

    .cl-his-left,
    .cl-his.is-pick .cl-his-left {
        flex: 1 1 auto;
        width: 100%;
    }

    .cl-his-list {
        max-height: none;
    }
}

@media (max-width: 640px) {

    .cl-modal-box {
        min-width: 0;
        max-width: 100%;
    }

    .cl-modal-body,
    .ceh-body {
        min-width: 0;
    }

    .ceh-body {
        flex-direction: column;
        min-height: 0;
        max-height: none;
    }

    .ceh-list {
        flex: 0 0 auto;
        max-height: 180px;
        border-right: 0;
        border-bottom: 1px solid var(--fm-line);
    }

    .ceh-diff {
        padding: 10px 12px 14px;
    }

    .ceh-diff-table {
        display: block;
        overflow-x: auto;
    }

    .cl-grid-2 {
        grid-template-columns: 1fr;
    }

    .cl-head {
        flex-wrap: nowrap;
        align-items: flex-start;
        gap: 10px;
    }

    .cl-head-title {
        flex: 1 1 auto;
        min-width: 0;
    }

    .cl-title {
        font-size: 17px;
    }

    .cl-sub {
        font-size: 12px;
    }

    .cl-head-ops {
        flex: 0 0 auto;
        gap: 6px;
    }

    .cl-head-ops .cl-btn {
        height: 30px;
        padding: 0 9px;
        gap: 4px;
        font-size: 12px;
    }

    .cl-item {
        flex-wrap: wrap;
    }

    .cl-item-side {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        width: 100%;
    }

    .cl-repo {
        flex-wrap: wrap;
    }

    .cl-repo-ops {
        width: 100%;
        margin-left: 0;
        justify-content: flex-start;
    }

    .cl-config-row {
        flex-wrap: wrap;
    }

    .cl-config-row .cl-select {
        width: 100%;
    }

    .cl-modal {
        padding: 14px;
    }

    .cl-danger-act {
        flex: 1 1 100%;
        width: 100%;
    }

    .cl-bar .cl-select {
        width: calc(50% - 5px);
    }

    .cl-dc-login {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    .cl-dc-login p {
        text-align: center;
    }
}

.lk-panel {
    padding: 0;
}

.lk-head {
    text-align: center;
}

.lk-title {
    position: relative;
    margin: 0 0 14px;
    padding-bottom: 12px;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: .5px;
    color: var(--fm-text-strong);
}

.lk-title::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 34px;
    height: 3px;
    margin-left: -17px;
    background: var(--fm-primary);
    border-radius: 3px;
}

.lk-intro {
    margin: 0 0 18px;
    font-size: 13px;
    color: var(--fm-primary);
    line-height: 1.8;
}

.lk-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 18px;
}

.lk-search {
    position: relative;
    flex: 0 1 320px;
}

.lk-search i {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--fm-muted);
    font-size: 13px;
}

.lk-search input {
    width: 100%;
    height: 40px;
    padding: 0 16px 0 36px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 5px;
    box-shadow: 0 1px 2px rgba(60, 55, 40, .04);
    color: var(--fm-text);
    font-size: 13px;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.lk-search input:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px var(--fm-primary-light);
}

.lk-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 40px;
    padding: 0 22px;
    border: 1px solid transparent;
    border-radius: 5px;
    background: var(--fm-card);
    color: var(--fm-text-sub);
    font-size: 13px;
    cursor: pointer;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.lk-btn-main {
    background: var(--fm-primary);
    box-shadow: 0 4px 12px var(--fm-primary-light);
    color: #fff;
}

.lk-btn-main:hover {
    background: var(--fm-primary-dark);
    color: #fff;
}

.lk-btn-ghost {
    border-color: var(--fm-border);
}

.lk-btn-ghost:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.lk-content {
    margin: 0 0 16px;
    font-size: 13px;
    color: #7d7a6d;
    line-height: 1.9;
    text-align: left;
}

.lk-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 14px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.lk-card {
    min-width: 0;
}

.lk-card-in {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 9px;
    height: 100%;
    padding: 16px 10px 14px;
    background: var(--fm-card);
    border: 1px solid rgba(60, 55, 40, .04);
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(60, 55, 40, .04);
    text-align: center;
    transition: box-shadow .18s ease, transform .18s ease, border-color .18s ease;
}

.lk-card-in:hover {
    border-color: var(--fm-primary-light);
    box-shadow: 0 10px 24px rgba(60, 55, 40, .13);
    transform: translateY(-3px);
}

.lk-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 54px;
    overflow: hidden;
}

.lk-logo img {
    width: auto;
    max-width: 100%;
    max-height: 54px;
    object-fit: contain;
}

.lk-letter {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    border-radius: 12px;
    color: #fff;
    font-size: 20px;
    font-style: normal;
    font-weight: 600;
}

.lk-name {
    max-width: 100%;
    overflow: hidden;
    color: #6f6d63;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.lk-empty {
    padding: 40px 0;
    color: var(--fm-muted);
    font-size: 13px;
    text-align: center;
}

.lk-empty[hidden] {
    display: none;
}

.lk-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}

.lk-modal[hidden] {
    display: none;
}

body.lk-lock {
    overflow: hidden;
}

.lk-mask {
    position: absolute;
    inset: 0;
    background: rgba(40, 38, 30, .45);
}

.lk-box {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 560px;
    max-height: calc(100vh - 32px);
    overflow: auto;
    padding: 16px 18px;
    background: var(--fm-card);
    border-radius: 12px;
    box-shadow: 0 16px 48px rgba(40, 38, 30, .24);
}

.lk-box-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 10px;
    margin-bottom: 12px;
    border-bottom: 1px solid var(--fm-line);
}

.lk-box-head b {
    color: var(--fm-text-strong);
    font-size: 16px;
}

.lk-x {
    padding: 0 4px;
    border: 0;
    background: none;
    color: var(--fm-muted);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}

.lk-site-info {
    margin-bottom: 12px;
    padding: 10px 12px;
    background: var(--fm-tint-blue);
    border-radius: 8px;
    color: #4a5568;
    font-size: 12.5px;
    line-height: 1.75;
    overflow-wrap: anywhere;
}

.lk-site-info p {
    margin: 0;
}

.lk-site-info-title {
    margin: 0 0 2px !important;
    font-weight: 600;
    color: #2f4a63;
}

.lk-site-info em {
    color: #6f7d8c;
    font-style: normal;
    font-weight: 600;
}

.lk-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px 12px;
}

.lk-field {
    display: block;
    margin-bottom: 0;
}

.lk-field-full {
    grid-column: 1 / -1;
}

.lk-field-tip {
    display: block;
    margin-top: 4px;
    color: var(--fm-muted);
    font-size: 12px;
    line-height: 1.6;
}

.lk-logo-row {
    display: flex;
    align-items: center;
    gap: 8px;
}

.lk-logo-row input {
    flex: 1 1 auto;
    min-width: 0;
}

.lk-preview {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 36px;
    overflow: hidden;
    background: var(--fm-soft);
    border: 1px dashed var(--fm-border);
    border-radius: 6px;
    color: #b3afa1;
    font-size: 12px;
}

.lk-preview img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.lk-upload {
    flex: 0 0 auto;
    height: 36px;
    padding: 0 14px;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    color: var(--fm-text-sub);
    font-size: 13px;
    cursor: pointer;
    transition: border-color .15s ease, color .15s ease;
}

.lk-upload:hover {
    border-color: var(--fm-primary);
    color: var(--fm-primary);
}

.lk-form-note {
    margin: 0 auto 0 0;
    color: var(--fm-muted);
    font-size: 12px;
}

.lk-form-note i {
    margin-right: 3px;
}

.lk-field > span {
    display: block;
    margin-bottom: 4px;
    color: var(--fm-text-sub);
    font-size: 12px;
}

.lk-field input,
.lk-field select {
    width: 100%;
    height: 36px;
    padding: 0 12px;
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    background: var(--fm-card);
    color: var(--fm-text);
    font-size: 13px;
    transition: border-color .15s ease, box-shadow .15s ease;
}

.lk-field input:focus,
.lk-field select:focus {
    outline: none;
    border-color: var(--fm-primary);
    box-shadow: 0 0 0 3px var(--fm-primary-light);
}

.lk-code {
    display: flex;
    gap: 8px;
}

.lk-code input {
    flex: 1 1 auto;
}

.lk-code img {
    height: 36px;
    border: 1px solid var(--fm-border);
    border-radius: 6px;
    cursor: pointer;
}

.lk-form-foot {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 14px;
}

@media (max-width: 1100px) {
    .lk-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

@media (max-width: 880px) {
    .lk-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .lk-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lk-bar {
        gap: 8px;
    }

    .lk-search {
        flex: 1 1 100%;
    }

    .lk-form-grid {
        grid-template-columns: 1fr;
    }

    .lk-form-foot {
        flex-wrap: wrap;
    }

    .lk-form-note {
        flex: 1 1 100%;
        margin: 0 0 4px;
    }
}

@media (max-width: 420px) {
    .lk-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .lk-card-in {
        padding: 14px 8px 12px;
    }
}

.donate-head-ic {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border-radius: 8px;
    background: var(--fm-primary-light);
    color: var(--fm-primary);
    font-size: 15px;
}

.donate-intro {
    margin: 0 0 18px;
    font-size: 13px;
    line-height: 1.95;
    color: var(--fm-text-sub);
}

.donate-intro p + p {
    margin-top: 6px;
}

.donate-scan-tip {
    margin: 0 0 10px;
    font-size: 13px;
    font-weight: 600;
    color: #d84a3a;
    text-align: center;
}

.donate-qr-card {
    width: 280px;
    max-width: 100%;
    margin: 0 auto 18px;
    padding: 0;
    background: var(--fm-card);
    border: 1px solid var(--fm-border);
    border-radius: 12px;
    box-shadow: var(--fm-shadow);
    overflow: hidden;
    line-height: 0;
}

.donate-qr-img img {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    margin: 0;
    border-radius: 0;
}

.donate-notice {
    margin: 0 0 16px;
    padding: 10px 14px;
    background: var(--fm-tint-red);
    border: 1px solid #f7ddd8;
    border-radius: 6px;
    font-size: 13px;
    line-height: 1.85;
    color: #d84a3a;
}

.donate-notice p + p {
    margin-top: 2px;
}

.donate-tiers {
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 2.2;
    color: var(--fm-text-sub);
}

.donate-sum {
    margin: 0 0 12px;
    font-size: 13px;
    color: var(--fm-text-sub);
}

.donate-sum b {
    font-size: 15px;
    color: var(--fm-primary);
}

.donate-table-box {
    overflow-x: auto;
}

.donate-table {
    min-width: 420px;
}

.donate-th a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: inherit;
}

.donate-th a:hover,
.donate-th.is-active a {
    color: var(--fm-primary);
}

.donate-th i {
    font-size: 11px;
    opacity: .8;
}

.donate-amount {
    font-weight: 700;
    color: var(--fm-primary);
}

.donate-table td.uc-empty {
    color: var(--fm-text-sub);
}

.donate-extra {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px dashed var(--fm-line);
    font-size: 12px;
    line-height: 1.85;
    color: var(--fm-text-sub);
}

@media (max-width: 640px) {
    .donate-qr-card {
        width: 240px;
        max-width: 100%;
        padding: 0;
    }

    .donate-tiers {
        line-height: 2.4;
    }
}

.err-page {
    position: relative;
    flex: 1 1 auto;
    min-height: 60vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
    padding: 40px 20px 28px;
    overflow: hidden;
}

.err-page::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: radial-gradient(var(--fm-primary) 1.2px, transparent 1.3px);
    background-size: 34px 34px;
    opacity: .10;
    animation: err-dots 12s linear infinite;
    pointer-events: none;
}

@keyframes err-dots {
    to {
        background-position: 34px 34px;
    }
}

.err-card {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 440px;
    padding: 28px 24px 26px;
    text-align: center;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.err-code {
    position: relative;
    display: inline-block;
    font-size: 125px;
    line-height: 120px;
    font-weight: 700;
    margin-bottom: 20px;
    letter-spacing: .03em;
    color: var(--fm-primary);
}

.err-code::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 160px;
    height: 160px;
    margin: -80px 0 0 -80px;
    border-radius: 50%;
    background: var(--fm-primary);
    opacity: .12;
    filter: blur(26px);
    z-index: -1;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
    .err-code {
        background: linear-gradient(160deg, var(--fm-primary) 8%, var(--fm-primary-dark, #348653) 92%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        -webkit-text-fill-color: transparent;
    }
}

.err-card p {
    margin: 18px 0 26px;
    color: var(--fm-text-sub);
    font-size: 14px;
    line-height: 1.7;
}

.err-card .btn {
    height: 44px;
    padding: 0 28px;
    font-size: 14px;
    border-radius: 6px;
}

.err-card .btn-primary {
    box-shadow: 0 10px 20px -12px var(--fm-primary);
}

.err-card .btn-primary:hover {
    transform: translateY(-1px);
}

@media (max-width: 640px) {
    .err-page {
        min-height: 50vh;
        padding: 26px 16px 20px;
    }

    .err-card {
        padding: 18px 14px 16px;
    }

    .err-code {
        font-size: 60px;
        line-height: 64px;
    }

    .err-code::after {
        width: 130px;
        height: 130px;
        margin: -65px 0 0 -65px;
    }
}

.forum-avatar {
    transition: transform .45s ease;
}

.forum-avatar:hover {
    transform: rotate(360deg);
}

.theme-toggle {
    position: fixed;
    right: 22px;
    bottom: 110px;
    width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 50%;
    border: 1px solid var(--fm-border);
    background: var(--fm-card);
    color: var(--fm-text-sub);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--fm-shadow);
    z-index: 90;
    transition: color .15s, border-color .15s, background-color .15s;
}

.theme-toggle:hover {
    color: var(--fm-primary);
    border-color: var(--fm-primary);
}

.theme-toggle i {
    font-size: 16px;
    line-height: 1;
}

.theme-toggle .theme-icon-moon {
    display: inline-block !important;
}

.theme-toggle .theme-icon-sun {
    display: none !important;
}

html[data-theme="dark"] .theme-toggle .theme-icon-moon {
    display: none !important;
}

html[data-theme="dark"] .theme-toggle .theme-icon-sun {
    display: inline-block !important;
}

@media (max-width: 768px) {
    .theme-toggle {
        right: 14px;
        bottom: 90px;
        width: 36px;
        height: 36px;
    }
}

html[data-theme="dark"] {
    color-scheme: dark;
    --fm-page: #0f110d;
    --fm-bg: #141710;
    --fm-card: #1b1e17;
    --fm-soft: #232720;
    --fm-soft-2: #2a2f26;
    --fm-border: #353b30;
    --fm-line: #2a2f26;
    --fm-text: #e6e4d7;
    --fm-text-sub: #b3af9f;
    --fm-text-strong: #f4f2e6;
    --fm-muted: #918e80;
    --fm-topbar: #181b14;
    --fm-topbar-text: #e6e4d7;
    --fm-primary-light: color-mix(in srgb, var(--fm-primary) 22%, #1b1e17);
    --fm-tint-green: color-mix(in srgb, var(--fm-primary) 20%, #1b1e17);
    --fm-tint-red: color-mix(in srgb, #d9534f 22%, #1b1e17);
    --fm-tint-gold: color-mix(in srgb, #b98b1f 24%, #1b1e17);
    --fm-tint-purple: color-mix(in srgb, #7c5bd1 24%, #1b1e17);
    --fm-tint-blue: color-mix(in srgb, #3a7bd5 22%, #1b1e17);
    --fm-shadow: 0 1px 2px rgba(0, 0, 0, .5), 0 8px 22px rgba(0, 0, 0, .35);
    scrollbar-color: #3a4135 transparent;
}

html[data-theme="dark"] body.forum-body {
    background-color: var(--fm-page);
    background-image:
        linear-gradient(color-mix(in srgb, var(--fm-page) 80%, transparent), color-mix(in srgb, var(--fm-page) 80%, transparent)),
        url('../images/aotu_background.webp');
    background-blend-mode: normal;
}

html[data-theme="dark"] .forum-topbar {
    background-color: rgba(18, 21, 15, .78);
    border-bottom-color: var(--fm-border);
    box-shadow: 0 1px 0 rgba(0, 0, 0, .35);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    html[data-theme="dark"] .forum-topbar {
        background-color: #181b14;
    }
}

html[data-theme="dark"] .search-overlay {
    background: rgba(10, 12, 9, .86);
}

html[data-theme="dark"] .so-types {
    background: rgba(255, 255, 255, .06);
}

html[data-theme="dark"] .so-tag {
    background: rgba(255, 255, 255, .08);
}

html[data-theme="dark"] .so-tag:hover {
    background: var(--fm-soft-2);
}

html[data-theme="dark"] .footer-decor {
    opacity: .65;
}

html[data-theme="dark"] .brand::after {
    opacity: .25;
}

html[data-theme="dark"] .widget-intro .widget-head h3,
html[data-theme="dark"] .mk-author-tabs a.active {
    color: var(--fm-text-strong);
}

html[data-theme="dark"] .ban-tabs a,
html[data-theme="dark"] .uc-tabs a,
html[data-theme="dark"] .uc-tabs>span,
html[data-theme="dark"] .vip-card+.uc-tabs a,
html[data-theme="dark"] .vip-card+.uc-tabs>span {
    color: var(--fm-text-sub);
}

html[data-theme="dark"] .lk-site-info {
    color: var(--fm-text-sub);
}

html[data-theme="dark"] .lk-site-info-title {
    color: var(--fm-text);
}

html[data-theme="dark"] .post-content blockquote {
    border-left-color: var(--fm-border);
}

html[data-theme="dark"] .post-content code {
    color: #f0a0b0;
}

html[data-theme="dark"] .post-content pre {
    background: #12140f;
    border: 1px solid var(--fm-border);
}

html[data-theme="dark"] .fp-panel .fp-editor-wrap .vditor {
    --panel-background-color: var(--fm-card);
    --toolbar-background-color: var(--fm-soft);
    --toolbar-icon-color: var(--fm-text-sub);
    --toolbar-icon-hover-color: var(--fm-primary);
    --textarea-background-color: var(--fm-card);
    --textarea-text-color: var(--fm-text);
    --border-color: var(--fm-border);
    --second-color: rgba(230, 228, 215, .25);
}

html[data-theme="dark"] .fp-panel .fp-editor-wrap .vditor-reset {
    color: var(--fm-text);
}

html[data-theme="dark"] .fp-panel .fp-editor-wrap .vditor-reset a {
    color: var(--fm-primary);
}

html[data-theme="dark"] .checkin-card {
    border: 1px solid var(--fm-border);
    box-shadow: 0 24px 60px rgba(0, 0, 0, .55);
}

html[data-theme="dark"] .checkin-body {
    scrollbar-color: rgba(255, 255, 255, .22) transparent;
}

html[data-theme="dark"] .checkin-body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .22);
}

html[data-theme="dark"] .checkin-body::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, .34);
}

html[data-theme="dark"] .rank-ranges a {
    color: var(--fm-text-sub);
}

html[data-theme="dark"] .checkin-rank .rank-no {
    color: var(--fm-muted);
}

html[data-theme="dark"] .uc-menu a.active {
    background: color-mix(in srgb, var(--fm-primary) 24%, var(--fm-card));
    color: var(--fm-text-strong);
}

html[data-theme="dark"] .coins-notice {
    background: color-mix(in srgb, #d9534f 12%, var(--fm-card));
    border-color: color-mix(in srgb, #d9534f 34%, var(--fm-card));
    color: var(--fm-text-sub);
}

html[data-theme="dark"] .coins-notice b,
html[data-theme="dark"] .coins-risk-tip {
    color: #eda49b;
}

html[data-theme="dark"] .coins-notice svg,
html[data-theme="dark"] .coins-risk-tip svg {
    stroke: #ef8a80;
}

html[data-theme="dark"] .coins-risk-tip {
    border-color: color-mix(in srgb, #d9534f 34%, var(--fm-card));
}

html[data-theme="dark"] .vip-invite-center {
    border-color: color-mix(in srgb, #7c5bd1 36%, var(--fm-card));
    background: color-mix(in srgb, #7c5bd1 12%, var(--fm-card));
}

html[data-theme="dark"] .vip-invite-rights {
    border-top-color: color-mix(in srgb, #7c5bd1 30%, var(--fm-card));
}

html[data-theme="dark"] .vip-invite-title,
html[data-theme="dark"] .vip-invite-pill a,
html[data-theme="dark"] .vip-invite-code:hover {
    color: #bda8f4;
}

html[data-theme="dark"] .vip-invite-pill {
    color: var(--fm-text-sub);
}

html[data-theme="dark"] .vip-invite-make:disabled {
    background: color-mix(in srgb, #7c5bd1 34%, var(--fm-card));
    color: var(--fm-text-sub);
}

html[data-theme="dark"] .vip-invite-tabs a {
    border-color: var(--fm-border);
}

html[data-theme="dark"] .vip-invite-tabs a.active {
    border-color: color-mix(in srgb, #7c5bd1 55%, var(--fm-card));
    background: color-mix(in srgb, #7c5bd1 30%, var(--fm-card));
    color: var(--fm-text-strong);
}

html[data-theme="dark"] .vip-growth-bar {
    border-color: color-mix(in srgb, #7c5bd1 32%, var(--fm-card));
    background: linear-gradient(115deg, color-mix(in srgb, #7c5bd1 18%, var(--fm-card)) 0%, var(--fm-card) 52%);
}

html[data-theme="dark"] .vip-growth-pct,
html[data-theme="dark"] .vip-growth-text em b {
    color: #bda8f4;
}

html[data-theme="dark"] .vip-cal-day.is-signed {
    color: #bda8f4;
}

/* 移动端：发帖页功能面板（悬赏/投票/抽奖/付费内容）改为底部弹层，避免溢出屏幕 */
@media (max-width: 640px) {
    .fp-tag-panel.fp-bounty-panel,
    .fp-tag-panel.fp-poll-panel,
    .fp-tag-panel.fp-lottery-panel,
    .fp-tag-panel.fp-pay-panel {
        position: fixed;
        left: 10px;
        right: 10px;
        top: auto;
        bottom: 10px;
        width: auto;
        min-width: 0;
        max-width: none;
        max-height: 72vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        z-index: 990;
        box-shadow: 0 -10px 34px rgba(0, 0, 0, .2);
    }

    .fp-tag-panel.fp-tag-panel-sm {
        position: fixed;
        left: 10px;
        right: 10px;
        top: auto;
        bottom: 10px;
        min-width: 0;
        width: auto;
        max-width: none;
        z-index: 990;
        box-shadow: 0 -10px 34px rgba(0, 0, 0, .2);
    }
}


/* Editor.md placeholder fix: the CodeMirror placeholder addon leaves
   .CodeMirror-placeholder in normal flow with height:0 and relies on CSS
   for absolute positioning, which editormd.css does not provide. Without
   this rule the hint is laid out at the editor bottom and never visible. */
.CodeMirror-placeholder {
    position: absolute !important;
    top: 4px;
    left: 4px;
    z-index: 5;
    pointer-events: none;
}