:root {
    --bg: #f5f0f7;
    --bg-card: #ffffff;
    --bg-soft: #fdf6f9;
    --blue-100: #e8f2fb;
    --blue-200: #c5ddf6;
    --blue-300: #8bb8e8;
    --blue-400: #5b8ec9;
    --blue-500: #3d6fa9;
    --blue-600: #2c5282;
    --pink-100: #fde8ee;
    --pink-200: #f9c8d6;
    --pink-300: #f4a7b9;
    --pink-400: #e8859b;
    --pink-500: #d4647e;
    --green-400: #5ec987;
    --green-500: #3da863;
    --yellow-400: #f0c24e;
    --yellow-500: #d4a430;
    --red-400: #e8857a;
    --red-500: #c95555;
    --text: #3d3055;
    --text-secondary: #6b5e82;
    --text-muted: #9a8db5;
    --border: #e8dff2;
    --border-light: #f2ecf7;
    --shadow-sm: 0 2px 8px rgba(100, 70, 130, 0.06);
    --shadow: 0 4px 20px rgba(100, 70, 130, 0.10);
    --shadow-lg: 0 8px 36px rgba(100, 70, 130, 0.14);
    --radius-sm: 10px;
    --radius: 16px;
    --radius-lg: 22px;
    --radius-xl: 28px;
    --font: 'Segoe UI', 'PingFang SC', 'Microsoft YaHei', 'Hiragino Sans GB', 'Noto Sans SC', -apple-system,
        sans-serif;
    --transition: 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

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

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font);
    background: linear-gradient(160deg, #f9f4fb 0%, #f3eff8 20%, #eef3fa 45%, #fdf4f7 70%, #f9f4fb 100%);
    background-attachment: fixed;
    min-height: 100vh;
    color: var(--text);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    position: relative;
    overflow-x: hidden;
}

/* 背景装饰 */
body::before {
    content: '';
    position: fixed;
    top: -180px;
    right: -120px;
    width: 500px;
    height: 500px;
    background: radial-gradient(circle, rgba(139, 184, 232, 0.12) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    animation: floatBubble1 20s ease-in-out infinite;
}
body::after {
    content: '';
    position: fixed;
    bottom: -160px;
    left: -100px;
    width: 420px;
    height: 420px;
    background: radial-gradient(circle, rgba(244, 167, 185, 0.11) 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
    animation: floatBubble2 24s ease-in-out infinite;
}
@keyframes floatBubble1 {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    33% {
        transform: translate(-40px, 30px) scale(1.08);
    }
    66% {
        transform: translate(25px, -20px) scale(0.94);
    }
}
@keyframes floatBubble2 {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    33% {
        transform: translate(35px, -25px) scale(1.06);
    }
    66% {
        transform: translate(-20px, 35px) scale(0.92);
    }
}

/* 装饰浮动粒子 */
.decorative-dots {
    position: fixed;
    pointer-events: none;
    z-index: 0;
}
.decorative-dots .dot {
    position: absolute;
    border-radius: 50%;
    opacity: 0.5;
    animation: dotFloat 8s ease-in-out infinite;
}
.dot:nth-child(1) {
    width: 8px;
    height: 8px;
    background: #c5ddf6;
    top: 15vh;
    left: 5vw;
    animation-delay: 0s;
}
.dot:nth-child(2) {
    width: 6px;
    height: 6px;
    background: #f9c8d6;
    top: 25vh;
    right: 8vw;
    animation-delay: 2s;
}
.dot:nth-child(3) {
    width: 7px;
    height: 7px;
    background: #d4c5f0;
    top: 55vh;
    left: 3vw;
    animation-delay: 4s;
}
.dot:nth-child(4) {
    width: 5px;
    height: 5px;
    background: #f4d8c5;
    top: 70vh;
    right: 6vw;
    animation-delay: 1s;
}
.dot:nth-child(5) {
    width: 9px;
    height: 9px;
    background: #c5e8f6;
    top: 40vh;
    left: 90vw;
    animation-delay: 3s;
}
.dot:nth-child(6) {
    width: 6px;
    height: 6px;
    background: #f6c5e0;
    top: 80vh;
    left: 50vw;
    animation-delay: 5s;
}
@keyframes dotFloat {
    0%,
    100% {
        transform: translateY(0) scale(1);
        opacity: 0.45;
    }
    50% {
        transform: translateY(-22px) scale(1.5);
        opacity: 0.8;
    }
}

/* 主容器 */
.main-container {
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px 20px 40px;
    position: relative;
    z-index: 1;
}

/* 头部 */
.header {
    text-align: center;
    padding: 28px 20px 16px;
    position: relative;
}
.header .logo-area {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: var(--bg-card);
    padding: 10px 24px;
    border-radius: 50px;
    box-shadow: var(--shadow-sm);
    border: 1.5px solid var(--border-light);
    transition: var(--transition);
}
.header .logo-area:hover {
    box-shadow: var(--shadow);
    transform: translateY(-2px);
}
.header .logo-icon {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    animation: bounceIcon 2s ease-in-out infinite;
}
.header .logo-icon .svg-icon {
    width: 32px;
    height: 32px;
    color: #5b8ec9;
}
@keyframes bounceIcon {
    0%,
    100% {
        transform: translateY(0);
    }
    30% {
        transform: translateY(-10px);
    }
    50% {
        transform: translateY(0);
    }
    70% {
        transform: translateY(-6px);
    }
}
.header h1 {
    font-size: 1.6rem;
    font-weight: 700;
    letter-spacing: 0.5px;
    background: linear-gradient(135deg, #5b8ec9, #d4647e);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.header .subtitle {
    font-size: 0.85rem;
    color: var(--text-muted);
    margin-top: 4px;
    letter-spacing: 0.3px;
}

/* 分区标题 */
.section-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1.05rem;
    font-weight: 650;
    color: var(--text);
    margin-bottom: 14px;
    padding-left: 4px;
}
.section-title .icon-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
}
.section-title .icon-dot.blue {
    background: var(--blue-300);
    box-shadow: 0 0 10px rgba(139, 184, 232, 0.5);
}
.section-title .icon-dot.pink {
    background: var(--pink-300);
    box-shadow: 0 0 10px rgba(244, 167, 185, 0.5);
}
.section-title .icon-dot.green {
    background: var(--green-400);
    box-shadow: 0 0 10px rgba(94, 201, 135, 0.5);
}

/* 卡片 */
.card {
    background: var(--bg-card);
    border-radius: var(--radius-lg);
    padding: 22px 24px;
    box-shadow: var(--shadow);
    border: 1.5px solid var(--border-light);
    transition: var(--transition);
    position: relative;
    overflow: hidden;
}
.card:hover {
    box-shadow: var(--shadow-lg);
}
.card::after {
    content: '';
    position: absolute;
    top: -30px;
    right: -30px;
    width: 90px;
    height: 90px;
    border-radius: 50%;
    opacity: 0.04;
    pointer-events: none;
    transition: var(--transition);
}
.card.card-blue::after {
    background: #5b8ec9;
}
.card.card-pink::after {
    background: #e8859b;
}

/* ========== 公告区域 ========== */
.announcement-card {
    margin-bottom: 22px;
    background: linear-gradient(135deg, #fff 0%, #fdf6f9 40%, #f8f3fb 100%);
    border: 1.5px solid #f0e6f4;
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow);
    overflow: hidden;
    position: relative;
}
.announcement-card .announce-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 20px;
    background: linear-gradient(90deg, #fdf2f6, #f8f0fa, #eef4fb);
    border-bottom: 1px solid var(--border-light);
    font-weight: 650;
    font-size: 0.95rem;
    color: var(--text);
    letter-spacing: 0.4px;
}
.announcement-card .announce-header .bell-icon {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    animation: bellRing 3s ease-in-out infinite;
}
.announcement-card .announce-header .bell-icon .svg-icon {
    width: 18px;
    height: 18px;
    color: #d4647e;
}
@keyframes bellRing {
    0%,
    80%,
    100% {
        transform: rotate(0);
    }
    5% {
        transform: rotate(15deg);
    }
    10% {
        transform: rotate(-15deg);
    }
    15% {
        transform: rotate(8deg);
    }
    20% {
        transform: rotate(0);
    }
}
.announce-scroll-wrap {
    padding: 8px 16px;
}
.announce-scroll-wrap.is-static {
    overflow: visible;
}
.announce-scroll-wrap.is-scrollable {
    overflow-x: hidden;
    overflow-y: auto;
    scroll-behavior: smooth;
    scrollbar-width: none;
    -ms-overflow-style: none;
    user-select: none;
    touch-action: none;
    pointer-events: none;
}
.announce-scroll-wrap.is-scrollable::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}
.announce-header .announce-count {
    font-size: 0.7rem;
    color: var(--text-muted);
    margin-left: auto;
    white-space: nowrap;
}
.announce-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
    border-radius: var(--radius-sm);
    transition: var(--transition);
    border-bottom: 1px solid #faf5fc;
    animation: fadeInUp 0.5s ease-out;
}
.announce-item:last-child {
    border-bottom: none;
}
.announce-item:hover {
    background: rgba(139, 184, 232, 0.06);
}
.announce-item.is-urgent {
    background: linear-gradient(135deg, rgba(253, 232, 238, 0.45) 0%, rgba(255, 255, 255, 0.6) 100%);
    border-left: 3px solid #e8859b;
    padding-left: 11px;
}
.announce-item-empty {
    align-items: center;
    justify-content: center;
    padding: 16px;
}
.announce-empty-text {
    font-size: 0.84rem;
    color: var(--text-muted);
}
.announce-item-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.announce-date {
    flex-shrink: 0;
    font-size: 0.72rem;
    font-weight: 600;
    color: #fff;
    background: linear-gradient(135deg, #8bb8e8, #a8c8f0);
    padding: 3px 10px;
    border-radius: 20px;
    white-space: nowrap;
    letter-spacing: 0.2px;
    line-height: 1.4;
}
.announce-date.urgent {
    background: linear-gradient(135deg, #f4a7b9, #e8859b);
}
.announce-tag {
    flex-shrink: 0;
    font-size: 0.68rem;
    font-weight: 700;
    color: #d4647e;
    background: #fde8ee;
    padding: 2px 8px;
    border-radius: 20px;
    line-height: 1.4;
}
.announce-item-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.announce-title {
    font-size: 0.94rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.45;
    letter-spacing: 0.2px;
}
.announce-desc {
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.6;
    padding-left: 0;
    border-left: none;
}
.announce-item.is-urgent .announce-desc {
    color: var(--text-secondary);
}
@media (min-width: 769px) {
    .announce-item {
        flex-direction: row;
        align-items: flex-start;
        gap: 14px;
        padding: 14px 16px;
    }
    .announce-item.is-urgent {
        padding-left: 13px;
    }
    .announce-item-meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        width: 118px;
        flex-shrink: 0;
    }
    .announce-item-body {
        flex: 1;
        gap: 6px;
        padding-top: 1px;
    }
    .announce-title {
        font-size: 0.96rem;
    }
    .announce-desc {
        font-size: 0.84rem;
        padding-left: 10px;
        border-left: 2px solid #e8dff2;
    }
    .announce-item.is-urgent .announce-desc {
        border-left-color: #f4a7b9;
    }
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ========== 查询区域 ========== */
.query-card {
    margin-bottom: 22px;
}
.query-section-title {
    width: 100%;
}
.query-settings-btn {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1.5px solid #e8dff2;
    border-radius: 10px;
    background: #fff;
    color: #9a8db5;
    cursor: pointer;
    transition: var(--transition);
    flex-shrink: 0;
}
.query-settings-btn:hover {
    color: #5b8ec9;
    border-color: #c5ddf6;
    background: #f7fbff;
}
.query-settings-btn.is-active {
    color: #5b8ec9;
    border-color: #b8c8e8;
    background: #eef5fc;
}
.query-settings-btn .svg-icon {
    width: 16px;
    height: 16px;
}
.query-input-row {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: center;
}
.query-input-wrap {
    flex: 1;
    min-width: 0;
    position: relative;
}
.query-input-wrap input {
    width: 100%;
    padding: 13px 44px 13px 44px;
    font-size: 0.95rem;
    border: 2px solid #e8dff2;
    border-radius: 50px;
    background: #fdfcfe;
    color: var(--text);
    transition: var(--transition);
    font-family: var(--font);
    letter-spacing: 0.3px;
    outline: none;
}
.query-input-wrap input:focus {
    border-color: #b8c8e8;
    box-shadow: 0 0 0 5px rgba(139, 184, 232, 0.10);
    background: #fff;
}
.query-input-wrap .input-icon {
    position: absolute;
    left: 16px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    color: #c8b8d8;
    pointer-events: none;
    transition: var(--transition);
}
.query-input-wrap .input-icon .svg-icon {
    width: 18px;
    height: 18px;
}
.query-input-wrap input:focus~.input-icon,
.query-input-wrap input:focus+.input-icon,
.query-input-wrap:focus-within .input-icon {
    color: #8bb8e8;
}
.query-input-toggle {
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    padding: 0;
    border: none;
    border-radius: 8px;
    background: transparent;
    color: #b0a0c4;
    cursor: pointer;
    transition: var(--transition);
    z-index: 2;
    flex-shrink: 0;
}
.query-input-toggle:hover {
    color: #7a5ea8;
    background: #f3edf8;
}
.btn-query {
    padding: 13px 28px;
    font-size: 0.95rem;
    font-weight: 650;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    letter-spacing: 0.4px;
    transition: var(--transition);
    white-space: nowrap;
    font-family: var(--font);
    background: linear-gradient(135deg, #7eb5e8, #5b8ec9);
    color: #fff;
    box-shadow: 0 4px 16px rgba(91, 142, 201, 0.3);
    position: relative;
    overflow: hidden;
}
.btn-query:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 22px rgba(91, 142, 201, 0.4);
    background: linear-gradient(135deg, #8bb8e8, #6b9ed8);
}
.btn-query:active {
    transform: translateY(0);
    box-shadow: 0 3px 10px rgba(91, 142, 201, 0.3);
}
.btn-query.loading {
    pointer-events: none;
    opacity: 0.8;
}
.btn-query .btn-spinner {
    display: none;
    width: 18px;
    height: 18px;
    border: 2.5px solid #fff;
    border-top-color: transparent;
    border-radius: 50%;
    animation: spin 0.7s linear infinite;
    margin-right: 8px;
    vertical-align: middle;
}
.btn-query.loading .btn-spinner {
    display: inline-block;
}
@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* 查询结果 */
.query-result {
    margin-top: 18px;
    display: none;
    animation: fadeInUp 0.4s ease-out;
}
.query-result.show {
    display: block;
}
.query-result-body {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.result-layout {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

/* 统一查询成功卡片（参考查询页面） */
.result-detail-card {
    position: relative;
    overflow: hidden;
    background: #fff;
    border: 1px solid #efe3ea;
    border-radius: 20px;
    padding: 20px 18px 16px;
    box-shadow: 0 12px 40px rgba(160, 130, 150, 0.1);
    animation: fadeInUp 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
}
.result-detail-card::before {
    content: '';
    position: absolute;
    top: -40px;
    right: -40px;
    width: 120px;
    height: 120px;
    background: radial-gradient(circle, #fce4ec 0%, transparent 70%);
    border-radius: 50%;
    pointer-events: none;
}
.result-detail-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 16px;
    position: relative;
    z-index: 1;
    flex-wrap: wrap;
}
.result-detail-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1.1rem;
    font-weight: 700;
    color: #362e3a;
    letter-spacing: -0.3px;
}
.result-detail-title-icon {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: linear-gradient(135deg, #e295aa, #77a9d2);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    flex-shrink: 0;
    font-size: 0.95rem;
    line-height: 1;
    font-weight: 400;
}
.result-detail-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 14px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
    background: #e2f4e8;
    color: #5aad72;
    white-space: nowrap;
}
.result-detail-status-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #5aad72;
    flex-shrink: 0;
}
.result-quota-card {
    background: linear-gradient(135deg, #fefafc 0%, #fdf5f8 100%);
    border: 2px solid #f0dde5;
    border-radius: 14px;
    padding: 14px 16px;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
    box-shadow: 0 2px 12px rgba(200, 160, 180, 0.08);
}
.result-token-name-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px dashed #ecdce4;
    flex-wrap: wrap;
}
.result-token-name-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 0.7rem;
    letter-spacing: 0.6px;
    color: #9a8c98;
    font-weight: 600;
    text-transform: uppercase;
    flex-shrink: 0;
}
.result-token-name-value {
    font-weight: 700;
    font-size: 0.95rem;
    color: #362e3a;
    word-break: break-all;
}
.result-quota-row {
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    gap: 8px;
    flex-wrap: wrap;
}
.result-quota-item {
    text-align: center;
    flex: 1;
    min-width: 70px;
    background: #fff;
    border-radius: 10px;
    padding: 10px 6px;
    border: 1px solid #f3eaf0;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
}
.result-quota-item:hover {
    border-color: #fce4ec;
    box-shadow: 0 4px 12px rgba(210, 160, 180, 0.12);
}
.result-quota-item-label {
    font-size: 0.65rem;
    letter-spacing: 0.5px;
    color: #9a8c98;
    margin-bottom: 4px;
    font-weight: 600;
    text-transform: uppercase;
}
.result-quota-item-value {
    font-weight: 700;
    font-size: 1rem;
    color: #362e3a;
    white-space: nowrap;
}
.result-quota-item-value.is-used {
    color: #c9708a;
}
.result-quota-item-value.is-remain {
    color: #5aad72;
    font-size: 1.1rem;
    font-weight: 800;
}
.result-quota-progress-wrap {
    margin-top: 14px;
}
.result-quota-progress-track {
    width: 100%;
    height: 8px;
    background: #f0e6ed;
    border-radius: 10px;
    overflow: hidden;
}
.result-quota-progress-bar {
    height: 100%;
    border-radius: 10px;
    background: linear-gradient(90deg, #e295aa, #c9708a);
    transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1);
}
.result-quota-progress-text {
    display: flex;
    justify-content: space-between;
    font-size: 0.7rem;
    color: #9a8c98;
    margin-top: 5px;
    font-weight: 500;
}
.result-detail-info {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 14px;
    position: relative;
    z-index: 1;
}
.result-detail-info-line {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.82rem;
    color: #625767;
    flex-wrap: wrap;
}
.result-detail-info-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #9a8c98;
}
.result-detail-info-icon .svg-icon {
    width: 16px;
    height: 16px;
}
.result-detail-info-label {
    font-weight: 600;
    color: #9a8c98;
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    min-width: 50px;
    flex-shrink: 0;
}
.result-detail-info-value {
    font-weight: 500;
    color: #362e3a;
    word-break: break-all;
    flex: 1;
    min-width: 0;
}
.result-detail-info-value.is-link {
    color: #77a9d2;
    font-weight: 600;
}
.result-api-address-text.is-link,
.result-website-address-text.is-link {
    cursor: pointer;
    transition: color 0.2s ease;
}
.result-api-address-text.is-link:hover,
.result-website-address-text.is-link:hover {
    color: #5b8ec9;
    text-decoration: underline;
}
.result-detail-info-value.result-api-key-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}
.result-api-key-text.is-secret {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.75rem;
    color: #c9708a;
    letter-spacing: 0.2px;
    background: #fefafc;
    padding: 2px 8px;
    border-radius: 6px;
    word-break: break-all;
    cursor: pointer;
    transition: background 0.2s ease;
}
.result-api-key-text.is-secret:hover {
    background: #fce4ec;
}
.result-detail-notice {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-bottom: 14px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #fefbf6;
    border: 1px solid #f5e9d8;
    position: relative;
    z-index: 1;
}
.result-detail-notice-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: #d6a346;
    margin-top: 1px;
}
.result-detail-notice-icon .svg-icon {
    width: 16px;
    height: 16px;
}
.result-detail-notice-text {
    font-size: 0.78rem;
    color: #8a7148;
    line-height: 1.55;
}
.result-detail-actions {
    display: flex;
    gap: 10px;
    position: relative;
    z-index: 1;
    flex-wrap: wrap;
}
.result-detail-btn {
    flex: 1;
    min-width: 120px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 11px 16px;
    border-radius: 30px;
    font-weight: 700;
    font-size: 0.82rem;
    letter-spacing: 0.3px;
    cursor: pointer;
    transition: all 0.25s ease;
    border: none;
    font-family: var(--font);
}
.result-detail-btn .svg-icon {
    width: 15px;
    height: 15px;
    flex-shrink: 0;
}
.result-detail-btn.is-primary {
    background: #e295aa;
    color: #fff;
    box-shadow: 0 4px 16px rgba(226, 149, 170, 0.3);
}
.result-detail-btn.is-primary:hover {
    background: #c9708a;
    transform: translateY(-1px);
    box-shadow: 0 8px 24px rgba(226, 149, 170, 0.4);
}
.result-detail-btn.is-outline {
    background: transparent;
    border: 2px solid #e0d4dc;
    color: #625767;
}
.result-detail-btn.is-outline:hover {
    border-color: #e295aa;
    color: #c9708a;
    background: #fefafc;
}

@media (max-width: 420px) {
    .result-detail-card {
        padding: 16px 12px 12px;
        border-radius: 14px;
    }
    .result-quota-card {
        padding: 12px 10px;
    }
    .result-quota-row {
        gap: 4px;
    }
    .result-quota-item {
        padding: 8px 4px;
    }
    .result-quota-item-value {
        font-size: 0.85rem;
    }
    .result-quota-item-value.is-remain {
        font-size: 1rem;
    }
    .result-detail-actions {
        flex-direction: column;
    }
    .result-detail-btn {
        width: 100%;
    }
    .result-detail-title {
        font-size: 1rem;
    }
}

.result-summary-card,
.result-info-card,
.result-remark-card {
    background: #fdfcfe;
    border: 1.5px solid #f0eaf5;
    border-radius: calc(var(--radius) + 2px);
    padding: 16px 18px;
}
.result-summary-top {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 16px;
}
.result-status-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 0.78rem;
    font-weight: 700;
}
.result-status-badge.is-success {
    color: #2f9a62;
    background: #edf9f1;
    border: 1px solid #ccebd7;
}
.result-status-badge.is-error {
    color: #c95555;
    background: #fff3f3;
    border: 1px solid #f5d4d4;
}
.result-token-name {
    margin: 0;
    font-size: 1.08rem;
    font-weight: 700;
    color: var(--text);
    line-height: 1.35;
    word-break: break-word;
}
.result-section-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 0.76rem;
    font-weight: 700;
    color: var(--text-muted);
    letter-spacing: 0.4px;
    margin-bottom: 12px;
}
.result-quota-panel {
    background: linear-gradient(180deg, #fff 0%, #fcf9fd 100%);
    border: 1.5px solid #efe6f5;
    border-radius: var(--radius);
    padding: 16px;
}
.result-quota-panel.danger {
    border-color: #f5d0d8;
    background: linear-gradient(180deg, #fffafb 0%, #fff5f7 100%);
}
.result-quota-panel.warning {
    border-color: #f5e3c8;
    background: linear-gradient(180deg, #fffcf8 0%, #fff9f2 100%);
}
.result-quota-main {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin-bottom: 14px;
}
.result-quota-main-label {
    font-size: 0.78rem;
    color: var(--text-muted);
    font-weight: 600;
}
.result-quota-main-value {
    font-size: 2rem;
    line-height: 1.1;
    font-weight: 800;
    color: #d4647e;
    letter-spacing: -0.02em;
}
.result-quota-panel.warning .result-quota-main-value {
    color: #c58a2b;
}
.result-quota-panel.danger .result-quota-main-value {
    color: #d05858;
}
.result-quota-panel.unlimited .result-quota-main-value {
    color: #4a9fd8;
}

.result-quota-unlimited-card {
    position: relative;
    overflow: hidden;
    border: 1px solid transparent;
    background:
        linear-gradient(145deg, rgba(255, 255, 255, 0.92) 0%, rgba(248, 244, 255, 0.96) 45%, rgba(255, 248, 252, 0.96) 100%);
    box-shadow:
        0 10px 30px rgba(88, 72, 168, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.85);
    padding: 20px 18px 18px;
    isolation: isolate;
}
.result-quota-unlimited-card::before {
    content: '';
    position: absolute;
    inset: 0;
    padding: 1.5px;
    border-radius: inherit;
    background: linear-gradient(120deg, #8bb8e8, #c49bff, #f0a8c8, #8bb8e8);
    background-size: 300% 300%;
    animation: unlimitedBorderFlow 8s ease infinite;
    -webkit-mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    mask:
        linear-gradient(#fff 0 0) content-box,
        linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask-composite: exclude;
    pointer-events: none;
}
.result-unlimited-aurora {
    position: absolute;
    inset: -40%;
    background:
        radial-gradient(circle at 20% 30%, rgba(139, 184, 232, 0.28) 0%, transparent 42%),
        radial-gradient(circle at 80% 20%, rgba(196, 155, 255, 0.24) 0%, transparent 40%),
        radial-gradient(circle at 60% 80%, rgba(240, 168, 200, 0.22) 0%, transparent 45%);
    animation: unlimitedAurora 10s ease-in-out infinite alternate;
    pointer-events: none;
    z-index: 0;
}
.result-unlimited-shine {
    position: absolute;
    top: -120%;
    left: -30%;
    width: 60%;
    height: 300%;
    background: linear-gradient(105deg, transparent 0%, rgba(255, 255, 255, 0.55) 48%, transparent 100%);
    transform: rotate(18deg);
    animation: unlimitedShine 5.5s ease-in-out infinite;
    pointer-events: none;
    z-index: 1;
}
.result-unlimited-content {
    position: relative;
    z-index: 2;
}
.result-unlimited-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 0.76rem;
    font-weight: 700;
    color: #5b4a9a;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(243, 236, 255, 0.95));
    border: 1px solid rgba(196, 155, 255, 0.45);
    box-shadow: 0 4px 14px rgba(120, 90, 180, 0.12);
    margin-bottom: 16px;
}
.result-unlimited-badge .svg-icon {
    color: #9b7ad8;
}
.result-unlimited-hero {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}
.result-unlimited-symbol {
    flex: 0 0 auto;
    width: 72px;
    height: 72px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 22px;
    border: 1px solid rgba(196, 155, 255, 0.35);
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(243, 236, 255, 0.92));
    box-shadow:
        0 8px 24px rgba(107, 168, 232, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.8);
    animation: unlimitedPulse 3s ease-in-out infinite;
}
.result-unlimited-symbol .tier-emblem-icon,
.result-unlimited-symbol .unlimited-icon {
    width: 38px;
    height: 38px;
    color: #7b6ad8;
    filter: drop-shadow(0 2px 6px rgba(123, 106, 216, 0.25));
}
.result-quota-unlimited-card.tier-mega .result-unlimited-symbol .tier-emblem-icon {
    color: #e8a040;
    filter: drop-shadow(0 2px 8px rgba(232, 160, 64, 0.35));
}
.result-tier-emblem .tier-emblem-icon {
    width: 32px;
    height: 32px;
}
.result-unlimited-hero-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.result-unlimited-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: #7a6a9a;
    letter-spacing: 0.3px;
}
.result-unlimited-value {
    font-size: 2.35rem;
    line-height: 1.05;
    font-weight: 800;
    letter-spacing: 0.08em;
    background: linear-gradient(120deg, #4f8fd8 0%, #8b6fd8 50%, #e07aaa 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    filter: drop-shadow(0 2px 8px rgba(107, 140, 210, 0.18));
}
.result-unlimited-desc {
    margin: 0 0 16px;
    font-size: 0.82rem;
    line-height: 1.55;
    color: #7a6a94;
}
.result-unlimited-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}
.result-unlimited-stat {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 10px;
    border-radius: 14px;
    background: rgba(255, 255, 255, 0.72);
    border: 1px solid rgba(210, 198, 235, 0.65);
    backdrop-filter: blur(6px);
    min-width: 0;
}
.result-unlimited-stat.is-primary {
    background: linear-gradient(145deg, rgba(255, 255, 255, 0.95), rgba(243, 236, 255, 0.92));
    border-color: rgba(155, 125, 216, 0.45);
    box-shadow: 0 6px 18px rgba(120, 90, 180, 0.12);
}
.result-unlimited-stat-label {
    font-size: 0.72rem;
    font-weight: 600;
    color: #8a7aa8;
}
.result-unlimited-stat-value {
    font-size: 1rem;
    font-weight: 800;
    color: #4a3f68;
    word-break: break-word;
}
.result-unlimited-stat-value.is-infinite {
    font-size: 1.15rem;
    letter-spacing: 0.06em;
    background: linear-gradient(120deg, #5a8fd8, #9b7ad8, #e07aaa);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
@keyframes unlimitedBorderFlow {
    0%, 100% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
}
@keyframes unlimitedAurora {
    0% { transform: translate3d(-2%, -1%, 0) scale(1); }
    100% { transform: translate3d(2%, 1%, 0) scale(1.05); }
}
@keyframes unlimitedShine {
    0%, 100% { transform: translateX(-120%) rotate(18deg); opacity: 0; }
    45% { opacity: 0.75; }
    60% { transform: translateX(220%) rotate(18deg); opacity: 0; }
}
@keyframes unlimitedPulse {
    0%, 100% { transform: scale(1); box-shadow: 0 8px 24px rgba(107, 168, 232, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.8); }
    50% { transform: scale(1.04); box-shadow: 0 12px 28px rgba(155, 125, 216, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.9); }
}

.result-quota-tier-card {
    position: relative;
    overflow: hidden;
    border-width: 1.5px;
    padding: 18px 16px 16px;
    isolation: isolate;
    box-shadow: 0 8px 24px rgba(80, 70, 120, 0.08);
}
.result-tier-aurora {
    position: absolute;
    inset: -35%;
    pointer-events: none;
    z-index: 0;
    animation: unlimitedAurora 12s ease-in-out infinite alternate;
}
.result-tier-content {
    position: relative;
    z-index: 1;
}
.result-tier-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 5px 11px;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 700;
    margin-bottom: 14px;
    border: 1px solid transparent;
}
.result-tier-badge .svg-icon {
    flex-shrink: 0;
}
.result-tier-hero {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 10px;
}
.result-tier-emblem {
    flex: 0 0 auto;
    width: 64px;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 18px;
    font-size: 1.1rem;
    font-weight: 800;
    letter-spacing: 0.02em;
    border: 1px solid transparent;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
}
.result-tier-hero-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.result-tier-label {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--text-muted);
}
.result-tier-value {
    font-size: 2rem;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: -0.02em;
}
.result-tier-desc {
    margin: 0 0 12px;
    font-size: 0.8rem;
    line-height: 1.5;
    color: var(--text-muted);
}
.result-tier-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding-top: 12px;
    border-top: 1px dashed rgba(180, 165, 200, 0.45);
}
.result-tier-stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 10px 8px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.62);
    border: 1px solid rgba(220, 210, 235, 0.7);
    min-width: 0;
}
.result-tier-stat.is-primary {
    box-shadow: 0 4px 14px rgba(100, 80, 140, 0.1);
}
.result-tier-stat-label {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--text-muted);
}
.result-tier-stat-value {
    font-size: 0.94rem;
    font-weight: 800;
    color: var(--text);
    word-break: break-word;
}
.result-quota-tier-card.tier-1000 {
    border-color: #c8dff5;
    background: linear-gradient(145deg, #fff 0%, #f3f8ff 100%);
}
.result-quota-tier-card.tier-1000 .result-tier-aurora {
    background: radial-gradient(circle at 20% 20%, rgba(107, 168, 232, 0.22), transparent 45%);
}
.result-quota-tier-card.tier-1000 .result-tier-badge { color: #4a7fb8; background: #eef5ff; border-color: #c8dff5; }
.result-quota-tier-card.tier-1000 .result-tier-emblem { color: #4a7fb8; background: #eef5ff; border-color: #c8dff5; }
.result-quota-tier-card.tier-1000 .result-tier-value { color: #4a7fb8; }
.result-quota-tier-card.tier-1000 .result-tier-stat.is-primary .result-tier-stat-value { color: #4a7fb8; }

.result-quota-tier-card.tier-2000 {
    border-color: #bfe8df;
    background: linear-gradient(145deg, #fff 0%, #f2fbf8 100%);
}
.result-quota-tier-card.tier-2000 .result-tier-aurora { background: radial-gradient(circle at 80% 20%, rgba(95, 191, 130, 0.2), transparent 42%); }
.result-quota-tier-card.tier-2000 .result-tier-badge { color: #3d9a72; background: #edf9f3; border-color: #bfe8df; }
.result-quota-tier-card.tier-2000 .result-tier-emblem { color: #3d9a72; background: #edf9f3; border-color: #bfe8df; }
.result-quota-tier-card.tier-2000 .result-tier-value { color: #3d9a72; }
.result-quota-tier-card.tier-2000 .result-tier-stat.is-primary .result-tier-stat-value { color: #3d9a72; }

.result-quota-tier-card.tier-3000 {
    border-color: #c5e8f0;
    background: linear-gradient(145deg, #fff 0%, #f0fafc 100%);
}
.result-quota-tier-card.tier-3000 .result-tier-aurora { background: radial-gradient(circle at 30% 70%, rgba(91, 184, 201, 0.22), transparent 45%); }
.result-quota-tier-card.tier-3000 .result-tier-badge { color: #3a8fa8; background: #edf7fb; border-color: #c5e8f0; }
.result-quota-tier-card.tier-3000 .result-tier-emblem { color: #3a8fa8; background: #edf7fb; border-color: #c5e8f0; }
.result-quota-tier-card.tier-3000 .result-tier-value { color: #3a8fa8; }
.result-quota-tier-card.tier-3000 .result-tier-stat.is-primary .result-tier-stat-value { color: #3a8fa8; }

.result-quota-tier-card.tier-4000 {
    border-color: #d4c8f5;
    background: linear-gradient(145deg, #fff 0%, #f6f3ff 100%);
}
.result-quota-tier-card.tier-4000 .result-tier-aurora { background: radial-gradient(circle at 70% 30%, rgba(155, 125, 216, 0.22), transparent 42%); }
.result-quota-tier-card.tier-4000 .result-tier-badge { color: #7b62b8; background: #f3efff; border-color: #d4c8f5; }
.result-quota-tier-card.tier-4000 .result-tier-emblem { color: #7b62b8; background: #f3efff; border-color: #d4c8f5; }
.result-quota-tier-card.tier-4000 .result-tier-value { color: #7b62b8; }
.result-quota-tier-card.tier-4000 .result-tier-stat.is-primary .result-tier-stat-value { color: #7b62b8; }

.result-quota-tier-card.tier-5000 {
    border-color: #e8c8f0;
    background: linear-gradient(145deg, #fff 0%, #faf3fc 100%);
}
.result-quota-tier-card.tier-5000 .result-tier-aurora { background: radial-gradient(circle at 20% 40%, rgba(196, 120, 200, 0.22), transparent 45%); }
.result-quota-tier-card.tier-5000 .result-tier-badge { color: #9a5aaa; background: #f9f0fb; border-color: #e8c8f0; }
.result-quota-tier-card.tier-5000 .result-tier-emblem { color: #9a5aaa; background: #f9f0fb; border-color: #e8c8f0; }
.result-quota-tier-card.tier-5000 .result-tier-value { color: #9a5aaa; }
.result-quota-tier-card.tier-5000 .result-tier-stat.is-primary .result-tier-stat-value { color: #9a5aaa; }

.result-quota-tier-card.tier-6000 {
    border-color: #f0c8e0;
    background: linear-gradient(145deg, #fff 0%, #fff5fa 100%);
}
.result-quota-tier-card.tier-6000 .result-tier-aurora { background: radial-gradient(circle at 80% 60%, rgba(224, 122, 170, 0.22), transparent 42%); }
.result-quota-tier-card.tier-6000 .result-tier-badge { color: #c45e92; background: #fff0f7; border-color: #f0c8e0; }
.result-quota-tier-card.tier-6000 .result-tier-emblem { color: #c45e92; background: #fff0f7; border-color: #f0c8e0; }
.result-quota-tier-card.tier-6000 .result-tier-value { color: #c45e92; }
.result-quota-tier-card.tier-6000 .result-tier-stat.is-primary .result-tier-stat-value { color: #c45e92; }

.result-quota-tier-card.tier-7000 {
    border-color: #f5d4b8;
    background: linear-gradient(145deg, #fff 0%, #fff8f0 100%);
}
.result-quota-tier-card.tier-7000 .result-tier-aurora { background: radial-gradient(circle at 40% 20%, rgba(227, 165, 90, 0.24), transparent 45%); }
.result-quota-tier-card.tier-7000 .result-tier-badge { color: #c58a2b; background: #fff6ea; border-color: #f5d4b8; }
.result-quota-tier-card.tier-7000 .result-tier-emblem { color: #c58a2b; background: #fff6ea; border-color: #f5d4b8; }
.result-quota-tier-card.tier-7000 .result-tier-value { color: #c58a2b; }
.result-quota-tier-card.tier-7000 .result-tier-stat.is-primary .result-tier-stat-value { color: #c58a2b; }

.result-quota-tier-card.tier-8000 {
    border-color: #f5c8a8;
    background: linear-gradient(145deg, #fff 0%, #fff3eb 100%);
}
.result-quota-tier-card.tier-8000 .result-tier-aurora { background: radial-gradient(circle at 60% 70%, rgba(232, 140, 90, 0.24), transparent 42%); }
.result-quota-tier-card.tier-8000 .result-tier-badge { color: #d07030; background: #fff2e8; border-color: #f5c8a8; }
.result-quota-tier-card.tier-8000 .result-tier-emblem { color: #d07030; background: #fff2e8; border-color: #f5c8a8; }
.result-quota-tier-card.tier-8000 .result-tier-value { color: #d07030; }
.result-quota-tier-card.tier-8000 .result-tier-stat.is-primary .result-tier-stat-value { color: #d07030; }

.result-quota-tier-card.tier-9000 {
    border-color: #f0b8a0;
    background: linear-gradient(145deg, #fff 0%, #fff0e8 100%);
}
.result-quota-tier-card.tier-9000 .result-tier-aurora { background: radial-gradient(circle at 25% 75%, rgba(220, 110, 80, 0.24), transparent 45%); }
.result-quota-tier-card.tier-9000 .result-tier-badge { color: #c85a40; background: #ffefe8; border-color: #f0b8a0; }
.result-quota-tier-card.tier-9000 .result-tier-emblem { color: #c85a40; background: #ffefe8; border-color: #f0b8a0; }
.result-quota-tier-card.tier-9000 .result-tier-value { color: #c85a40; }
.result-quota-tier-card.tier-9000 .result-tier-stat.is-primary .result-tier-stat-value { color: #c85a40; }

.result-quota-tier-card.tier-10000 {
    border-color: #e8a878;
    background: linear-gradient(145deg, #fff 0%, #fff4e8 100%);
}
.result-quota-tier-card.tier-10000 .result-tier-aurora { background: radial-gradient(circle at 70% 25%, rgba(232, 160, 64, 0.26), transparent 42%); }
.result-quota-tier-card.tier-10000 .result-tier-badge { color: #d08030; background: #fff4e6; border-color: #e8a878; }
.result-quota-tier-card.tier-10000 .result-tier-emblem { color: #d08030; background: #fff4e6; border-color: #e8a878; }
.result-quota-tier-card.tier-10000 .result-tier-value { color: #d08030; }
.result-quota-tier-card.tier-10000 .result-tier-stat.is-primary .result-tier-stat-value { color: #d08030; }

.result-quota-unlimited-card.tier-mega .result-unlimited-badge {
    color: #5b4a9a;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(255, 236, 248, 0.96));
    border-color: rgba(224, 122, 170, 0.45);
}

.result-quota-progress {
    height: 8px;
    border-radius: 999px;
    background: #f1eaf6;
    overflow: hidden;
    margin-bottom: 8px;
}
.result-quota-progress-fill {
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #8fd3a8, #5fbf82);
    transition: width 0.45s ease;
}
.result-quota-progress-fill.warning {
    background: linear-gradient(90deg, #f0c06a, #e3a53a);
}
.result-quota-progress-fill.danger {
    background: linear-gradient(90deg, #ef8f8f, #df6464);
}
.result-quota-meta {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 0.74rem;
    color: var(--text-muted);
    margin-bottom: 14px;
}
.result-quota-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding-top: 14px;
    border-top: 1px dashed #eadff2;
}
.result-quota-stat {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}
.result-quota-stat-label {
    font-size: 0.72rem;
    color: var(--text-muted);
    font-weight: 600;
}
.result-quota-stat-value {
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--text);
    word-break: break-word;
}
.result-quota-stat.is-highlight .result-quota-stat-value {
    color: #d4647e;
}
.result-info-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.result-info-item {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 10px;
    align-items: start;
    padding: 10px 12px;
    background: #faf8fc;
    border-radius: var(--radius-sm);
    border: 1px solid #f0eaf5;
}
.result-info-label {
    font-size: 0.78rem;
    color: var(--text-muted);
    font-weight: 600;
    line-height: 1.5;
}
.result-info-value {
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--text);
    word-break: break-all;
    line-height: 1.5;
}
.result-info-value.result-mono {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 0.8rem;
}
.result-api-key-wrap {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.result-api-key-text {
    word-break: break-all;
}
.result-key-toggle {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    padding: 0;
    border: none;
    border-radius: 6px;
    background: transparent;
    color: var(--text-muted);
    cursor: pointer;
    transition: var(--transition);
}
.result-key-toggle:hover {
    color: #7a5ea8;
    background: #f3edf8;
}
.result-remark-text {
    font-size: 0.86rem;
    color: var(--text);
    line-height: 1.55;
    word-break: break-word;
}
.result-error-card {
    text-align: center;
    padding: 24px 18px;
    background: #fff8f8;
    border: 1.5px solid #f5d4d4;
    border-radius: calc(var(--radius) + 2px);
}
.result-error-icon {
    color: #c95555;
    margin-bottom: 8px;
}
.result-error-icon .svg-icon {
    width: 28px;
    height: 28px;
}
.result-error-title {
    font-size: 1rem;
    font-weight: 700;
    color: #c95555;
    margin-bottom: 6px;
}
.result-error-message {
    font-size: 0.86rem;
    color: #a84848;
    line-height: 1.5;
}

/* 兼容旧类名（如有引用） */
.result-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 12px;
}
.result-item {
    background: #fdfcfe;
    border-radius: var(--radius);
    padding: 14px 16px;
    border: 1.5px solid #f0eaf5;
}
.result-item .result-label {
    font-size: 0.75rem;
    color: var(--text-muted);
    letter-spacing: 0.5px;
    margin-bottom: 4px;
    font-weight: 600;
}
.result-item .result-value {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
    word-break: break-word;
}
.result-item .result-value.status-ok {
    color: #3da863;
}
.result-item .result-value.status-err {
    color: #c95555;
}

.query-qr-panel {
    padding-top: 4px;
    border-top: 1px dashed #eadff2;
}
.query-qr-title {
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-muted);
    text-align: center;
    margin-bottom: 14px;
    letter-spacing: 0.3px;
}
.query-qr-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}
.query-qr-card {
    margin: 0;
    background: linear-gradient(180deg, #fefcff 0%, #faf7fc 100%);
    border: 1.5px solid #efe6f5;
    border-radius: calc(var(--radius) + 2px);
    padding: 14px 12px 12px;
    text-align: center;
    transition: var(--transition);
}
.query-qr-card:hover {
    border-color: #e0d4ec;
    box-shadow: 0 4px 16px rgba(100, 70, 130, 0.08);
    transform: translateY(-1px);
}
.query-qr-card img {
    display: block;
    width: min(100%, 180px);
    height: auto;
    margin: 0 auto;
    border-radius: 12px;
    background: #fff;
}

.query-hint {
    margin: 10px 0 0;
    display: flex;
    justify-content: center;
}
.query-hint-inner {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: 100%;
    padding: 8px 14px;
    border-radius: 999px;
    background: linear-gradient(135deg, #f8f4fb, #f2f6fc);
    border: 1px solid #ebe3f0;
    font-size: 0.78rem;
    line-height: 1.4;
    color: var(--text-muted);
    text-align: center;
}
.query-hint-inner .svg-icon {
    flex-shrink: 0;
    width: 14px;
    height: 14px;
    color: #8bb8e8;
}

.app-modal[hidden] {
    display: none !important;
}
.app-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.app-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(61, 48, 85, 0.35);
    backdrop-filter: blur(4px);
}
.app-modal-panel {
    position: relative;
    width: 100%;
    max-width: 440px;
    background: #fff;
    border-radius: var(--radius-lg);
    padding: 24px 22px 20px;
    box-shadow: var(--shadow-lg);
    border: 1.5px solid var(--border-light);
    animation: appModalIn 0.22s ease-out;
}
@keyframes appModalIn {
    from {
        opacity: 0;
        transform: translateY(12px) scale(0.97);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}
.app-modal-title {
    margin: 0 0 8px;
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--text);
}
.app-modal-desc,
.app-modal-note {
    margin: 0 0 14px;
    font-size: 0.82rem;
    color: var(--text-muted);
    line-height: 1.55;
}
.app-modal-note {
    margin-top: 8px;
    margin-bottom: 0;
    font-size: 0.76rem;
}
.app-field-label {
    display: block;
    margin-bottom: 6px;
    font-size: 0.82rem;
    font-weight: 600;
    color: var(--text-secondary);
}
.app-field-input {
    width: 100%;
    padding: 12px 14px;
    border: 2px solid #e8dff2;
    border-radius: 12px;
    font-size: 0.9rem;
    font-family: var(--font);
    color: var(--text);
    background: #fdfcfe;
    outline: none;
    transition: var(--transition);
}
.app-field-input:focus {
    border-color: #b8c8e8;
    box-shadow: 0 0 0 4px rgba(139, 184, 232, 0.10);
    background: #fff;
}
.app-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 18px;
}
.app-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 16px;
    border-radius: 10px;
    border: 1.5px solid var(--border);
    background: #fff;
    color: var(--text-secondary);
    font-size: 0.86rem;
    font-family: inherit;
    cursor: pointer;
    transition: var(--transition);
}
.app-btn:hover {
    border-color: #c5ddf6;
    color: #5b8ec9;
}
.app-btn.primary {
    background: linear-gradient(135deg, #8bb8e8, #6b9ed8);
    color: #fff;
    border-color: transparent;
}
.app-btn.primary:hover {
    color: #fff;
    box-shadow: 0 4px 14px rgba(91, 142, 201, 0.35);
}

.app-toast {
    position: fixed;
    left: 50%;
    bottom: 28px;
    z-index: 1100;
    display: flex;
    align-items: center;
    gap: 10px;
    max-width: min(92vw, 360px);
    padding: 12px 16px;
    border-radius: 12px;
    background: #fff;
    border: 1.5px solid #c8e6d4;
    box-shadow: var(--shadow-lg);
    color: #2d6a4a;
    font-size: 0.88rem;
    font-weight: 600;
    transform: translate(-50%, 16px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.22s ease, transform 0.22s ease;
}
.app-toast.is-visible {
    opacity: 1;
    transform: translate(-50%, 0);
    pointer-events: auto;
}
.app-toast[hidden] {
    display: none !important;
}

/* ========== 返回顶部 ========== */
.back-to-top {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1050;
    width: 46px;
    height: 46px;
    border: 1.5px solid #e0d4ec;
    border-radius: 50%;
    background: linear-gradient(180deg, #fdf8fc, #faf5fc);
    color: var(--blue-400);
    box-shadow: var(--shadow);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(10px);
    transition: opacity 0.22s ease, transform 0.22s ease, visibility 0.22s ease, box-shadow 0.2s ease;
}
.back-to-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}
.back-to-top:hover {
    border-color: #c5ddf6;
    box-shadow: var(--shadow-lg);
    color: var(--blue-500);
}
.back-to-top:focus-visible {
    outline: 2px solid rgba(91, 142, 201, 0.45);
    outline-offset: 2px;
}

/* ========== 日志区域 ========== */
#logCard {
    display: none;
}
#logCard.show {
    display: block;
}

.log-card {
    margin-bottom: 22px;
}
.log-table-wrap {
    overflow-x: auto;
    border-radius: var(--radius-sm);
    -webkit-overflow-scrolling: touch;
}
.log-table-wrap::-webkit-scrollbar {
    height: 6px;
}
.log-table-wrap::-webkit-scrollbar-track {
    background: #faf8fc;
    border-radius: 8px;
}
.log-table-wrap::-webkit-scrollbar-thumb {
    background: #e0d4ec;
    border-radius: 8px;
}
table.log-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.82rem;
    min-width: 950px;
    white-space: nowrap;
}
table.log-table thead th {
    background: linear-gradient(180deg, #fdf6f9, #f9f1f7);
    padding: 11px 12px;
    text-align: left;
    font-weight: 650;
    color: var(--text);
    font-size: 0.78rem;
    letter-spacing: 0.3px;
    border-bottom: 2px solid #f0e6f4;
    position: sticky;
    top: 0;
    z-index: 2;
}
table.log-table tbody td {
    padding: 10px 12px;
    border-bottom: 1px solid #faf5fc;
    color: var(--text-secondary);
    transition: var(--transition);
}
table.log-table tbody tr {
    transition: var(--transition);
    animation: fadeInUp 0.35s ease-out;
}
table.log-table tbody tr:hover {
    background: rgba(139, 184, 232, 0.04);
}
.badge {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.3px;
}
.badge-stream {
    background: #e8f2fb;
    color: #5b8ec9;
}
.badge-nonstream {
    background: #fde8ee;
    color: #d4647e;
}
.badge-ok {
    background: #e6f7ed;
    color: #3da863;
}
.badge-err {
    background: #fde8e8;
    color: #c95555;
}
.error-detail-cell {
    max-width: 160px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    cursor: pointer;
    color: #c95555;
    font-size: 0.78rem;
}
.error-detail-cell:hover {
    white-space: normal;
    overflow: visible;
    background: #fff;
    position: relative;
    z-index: 5;
    box-shadow: var(--shadow);
    border-radius: 6px;
    padding: 6px 10px;
}
.token-highlight {
    color: #5b8ec9;
    font-weight: 600;
}

.log-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 14px;
    padding-top: 4px;
}
.log-page-btn,
.log-page-current,
.log-page-ellipsis {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    border-radius: 10px;
    font-size: 0.82rem;
    font-family: inherit;
    line-height: 1;
}
.log-page-btn {
    border: 1.5px solid #f0d4e0;
    background: #fff;
    color: var(--text-secondary);
    cursor: pointer;
    transition: var(--transition);
}
.log-page-btn:hover {
    border-color: #e8a8c0;
    color: #d4647e;
    background: #fff8fb;
}
.log-page-current {
    background: linear-gradient(135deg, #f5a8c0, #e888a8);
    color: #fff;
    font-weight: 700;
    border: 1.5px solid transparent;
}
.log-page-ellipsis {
    color: var(--text-muted);
    padding: 0 4px;
}

/* ========== 模型状态监测 ========== */
.monitor-card {
    margin-bottom: 22px;
}
html.monitor-scrolling .monitor-card,
html.monitor-scrolling .monitor-card * {
    transition: none !important;
    animation: none !important;
}
html.monitor-scrolling .decorative-dots .dot {
    animation-play-state: paused !important;
}
html.monitor-scrolling .model-monitor-item {
    pointer-events: none;
}
html.monitor-scrolling .model-monitor-item:hover {
    box-shadow: none;
}
.monitor-groups {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.monitor-group {
    border: 1.5px solid #f0eaf5;
    border-radius: var(--radius);
    background: #fefcff;
    overflow: hidden;
}
.monitor-group-toggle {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    border: 0;
    background: linear-gradient(180deg, #fdf8fc, #faf5fc);
    color: var(--text);
    font-size: 0.86rem;
    font-weight: 650;
    cursor: pointer;
    text-align: left;
    transition: background 0.2s ease;
}
.monitor-group-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 12px 16px;
    background: linear-gradient(180deg, #fdf8fc, #faf5fc);
    color: var(--text);
    font-size: 0.86rem;
    font-weight: 650;
}
.monitor-group.is-static .monitor-group-body {
    display: block;
}
.monitor-subgroups {
    display: flex;
    flex-direction: column;
    gap: 14px;
}
.monitor-subgroup {
    border: 1px solid #f3ebf8;
    border-radius: var(--radius-sm);
    background: #fff;
    overflow: hidden;
}
.monitor-subgroup-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 14px;
    background: #fbf7fd;
    color: var(--text-secondary);
    font-size: 0.8rem;
    font-weight: 650;
}
.monitor-subgroup-count {
    margin-left: auto;
    font-size: 0.72rem;
    color: var(--text-muted);
    font-weight: 600;
}
.monitor-subgroup .monitor-group-grid {
    padding: 12px 14px 14px;
}
.monitor-group-toggle:hover {
    background: #f8f1fa;
}
.monitor-group-toggle .monitor-group-count {
    margin-left: auto;
    font-size: 0.75rem;
    color: var(--text-muted);
    font-weight: 600;
}
.monitor-group-toggle .monitor-group-chevron {
    color: var(--text-muted);
    transition: transform 0.2s ease;
    flex-shrink: 0;
}
.monitor-group.is-open .monitor-group-chevron {
    transform: rotate(180deg);
}
.monitor-group-body {
    display: none;
    padding: 0 14px 14px;
}
.monitor-group.is-open .monitor-group-body {
    display: block;
}
.monitor-group-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}
.monitor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}
.model-monitor-item {
    background: #fdfcfe;
    border-radius: var(--radius);
    padding: 16px 18px;
    border: 1.5px solid #f0eaf5;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
    position: relative;
    overflow: hidden;
    cursor: pointer;
    content-visibility: auto;
    contain-intrinsic-size: auto 120px;
}
.model-monitor-item:hover {
    border-color: #e0d4ec;
    box-shadow: var(--shadow-sm);
}
.model-monitor-item:focus-visible {
    outline: 2px solid rgba(91, 142, 201, 0.45);
    outline-offset: 2px;
}
.model-monitor-item .model-name {
    font-weight: 650;
    font-size: 0.88rem;
    color: var(--text);
    margin-bottom: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    letter-spacing: 0.2px;
}
.model-name-text {
    flex: 1;
    min-width: 0;
}
.model-monitor-item .model-meta {
    font-size: 0.72rem;
    color: var(--text-muted);
    margin-bottom: 10px;
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
}
.model-monitor-item .model-meta.is-failure {
    color: #c96a5e;
}
.model-monitor-item .model-meta.is-failure .label-with-icon {
    font-weight: 600;
}
.status-dot-indicator {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    flex-shrink: 0;
    display: inline-block;
}
.monitor-card .status-dot-indicator {
    animation: none;
    box-shadow: none;
}
.status-dot-indicator.healthy {
    background: #5ec987;
}
.status-dot-indicator.warning {
    background: #f0c24e;
}
.status-dot-indicator.danger {
    background: #e8857a;
}
.progress-bar-wrap {
    width: 100%;
    height: 10px;
    background: #f0eaf5;
    border-radius: 10px;
    overflow: hidden;
    margin-bottom: 6px;
    position: relative;
}
.progress-bar-fill {
    height: 100%;
    border-radius: 10px;
    transition: width 0.8s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
}
.monitor-card .progress-bar-fill {
    transition: none;
}
.progress-bar-fill.healthy {
    background: linear-gradient(90deg, #7dd8a0, #5ec987);
}
.progress-bar-fill.warning {
    background: linear-gradient(90deg, #f5d678, #f0c24e);
}
.progress-bar-fill.danger {
    background: linear-gradient(90deg, #f09a90, #e8857a);
}
.progress-label {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 0.76rem;
    color: var(--text-secondary);
}
.progress-label .percent {
    font-weight: 700;
    font-size: 0.85rem;
}
.percent.healthy {
    color: #3da863;
}
.percent.warning {
    color: #d4a430;
}
.percent.danger {
    color: #c95555;
}
.monitor-summary {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-bottom: 16px;
    padding: 14px 18px;
    background: #fdfcfe;
    border-radius: var(--radius);
    border: 1.5px solid #f0eaf5;
}
.monitor-summary .summary-stat {
    text-align: center;
    flex: 1;
    min-width: 70px;
}
.monitor-summary .summary-num {
    font-size: 1.4rem;
    font-weight: 700;
}
.monitor-summary .summary-num.green {
    color: #3da863;
}
.monitor-summary .summary-num.yellow {
    color: #d4a430;
}
.monitor-summary .summary-num.red {
    color: #c95555;
}
.monitor-summary .summary-label {
    font-size: 0.72rem;
    color: var(--text-muted);
}

/* ========== 响应式 ========== */
@media (max-width: 768px) {
    .main-container {
        padding: 10px 10px 30px;
    }
    .header {
        padding: 16px 10px 8px;
    }
    .header h1 {
        font-size: 1.3rem;
    }
    .header .logo-icon .svg-icon {
        width: 26px;
        height: 26px;
    }
    .card {
        padding: 16px 14px;
        border-radius: var(--radius);
    }
    .query-input-row {
        flex-direction: column;
        gap: 10px;
        align-items: stretch;
    }
    .query-input-wrap {
        width: 100%;
        min-width: 0;
    }
    .query-input-wrap input {
        font-size: 16px;
        padding: 14px 48px 14px 42px;
        border-radius: 14px;
    }
    .query-input-wrap .input-icon {
        left: 14px;
    }
    .query-input-toggle {
        right: 10px;
        width: 34px;
        height: 34px;
        border-radius: 10px;
        background: #fdfcfe;
        color: #8a7aa8;
    }
    .query-input-wrap:focus-within .query-input-toggle {
        background: #fff;
    }
    .btn-query {
        width: 100%;
        min-height: 48px;
        text-align: center;
        padding: 14px 16px;
        border-radius: 14px;
        font-size: 1rem;
    }
    .query-result {
        margin-top: 14px;
    }
    .result-summary-card,
    .result-info-card,
    .result-remark-card {
        padding: 14px;
    }
    .result-token-name {
        font-size: 1rem;
    }
    .result-quota-main-value {
        font-size: 1.75rem;
    }
    .result-quota-stats {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .result-unlimited-hero {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
    }
    .result-unlimited-symbol {
        width: 64px;
        height: 64px;
    }
    .result-unlimited-symbol .tier-emblem-icon,
    .result-unlimited-symbol .unlimited-icon {
        width: 34px;
        height: 34px;
    }
    .result-unlimited-value {
        font-size: 2rem;
    }
    .result-unlimited-stats {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .result-unlimited-stat {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .result-tier-hero {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }
    .result-tier-emblem {
        width: 56px;
        height: 56px;
    }
    .result-tier-value {
        font-size: 1.75rem;
    }
    .result-tier-stats {
        grid-template-columns: 1fr;
        gap: 8px;
    }
    .result-tier-stat {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
    .result-quota-stat {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        padding: 8px 10px;
        background: #faf8fc;
        border-radius: var(--radius-sm);
        border: 1px solid #f0eaf5;
    }
    .result-info-item {
        grid-template-columns: 1fr;
        gap: 4px;
    }
    .query-qr-grid {
        grid-template-columns: 1fr;
        gap: 12px;
        max-width: 280px;
        margin: 0 auto;
    }
    .query-qr-card {
        padding: 12px 10px 10px;
    }
    .monitor-grid,
    .monitor-group-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    table.log-table {
        font-size: 0.74rem;
        min-width: 780px;
    }
    table.log-table thead th,
    table.log-table tbody td {
        padding: 7px 8px;
    }
    .section-title {
        font-size: 0.95rem;
    }
    .monitor-summary {
        gap: 8px;
        padding: 10px 12px;
    }
    .monitor-summary .summary-num {
        font-size: 1.1rem;
    }
    .log-pagination {
        gap: 4px;
    }
    .log-page-btn,
    .log-page-current {
        min-width: 30px;
        height: 30px;
        padding: 0 8px;
        font-size: 0.76rem;
    }
    .back-to-top {
        right: 16px;
        bottom: 16px;
        width: 42px;
        height: 42px;
    }
}
@media (max-width: 420px) {
    .result-grid {
        grid-template-columns: 1fr;
    }
    .query-card .section-title {
        font-size: 0.92rem;
    }
    .query-input-wrap input {
        padding: 13px 48px 13px 40px;
        font-size: 15px;
        letter-spacing: 0;
    }
    .query-input-toggle {
        right: 8px;
        width: 36px;
        height: 36px;
    }
    .query-hint-inner {
        font-size: 0.72rem;
        padding: 7px 12px;
        border-radius: 12px;
    }
    .header h1 {
        font-size: 1.15rem;
    }
    .header .logo-area {
        padding: 8px 16px;
        gap: 6px;
    }
    .header .logo-icon .svg-icon {
        width: 22px;
        height: 22px;
    }
    .card {
        padding: 12px 10px;
    }
    .announce-item {
        padding: 10px 12px;
        gap: 6px;
    }
    .announce-item.is-urgent {
        padding-left: 9px;
    }
    .announce-date {
        font-size: 0.66rem;
        padding: 2px 8px;
    }
    .announce-tag {
        font-size: 0.64rem;
        padding: 2px 7px;
    }
    .announce-title {
        font-size: 0.86rem;
    }
    .announce-desc {
        font-size: 0.78rem;
        line-height: 1.55;
    }
}

/* 工具提示 */
.tooltip-hint {
    display: flex;
    align-items: flex-start;
    gap: 4px;
    font-size: 0.7rem;
    color: var(--text-muted);
    margin-top: 4px;
    font-style: italic;
    letter-spacing: 0.2px;
}

/* 加载骨架 */
.skeleton {
    background: linear-gradient(90deg, #f0eaf5 25%, #e8dff2 50%, #f0eaf5 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s ease-in-out infinite;
    border-radius: 6px;
}
@keyframes shimmer {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* 无数据提示 */
.empty-state {
    text-align: center;
    padding: 30px 20px;
    color: var(--text-muted);
}
.empty-state .empty-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 10px;
    color: var(--text-muted);
    opacity: 0.6;
}
.empty-state .empty-icon .svg-icon {
    width: 48px;
    height: 48px;
}

/* SVG 图标 */
.svg-icon {
    display: block;
    width: 1em;
    height: 1em;
    flex-shrink: 0;
}
.svg-icon.xs { width: 12px; height: 12px; }
.svg-icon.sm { width: 14px; height: 14px; }
.svg-icon.md { width: 18px; height: 18px; }
.svg-icon.lg { width: 24px; height: 24px; }
.svg-icon.xl { width: 32px; height: 32px; }
.svg-icon.xxl { width: 48px; height: 48px; }

.label-with-icon {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.btn-query .btn-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: -2px;
    margin-right: 4px;
}

.result-label .svg-icon,
.summary-label .svg-icon {
    vertical-align: -2px;
    margin-right: 2px;
}

.badge .svg-icon {
    display: inline-block;
    width: 11px;
    height: 11px;
    vertical-align: -1px;
    margin-right: 3px;
}

.model-meta .label-with-icon {
    gap: 4px;
}

.status-label-with-dot {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

.status-label-with-dot .svg-icon {
    width: 10px;
    height: 10px;
}

.error-detail-cell .svg-icon {
    display: inline-block;
    width: 12px;
    height: 12px;
    vertical-align: -2px;
    margin-right: 3px;
    color: #c95555;
}

.result-value .svg-icon {
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: -3px;
    margin-right: 4px;
}

.tooltip-hint-icon {
    display: inline-flex;
    flex-shrink: 0;
    margin-top: 1px;
    color: var(--text-muted);
}

.tooltip-hint-icon .svg-icon {
    width: 12px;
    height: 12px;
}

.sync-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(248, 244, 252, 0.82);
    backdrop-filter: blur(6px);
}

.sync-overlay[hidden] {
    display: none !important;
}

.sync-panel {
    min-width: 280px;
    max-width: 90vw;
    padding: 28px 32px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 40px rgba(91, 142, 201, 0.18);
    text-align: center;
}

.sync-spinner {
    width: 42px;
    height: 42px;
    margin: 0 auto 16px;
    border: 3px solid #d8e8f8;
    border-top-color: #5b8ec9;
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}

.sync-message {
    margin: 0 0 8px;
    font-size: 1rem;
    font-weight: 600;
    color: var(--text-primary, #3d3550);
}

.sync-detail {
    margin: 0;
    font-size: 0.84rem;
    color: var(--text-muted, #8a7da0);
}

body.sync-locked {
    overflow: hidden;
}

body.sync-locked .btn-query,
body.sync-locked #tokenInput {
    pointer-events: none;
    opacity: 0.65;
}

/* ===== Hermes reference theme override: deepseek_html_20260618_de9dc8 ===== */
:root {
    --bg: #f5f0f3; --bg-secondary: #faf7f9; --bg-card: #ffffff; --bg-card-hover: #fff5f7; --bg-input: #fefefe; --bg-soft: #faf7f9;
    --border: #e8dce3; --border-light: #f0e6ed; --text: #3d3440; --text-secondary: #6b5e6b; --text-muted: #9a8b96;
    --accent: #e88da8; --accent-light: #f7c5d3; --accent-dark: #d47291; --blue: #7db8d8; --blue-light: #b8d8ee; --blue-dark: #5a9abf;
    --pink: #f0a5bb; --pink-light: #fce4ec; --green: #7ec8a0; --green-light: #d4f1e2; --yellow: #e8c87a; --yellow-light: #fdf3dc; --red: #e88b8b; --red-light: #fde8e8;
    --shadow-sm: 0 2px 12px rgba(180, 150, 165, 0.10); --shadow: 0 2px 16px rgba(180, 150, 165, 0.12); --shadow-lg: 0 8px 32px rgba(180, 150, 165, 0.16);
    --radius: 14px; --radius-sm: 10px; --radius-xs: 6px; --radius-lg: 18px; --radius-xl: 28px; --transition: 0.28s cubic-bezier(0.4, 0, 0.2, 1);
    --nav-bg: rgba(255, 255, 255, 0.85); --nav-blur: blur(18px); --badge-ok: #d4f1e2; --badge-ok-text: #3d8b5e; --badge-err: #fde8e8; --badge-err-text: #c0392b;
    --progress-bg: #f0e6ed; --star-opacity: 0; --accent-glow: rgba(232, 141, 168, 0.25); --scrollbar-thumb: #dcccd5; --scrollbar-track: transparent; --table-stripe: #fdf8fa; --table-header-bg: #fef5f8;
    --blue-100: var(--blue-light); --blue-200: var(--blue-light); --blue-300: var(--blue); --blue-400: var(--blue-dark); --blue-500: var(--blue-dark); --blue-600: #497fa0;
    --pink-100: var(--pink-light); --pink-200: var(--accent-light); --pink-300: var(--pink); --pink-400: var(--accent); --pink-500: var(--accent-dark);
    --green-400: var(--green); --green-500: #4aa876; --yellow-400: var(--yellow); --yellow-500: #caa454; --red-400: var(--red); --red-500: #cc6464;
}
body.theme-dark {
    --bg: #0a0a16; --bg-secondary: #0f0f1f; --bg-card: #15152a; --bg-card-hover: #1c1c38; --bg-input: #1a1a30; --bg-soft: #101023;
    --border: #252540; --border-light: #1e1e38; --text: #dcdce8; --text-secondary: #b0b0c8; --text-muted: #7878a0;
    --accent: #9b7cfc; --accent-light: #b9a4fd; --accent-dark: #7c5ce7; --blue: #6d9cf0; --blue-light: #a0c4ff; --blue-dark: #4a7de0; --pink: #c884f0; --pink-light: #2b2038;
    --green: #5ec9a0; --green-light: #1a3a2e; --yellow: #e0b860; --yellow-light: #2e2618; --red: #e87070; --red-light: #3a1a1a;
    --shadow-sm: 0 2px 16px rgba(0,0,0,.28); --shadow: 0 2px 20px rgba(0,0,0,.35); --shadow-lg: 0 8px 40px rgba(0,0,0,.5);
    --nav-bg: rgba(18, 18, 35, 0.8); --nav-blur: blur(20px); --badge-ok: #1a3a2e; --badge-ok-text: #5ec9a0; --badge-err: #3a1a1a; --badge-err-text: #e87070;
    --progress-bg: #1e1e38; --star-opacity: 1; --accent-glow: rgba(155,124,252,.3); --scrollbar-thumb: #303058; --table-stripe: #181830; --table-header-bg: #1c1c34;
    --blue-100:#152342;--blue-200:#24365c;--blue-300:var(--blue-light);--blue-400:var(--blue);--blue-500:var(--blue-dark);--blue-600:#3d68c5;--pink-100:#2a1d38;--pink-200:#402a59;--pink-300:var(--pink);--pink-400:var(--accent-light);--pink-500:var(--accent);
}
body { background: var(--bg) !important; color: var(--text); transition: background var(--transition), color var(--transition); }
body.theme-dark { background: radial-gradient(circle at 18% 12%, rgba(155,124,252,.14), transparent 30%), radial-gradient(circle at 80% 8%, rgba(109,156,240,.10), transparent 26%), linear-gradient(180deg,#090916 0%,#0a0a16 48%,#0f0f1f 100%) !important; }
body.theme-dark::before, body.theme-dark::after { opacity: 0; }
.stars-container{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:var(--star-opacity);transition:opacity var(--transition)}
.star{position:absolute;border-radius:50%;background:#fff;animation:twinkle var(--dur) ease-in-out infinite;animation-delay:var(--delay);opacity:0;box-shadow:0 0 8px rgba(255,255,255,.65)}
@keyframes twinkle{0%,100%{opacity:.15;transform:scale(1)}50%{opacity:.9;transform:scale(1.8)}}
.main-container{max-width:1100px;padding-top:16px}.header{display:none!important}
.navbar{position:sticky;top:12px;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 20px;margin:0 0 18px;background:var(--nav-bg);backdrop-filter:var(--nav-blur);-webkit-backdrop-filter:var(--nav-blur);border:1px solid var(--border);border-radius:40px;box-shadow:var(--shadow);transition:all var(--transition)}
.navbar .logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:1.2rem;color:var(--text);letter-spacing:-.3px;white-space:nowrap}.navbar .logo .icon-circle{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--blue));display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 0 20px var(--accent-glow)}.navbar .logo .svg-icon{width:22px;height:22px}.theme-toggle{display:flex;align-items:center;gap:8px;background:var(--bg-card);border:2px solid var(--border);border-radius:30px;padding:6px 14px;cursor:pointer;font-size:.9rem;font-weight:600;color:var(--text-secondary);transition:all var(--transition);white-space:nowrap;user-select:none}.theme-toggle:hover{border-color:var(--accent);color:var(--accent-dark);box-shadow:0 0 18px var(--accent-glow)}.theme-toggle .toggle-icon{font-size:1.2rem;transition:transform var(--transition)}.theme-toggle:active .toggle-icon{transform:rotate(30deg) scale(1.2)}
.card,.announcement-card,.query-card,.log-card,.monitor-card,.result-detail-card,.result-summary-card,.result-info-card,.result-remark-card,.result-quota-card,.result-quota-panel,.result-quota-tier-card,.result-quota-unlimited-card,.summary-stat,.monitor-group,.monitor-model-item,.query-qr-panel,.app-modal-panel{background:var(--bg-card)!important;border-color:var(--border)!important;color:var(--text)!important;box-shadow:var(--shadow)!important}.card,.announcement-card{border-radius:var(--radius)!important}.card:hover,.announcement-card:hover,.result-detail-card:hover,.monitor-group:hover{box-shadow:var(--shadow-lg)!important;border-color:var(--border-light)!important}.card::after{background:linear-gradient(90deg,var(--accent),var(--blue))!important}.card.card-blue::after{background:linear-gradient(90deg,var(--blue),var(--accent))!important}.card.card-pink::after{background:linear-gradient(90deg,var(--accent),var(--pink))!important}
.section-title,.announce-header,.result-detail-title,.query-qr-title,.app-modal-title{color:var(--text)!important}.subtitle,.query-hint,.tooltip-hint,.announce-desc,.result-detail-info-label,.result-section-label,.result-quota-item-label,.summary-label,.monitor-model-meta,.monitor-group-subtitle,.app-modal-desc{color:var(--text-muted)!important}.announce-item,.result-quota-item,.result-tier-stat,.result-unlimited-stat,.monitor-model-item,.log-pagination button,.page-btn{background:transparent!important;border-color:var(--border-light)!important;color:var(--text-secondary)!important}.announce-item:hover,.result-quota-item:hover,.monitor-model-item:hover,.log-pagination button:hover,.page-btn:hover{background:var(--bg-card-hover)!important;border-color:var(--accent)!important}
.announce-date,.announce-tag,.result-status-badge.is-success,.status-healthy,.cell-ok,.badge-stream-true{background:var(--badge-ok)!important;color:var(--badge-ok-text)!important;border-color:transparent!important}body.theme-dark .announce-date,body.theme-dark .announce-tag{background:rgba(155,124,252,.15)!important;color:var(--accent-light)!important}.result-status-badge.is-error,.status-danger,.cell-error{background:var(--badge-err)!important;color:var(--badge-err-text)!important}.badge-stream-false,.status-warning{background:var(--yellow-light)!important;color:var(--yellow)!important}.icon-dot.blue{background:var(--blue)!important;box-shadow:0 0 10px rgba(125,184,216,.35)!important}.icon-dot.pink{background:var(--accent)!important;box-shadow:0 0 10px var(--accent-glow)!important}.icon-dot.green{background:var(--green)!important;box-shadow:0 0 10px rgba(126,200,160,.35)!important}
.query-input-wrap input,.app-field-input{background:var(--bg-input)!important;color:var(--text)!important;border:2px solid var(--border)!important;border-radius:30px!important}.query-input-wrap input:focus,.app-field-input:focus{border-color:var(--accent)!important;box-shadow:0 0 0 6px var(--accent-glow)!important}.query-input-wrap .input-icon,.query-input-toggle,.query-settings-btn{color:var(--text-muted)!important}.query-input-toggle:hover,.query-settings-btn:hover,.query-settings-btn.is-active{color:var(--accent-dark)!important;border-color:var(--accent)!important;box-shadow:0 0 18px var(--accent-glow)!important}.btn-query,.app-btn.primary,.result-detail-btn.is-primary{background:linear-gradient(135deg,var(--accent),var(--accent-dark))!important;color:#fff!important;box-shadow:0 4px 18px var(--accent-glow)!important}.btn-query:hover,.app-btn.primary:hover,.result-detail-btn.is-primary:hover{transform:translateY(-2px);box-shadow:0 8px 28px var(--accent-glow)!important}.app-btn,.result-detail-btn.is-outline{background:var(--bg-card)!important;color:var(--text-secondary)!important;border-color:var(--border)!important}
.log-table-wrap,.table-wrapper{border-color:var(--border)!important;background:var(--bg-card)!important}.log-table th,table th{background:var(--table-header-bg)!important;color:var(--text-secondary)!important;border-color:var(--border)!important}.log-table td,table td{border-color:var(--border-light)!important;color:var(--text-secondary)!important}.log-table tbody tr:nth-child(even),table tbody tr:nth-child(even){background:var(--table-stripe)!important}.log-table tbody tr:hover,table tbody tr:hover{background:var(--bg-card-hover)!important}.result-detail-card::before,.result-quota-progress-fill,.progress-bar-inner{background:linear-gradient(135deg,var(--accent),var(--blue))!important}.result-quota-progress-track,.progress-bar-outer{background:var(--progress-bg)!important}.result-quota-item-value,.result-detail-info-value,.result-token-name,.cell-token-name,.cell-model,.cell-cost{color:var(--text)!important}.result-quota-item-value.is-remain,.highlight{color:var(--green)!important}.result-quota-item-value.is-used{color:var(--accent)!important}.result-detail-info-value.is-link,.result-api-address-text.is-link,.result-website-address-text.is-link{color:var(--blue-dark)!important}body.theme-dark .result-detail-info-value.is-link,body.theme-dark .result-api-address-text.is-link,body.theme-dark .result-website-address-text.is-link{color:var(--blue-light)!important}
.result-quota-tier-card[class*="tier-"] .result-tier-badge,.result-quota-tier-card[class*="tier-"] .result-tier-emblem,.result-quota-tier-card[class*="tier-"] .result-tier-value,.result-quota-tier-card[class*="tier-"] .result-tier-stat.is-primary .result-tier-stat-value{color:var(--accent-dark)!important;background:rgba(232,141,168,.12)!important;border-color:var(--border)!important}body.theme-dark .result-quota-tier-card[class*="tier-"] .result-tier-badge,body.theme-dark .result-quota-tier-card[class*="tier-"] .result-tier-emblem,body.theme-dark .result-quota-tier-card[class*="tier-"] .result-tier-value,body.theme-dark .result-quota-tier-card[class*="tier-"] .result-tier-stat.is-primary .result-tier-stat-value{color:var(--accent-light)!important;background:rgba(155,124,252,.16)!important}.result-tier-aurora,.result-unlimited-aurora{background:radial-gradient(circle at 70% 25%,var(--accent-glow),transparent 46%)!important}.monitor-summary{gap:12px}.monitor-group-header,.monitor-group-body{border-color:var(--border-light)!important}.monitor-progress-track{background:var(--progress-bg)!important}.monitor-progress-fill{background:linear-gradient(90deg,var(--green),var(--blue))!important}.empty-state{color:var(--text-muted)!important}.app-modal-backdrop{background:rgba(10,10,22,.58)!important;backdrop-filter:blur(6px)}.app-toast{background:var(--bg-card)!important;color:var(--text)!important;border:1px solid var(--border)!important;box-shadow:var(--shadow-lg)!important}.back-to-top{background:var(--bg-card)!important;color:var(--accent-dark)!important;border-color:var(--border)!important;box-shadow:var(--shadow)!important}.back-to-top:hover{background:linear-gradient(135deg,var(--accent),var(--accent-dark))!important;color:#fff!important}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:var(--scrollbar-thumb);border-radius:999px}::-webkit-scrollbar-track{background:var(--scrollbar-track)}@media(max-width:640px){.navbar{border-radius:24px;align-items:flex-start}.navbar .logo{font-size:1rem}.theme-toggle{width:100%;justify-content:center}}
/* ===== /Hermes reference theme override ===== */

/* ===== Hermes dark cleanup override: eliminate light leftovers ===== */
body.theme-dark .decorative-dots .dot {
    background: var(--accent-light) !important;
    opacity: .22 !important;
    box-shadow: 0 0 12px var(--accent-glow) !important;
}
body.theme-dark .card,
body.theme-dark .announcement-card,
body.theme-dark .query-card,
body.theme-dark .log-card,
body.theme-dark .monitor-card,
body.theme-dark .result-detail-card,
body.theme-dark .result-summary-card,
body.theme-dark .result-info-card,
body.theme-dark .result-remark-card,
body.theme-dark .result-quota-card,
body.theme-dark .result-quota-panel,
body.theme-dark .result-quota-tier-card,
body.theme-dark .result-quota-unlimited-card,
body.theme-dark .result-error-card,
body.theme-dark .query-qr-panel,
body.theme-dark .query-qr-card,
body.theme-dark .app-modal-panel,
body.theme-dark .monitor-group,
body.theme-dark .monitor-subgroup,
body.theme-dark .model-monitor-item,
body.theme-dark .monitor-summary,
body.theme-dark .summary-stat {
    background: linear-gradient(180deg, rgba(21,21,42,.98), rgba(17,17,35,.98)) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
    box-shadow: var(--shadow) !important;
}
body.theme-dark .card:hover,
body.theme-dark .announcement-card:hover,
body.theme-dark .monitor-group:hover,
body.theme-dark .model-monitor-item:hover,
body.theme-dark .result-quota-item:hover,
body.theme-dark .query-qr-card:hover {
    background: var(--bg-card-hover) !important;
    border-color: var(--accent) !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.45), 0 0 22px rgba(155,124,252,.12) !important;
}
body.theme-dark .announce-header,
body.theme-dark .section-title,
body.theme-dark .query-section-title,
body.theme-dark .result-detail-title,
body.theme-dark .result-token-name,
body.theme-dark .result-detail-info-value,
body.theme-dark .result-quota-item-value,
body.theme-dark .result-tier-value,
body.theme-dark .result-unlimited-value,
body.theme-dark .model-monitor-item .model-name,
body.theme-dark .monitor-group-title,
body.theme-dark .monitor-subgroup-title,
body.theme-dark .app-modal-title,
body.theme-dark .query-qr-title {
    color: var(--text) !important;
}
body.theme-dark .announce-desc,
body.theme-dark .announce-title,
body.theme-dark .query-hint,
body.theme-dark .tooltip-hint,
body.theme-dark .result-detail-info-label,
body.theme-dark .result-section-label,
body.theme-dark .result-quota-item-label,
body.theme-dark .result-tier-stat-label,
body.theme-dark .result-unlimited-stat-label,
body.theme-dark .summary-label,
body.theme-dark .model-monitor-item .model-meta,
body.theme-dark .monitor-group-subtitle,
body.theme-dark .monitor-subgroup-count,
body.theme-dark .empty-state,
body.theme-dark .app-modal-desc,
body.theme-dark .app-modal-note,
body.theme-dark .app-field-label {
    color: var(--text-secondary) !important;
}
body.theme-dark .announce-scroll-wrap,
body.theme-dark .announce-item,
body.theme-dark .result-detail-info-line,
body.theme-dark .result-detail-notice,
body.theme-dark .result-quota-item,
body.theme-dark .result-tier-stat,
body.theme-dark .result-unlimited-stat,
body.theme-dark .monitor-group-header,
body.theme-dark .monitor-group-toggle,
body.theme-dark .monitor-subgroup-header,
body.theme-dark .monitor-group-body,
body.theme-dark .log-pagination,
body.theme-dark .pagination-info,
body.theme-dark .app-modal-actions {
    background: transparent !important;
    border-color: var(--border-light) !important;
    color: var(--text-secondary) !important;
}
body.theme-dark .query-input-wrap input,
body.theme-dark .app-field-input,
body.theme-dark input,
body.theme-dark textarea,
body.theme-dark select {
    background: var(--bg-input) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
    box-shadow: none !important;
}
body.theme-dark .query-input-wrap input::placeholder,
body.theme-dark .app-field-input::placeholder,
body.theme-dark input::placeholder {
    color: var(--text-muted) !important;
}
body.theme-dark .query-settings-btn,
body.theme-dark .query-input-toggle,
body.theme-dark .result-detail-btn.is-outline,
body.theme-dark .app-btn,
body.theme-dark .log-pagination button,
body.theme-dark .page-btn,
body.theme-dark .back-to-top {
    background: rgba(21,21,42,.92) !important;
    color: var(--text-secondary) !important;
    border-color: var(--border) !important;
}
body.theme-dark .query-settings-btn:hover,
body.theme-dark .query-settings-btn.is-active,
body.theme-dark .query-input-toggle:hover,
body.theme-dark .result-detail-btn.is-outline:hover,
body.theme-dark .app-btn:hover,
body.theme-dark .log-pagination button:hover,
body.theme-dark .page-btn:hover {
    background: var(--bg-card-hover) !important;
    color: var(--accent-light) !important;
    border-color: var(--accent) !important;
}
body.theme-dark .btn-query,
body.theme-dark .app-btn.primary,
body.theme-dark .result-detail-btn.is-primary,
body.theme-dark .back-to-top:hover {
    background: linear-gradient(135deg, var(--accent), var(--accent-dark)) !important;
    color: #fff !important;
    border-color: transparent !important;
}
body.theme-dark .log-table-wrap,
body.theme-dark .table-wrapper,
body.theme-dark table,
body.theme-dark .log-table {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
    color: var(--text-secondary) !important;
}
body.theme-dark .log-table th,
body.theme-dark table th {
    background: var(--table-header-bg) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
body.theme-dark .log-table td,
body.theme-dark table td {
    background: transparent !important;
    color: var(--text-secondary) !important;
    border-color: var(--border-light) !important;
}
body.theme-dark .log-table tbody tr:nth-child(even),
body.theme-dark table tbody tr:nth-child(even) {
    background: var(--table-stripe) !important;
}
body.theme-dark .log-table tbody tr:hover,
body.theme-dark table tbody tr:hover {
    background: var(--bg-card-hover) !important;
}
body.theme-dark .badge-stream-true,
body.theme-dark .cell-ok,
body.theme-dark .status-healthy,
body.theme-dark .result-status-badge.is-success {
    background: rgba(94,201,160,.14) !important;
    color: var(--green) !important;
}
body.theme-dark .badge-stream-false,
body.theme-dark .status-warning {
    background: rgba(224,184,96,.14) !important;
    color: var(--yellow) !important;
}
body.theme-dark .cell-error,
body.theme-dark .status-danger,
body.theme-dark .result-status-badge.is-error,
body.theme-dark .result-error-card {
    background: rgba(232,112,112,.12) !important;
    color: var(--red) !important;
    border-color: rgba(232,112,112,.22) !important;
}
body.theme-dark .announce-date,
body.theme-dark .announce-tag,
body.theme-dark .result-tier-badge,
body.theme-dark .result-tier-emblem,
body.theme-dark .result-unlimited-badge,
body.theme-dark .result-unlimited-symbol,
body.theme-dark .result-tier-stat.is-primary,
body.theme-dark .result-unlimited-stat.is-primary,
body.theme-dark .monitor-card .status-dot-indicator {
    background: rgba(155,124,252,.16) !important;
    color: var(--accent-light) !important;
    border-color: rgba(155,124,252,.24) !important;
}
body.theme-dark .result-quota-tier-card[class*="tier-"],
body.theme-dark .result-quota-tier-card.tier-1000,
body.theme-dark .result-quota-tier-card.tier-2000,
body.theme-dark .result-quota-tier-card.tier-3000,
body.theme-dark .result-quota-tier-card.tier-4000,
body.theme-dark .result-quota-tier-card.tier-5000,
body.theme-dark .result-quota-tier-card.tier-6000,
body.theme-dark .result-quota-tier-card.tier-7000,
body.theme-dark .result-quota-tier-card.tier-8000,
body.theme-dark .result-quota-tier-card.tier-9000,
body.theme-dark .result-quota-tier-card.tier-10000 {
    background: linear-gradient(145deg, rgba(21,21,42,.98), rgba(16,16,33,.98)) !important;
    border-color: var(--border) !important;
}
body.theme-dark .result-tier-aurora,
body.theme-dark .result-unlimited-aurora,
body.theme-dark .result-quota-tier-card.tier-1000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-2000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-3000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-4000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-5000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-6000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-7000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-8000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-9000 .result-tier-aurora,
body.theme-dark .result-quota-tier-card.tier-10000 .result-tier-aurora {
    background: radial-gradient(circle at 72% 22%, rgba(155,124,252,.22), transparent 45%) !important;
}
body.theme-dark .result-tier-badge,
body.theme-dark .result-tier-emblem,
body.theme-dark .result-tier-value,
body.theme-dark .result-tier-stat.is-primary .result-tier-stat-value,
body.theme-dark .result-unlimited-stat-value,
body.theme-dark .summary-num,
body.theme-dark .summary-num.green,
body.theme-dark .summary-num.yellow,
body.theme-dark .summary-num.red {
    color: var(--accent-light) !important;
}
body.theme-dark .result-quota-progress-track,
body.theme-dark .monitor-card .progress-bar-track,
body.theme-dark .progress-bar-outer,
body.theme-dark .skeleton-line {
    background: var(--progress-bg) !important;
}
body.theme-dark .result-quota-progress-fill,
body.theme-dark .monitor-card .progress-bar-fill,
body.theme-dark .monitor-progress-fill,
body.theme-dark .progress-bar-inner {
    background: linear-gradient(90deg, var(--green), var(--blue)) !important;
}
body.theme-dark .query-qr-card img {
    background: #fff !important;
    border-radius: 10px;
}
body.theme-dark .app-modal-backdrop {
    background: rgba(5,5,14,.72) !important;
    backdrop-filter: blur(8px) !important;
}
body.theme-dark .app-toast {
    background: var(--bg-card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}
/* ===== /Hermes dark cleanup override ===== */

/* ===== Hermes announcement/query reference refinement ===== */
.section,
.announcement-section {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    padding: 22px 24px !important;
    margin-bottom: 16px !important;
    box-shadow: var(--shadow) !important;
    transition: all var(--transition) !important;
    position: relative !important;
    overflow: hidden !important;
    color: var(--text) !important;
}
.section:hover,
.announcement-section:hover {
    box-shadow: var(--shadow-lg) !important;
    border-color: var(--border-light) !important;
}
.section-header {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 16px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    font-weight: 700 !important;
    font-size: 1.05rem !important;
    color: var(--text) !important;
    letter-spacing: -0.2px !important;
}
.section-header .dot {
    width: 10px !important;
    height: 10px !important;
    border-radius: 50% !important;
    flex-shrink: 0 !important;
}
.dot-accent { background: var(--accent) !important; box-shadow: 0 0 10px var(--accent-glow) !important; }
.dot-blue { background: var(--blue) !important; box-shadow: 0 0 10px rgba(125,184,216,.35) !important; }
.dot-green { background: var(--green) !important; box-shadow: 0 0 10px rgba(126,200,160,.35) !important; }
.section-header .announce-count {
    margin-left: auto !important;
    color: var(--text-muted) !important;
    font-size: .75rem !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
}
.announcement-list {
    max-height: 150px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 6px 0 0 !important;
    scroll-behavior: smooth !important;
    scrollbar-width: thin !important;
    user-select: auto !important;
    touch-action: auto !important;
    pointer-events: auto !important;
}
.announcement-list::-webkit-scrollbar { width: 4px !important; height: 4px !important; display: block !important; }
.announcement-list::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb) !important; border-radius: 4px !important; }
.announcement-list::-webkit-scrollbar-track { background: var(--scrollbar-track) !important; }
.announcement-item {
    display: flex !important;
    flex-direction: row !important;
    gap: 12px !important;
    align-items: flex-start !important;
    padding: 10px 12px !important;
    border-radius: var(--radius-xs) !important;
    transition: all var(--transition) !important;
    border: 0 !important;
    border-left: 3px solid transparent !important;
    margin-bottom: 2px !important;
    background: transparent !important;
    color: var(--text-secondary) !important;
}
.announcement-item:hover,
.announcement-item.is-urgent:hover {
    background: var(--bg-card-hover) !important;
    border-left-color: var(--accent) !important;
}
.announcement-date {
    font-size: .73rem !important;
    font-weight: 600 !important;
    color: var(--accent-dark) !important;
    white-space: nowrap !important;
    min-width: 72px !important;
    background: var(--pink-light) !important;
    padding: 3px 8px !important;
    border-radius: 12px !important;
    text-align: center !important;
    line-height: 1.45 !important;
    flex-shrink: 0 !important;
}
body.theme-dark .announcement-date {
    background: rgba(155,124,252,.15) !important;
    color: var(--accent-light) !important;
}
.announcement-content {
    display: block !important;
    font-size: .88rem !important;
    color: var(--text-secondary) !important;
    line-height: 1.5 !important;
    min-width: 0 !important;
}
.announcement-title {
    display: inline !important;
    color: var(--text-secondary) !important;
    font-size: inherit !important;
    font-weight: 600 !important;
}
.announcement-desc {
    display: inline !important;
    color: var(--text-muted) !important;
    font-size: inherit !important;
    margin-left: 6px !important;
    line-height: inherit !important;
}
.announcement-item.is-urgent {
    background: transparent !important;
    border-left-color: rgba(232,141,168,.55) !important;
    padding-left: 12px !important;
}
.announcement-item .announce-tag {
    align-self: flex-start !important;
    background: var(--pink-light) !important;
    color: var(--accent-dark) !important;
    padding: 2px 8px !important;
    border-radius: 12px !important;
    font-size: .68rem !important;
    font-weight: 700 !important;
    flex-shrink: 0 !important;
}
body.theme-dark .announcement-section,
body.theme-dark .section {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}
body.theme-dark .section-header { color: var(--text) !important; background: transparent !important; }
body.theme-dark .announcement-item { background: transparent !important; color: var(--text-secondary) !important; border-color: transparent !important; }
body.theme-dark .announcement-item:hover { background: var(--bg-card-hover) !important; border-left-color: var(--accent) !important; }
body.theme-dark .announcement-content,
body.theme-dark .announcement-title { color: var(--text-secondary) !important; }
body.theme-dark .announcement-desc { color: var(--text-muted) !important; }
body.theme-dark .announcement-item .announce-tag { background: rgba(155,124,252,.15) !important; color: var(--accent-light) !important; }

.query-card {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow) !important;
}
body.theme-dark .query-card { background: var(--bg-card) !important; border-color: var(--border) !important; }
.query-input-wrap input,
body.theme-dark .query-input-wrap input {
    background: var(--bg-input) !important;
    color: var(--text) !important;
    border: 2px solid var(--border) !important;
    border-radius: 30px !important;
    box-shadow: none !important;
    -webkit-text-fill-color: var(--text) !important;
    caret-color: var(--accent) !important;
}
.query-input-wrap input:focus,
body.theme-dark .query-input-wrap input:focus {
    background: var(--bg-input) !important;
    border-color: var(--accent) !important;
    box-shadow: 0 0 0 6px var(--accent-glow) !important;
}
body.theme-dark .query-input-wrap,
body.theme-dark .query-input-row { background: transparent !important; }
body.theme-dark .query-input-wrap input:-webkit-autofill,
body.theme-dark .query-input-wrap input:-webkit-autofill:hover,
body.theme-dark .query-input-wrap input:-webkit-autofill:focus,
body.theme-dark input:-webkit-autofill,
body.theme-dark input:-webkit-autofill:hover,
body.theme-dark input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
    box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
    -webkit-text-fill-color: var(--text) !important;
    border-color: var(--border) !important;
    caret-color: var(--accent) !important;
    transition: background-color 9999s ease-out 0s !important;
}
body.theme-dark .query-input-wrap .input-icon,
body.theme-dark .query-input-toggle { color: var(--text-muted) !important; }
body.theme-dark .query-input-wrap:focus-within .input-icon { color: var(--accent-light) !important; }
/* ===== /Hermes announcement/query reference refinement ===== */

/* ===== Hermes query light/dark exact fix ===== */
body:not(.theme-dark) .query-card,
body:not(.theme-dark) #queryCard {
    background: #ffffff !important;
    border-color: #e8dce3 !important;
    color: #3d3440 !important;
    box-shadow: 0 2px 16px rgba(180, 150, 165, 0.12) !important;
}
body:not(.theme-dark) .query-input-wrap,
body:not(.theme-dark) .query-input-row {
    background: transparent !important;
}
body:not(.theme-dark) .query-input-wrap input,
body:not(.theme-dark) #tokenInput {
    background: #fefefe !important;
    color: #3d3440 !important;
    -webkit-text-fill-color: #3d3440 !important;
    border-color: #e8dce3 !important;
    caret-color: #e88da8 !important;
    box-shadow: none !important;
}
body:not(.theme-dark) .query-input-wrap input:focus,
body:not(.theme-dark) #tokenInput:focus {
    background: #fefefe !important;
    border-color: #e88da8 !important;
    box-shadow: 0 0 0 6px rgba(232, 141, 168, 0.25) !important;
}
body:not(.theme-dark) .query-input-wrap input:-webkit-autofill,
body:not(.theme-dark) .query-input-wrap input:-webkit-autofill:hover,
body:not(.theme-dark) .query-input-wrap input:-webkit-autofill:focus,
body:not(.theme-dark) #tokenInput:-webkit-autofill,
body:not(.theme-dark) #tokenInput:-webkit-autofill:hover,
body:not(.theme-dark) #tokenInput:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #fefefe inset !important;
    box-shadow: 0 0 0 1000px #fefefe inset !important;
    -webkit-text-fill-color: #3d3440 !important;
    border-color: #e8dce3 !important;
    caret-color: #e88da8 !important;
    transition: background-color 9999s ease-out 0s !important;
}
body:not(.theme-dark) .query-hint-inner {
    background: linear-gradient(135deg, #f8f4fb, #f2f6fc) !important;
    border-color: #ebe3f0 !important;
    color: #9a8b96 !important;
    box-shadow: none !important;
}
body:not(.theme-dark) .query-hint-inner .svg-icon {
    color: #7db8d8 !important;
}
body.theme-dark .query-card,
body.theme-dark #queryCard {
    background: #15152a !important;
    border-color: #252540 !important;
    color: #dcdce8 !important;
    box-shadow: 0 2px 20px rgba(0,0,0,.35) !important;
}
body.theme-dark .query-input-wrap,
body.theme-dark .query-input-row {
    background: transparent !important;
}
body.theme-dark .query-input-wrap input,
body.theme-dark #tokenInput {
    background: #1a1a30 !important;
    color: #dcdce8 !important;
    -webkit-text-fill-color: #dcdce8 !important;
    border-color: #252540 !important;
    caret-color: #9b7cfc !important;
    box-shadow: none !important;
}
body.theme-dark .query-input-wrap input:focus,
body.theme-dark #tokenInput:focus {
    background: #1a1a30 !important;
    border-color: #9b7cfc !important;
    box-shadow: 0 0 0 6px rgba(155, 124, 252, 0.3) !important;
}
body.theme-dark .query-input-wrap input:-webkit-autofill,
body.theme-dark .query-input-wrap input:-webkit-autofill:hover,
body.theme-dark .query-input-wrap input:-webkit-autofill:focus,
body.theme-dark #tokenInput:-webkit-autofill,
body.theme-dark #tokenInput:-webkit-autofill:hover,
body.theme-dark #tokenInput:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #1a1a30 inset !important;
    box-shadow: 0 0 0 1000px #1a1a30 inset !important;
    -webkit-text-fill-color: #dcdce8 !important;
    border-color: #252540 !important;
    caret-color: #9b7cfc !important;
    transition: background-color 9999s ease-out 0s !important;
}
body.theme-dark .query-hint-inner {
    background: rgba(21, 21, 42, 0.92) !important;
    border: 1px solid #252540 !important;
    color: #b0b0c8 !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.22) !important;
}
body.theme-dark .query-hint-inner .svg-icon {
    color: #b9a4fd !important;
}
/* ===== /Hermes query light/dark exact fix ===== */

/* ===== Hermes announcement original layout + bright dark text ===== */
.announcement-card {
    margin-bottom: 22px !important;
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    border-radius: var(--radius) !important;
    box-shadow: var(--shadow) !important;
    overflow: hidden !important;
    position: relative !important;
    color: var(--text) !important;
}
.announcement-card .announce-header {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 14px 20px !important;
    margin: 0 !important;
    background: var(--table-header-bg) !important;
    border-bottom: 1px solid var(--border-light) !important;
    font-weight: 650 !important;
    font-size: .95rem !important;
    color: var(--text) !important;
    letter-spacing: .4px !important;
}
.announcement-card .announce-header .bell-icon .svg-icon {
    width: 18px !important;
    height: 18px !important;
    color: var(--accent-dark) !important;
}
.announce-header .announce-count {
    margin-left: auto !important;
    color: var(--text-muted) !important;
    font-size: .7rem !important;
    white-space: nowrap !important;
    font-weight: 500 !important;
}
.announce-scroll-wrap {
    padding: 8px 16px !important;
    max-height: none;
}
.announce-scroll-wrap.is-static { overflow: visible !important; }
.announce-scroll-wrap.is-scrollable {
    overflow-x: hidden !important;
    overflow-y: auto !important;
    scroll-behavior: smooth !important;
    scrollbar-width: none !important;
    -ms-overflow-style: none !important;
    user-select: none !important;
    touch-action: none !important;
    pointer-events: none !important;
}
.announce-scroll-wrap.is-scrollable::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
.announce-item {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    padding: 12px 14px !important;
    border-radius: var(--radius-sm) !important;
    transition: var(--transition) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--border-light) !important;
    margin-bottom: 0 !important;
    background: transparent !important;
    color: var(--text-secondary) !important;
}
.announce-item:last-child { border-bottom: none !important; }
.announce-item:hover { background: var(--bg-card-hover) !important; }
.announce-item.is-urgent {
    background: rgba(232,141,168,.08) !important;
    border-left: 3px solid var(--accent) !important;
    padding-left: 11px !important;
}
.announce-item-meta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: wrap !important;
}
.announce-date {
    flex-shrink: 0 !important;
    font-size: .72rem !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--blue), var(--blue-light)) !important;
    padding: 3px 10px !important;
    border-radius: 20px !important;
    white-space: nowrap !important;
    letter-spacing: .2px !important;
    line-height: 1.4 !important;
    min-width: 0 !important;
}
.announce-date.urgent { background: linear-gradient(135deg, var(--pink), var(--accent)) !important; }
.announce-tag {
    flex-shrink: 0 !important;
    font-size: .68rem !important;
    font-weight: 700 !important;
    color: var(--accent-dark) !important;
    background: var(--pink-light) !important;
    padding: 2px 8px !important;
    border-radius: 20px !important;
    line-height: 1.4 !important;
}
.announce-item-body {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    min-width: 0 !important;
}
.announce-title {
    display: block !important;
    font-size: .94rem !important;
    font-weight: 700 !important;
    color: var(--text) !important;
    line-height: 1.45 !important;
    letter-spacing: .2px !important;
}
.announce-desc {
    display: block !important;
    font-size: .82rem !important;
    color: var(--text-muted) !important;
    line-height: 1.6 !important;
    padding-left: 0 !important;
    border-left: none !important;
    margin-left: 0 !important;
}
.announce-item.is-urgent .announce-desc { color: var(--text-secondary) !important; }
@media (min-width: 769px) {
    .announce-item { flex-direction: row !important; align-items: flex-start !important; gap: 14px !important; padding: 14px 16px !important; }
    .announce-item.is-urgent { padding-left: 13px !important; }
    .announce-item-meta { flex-direction: column !important; align-items: flex-start !important; gap: 6px !important; width: 118px !important; flex-shrink: 0 !important; }
    .announce-item-body { flex: 1 !important; gap: 6px !important; padding-top: 1px !important; }
    .announce-title { font-size: .96rem !important; }
    .announce-desc { font-size: .84rem !important; padding-left: 10px !important; border-left: 2px solid var(--border) !important; }
    .announce-item.is-urgent .announce-desc { border-left-color: var(--accent) !important; }
}
body.theme-dark .announcement-card {
    background: var(--bg-card) !important;
    border-color: var(--border) !important;
    box-shadow: var(--shadow) !important;
}
body.theme-dark .announcement-card .announce-header {
    background: var(--table-header-bg) !important;
    color: #f0f0ff !important;
    border-bottom-color: var(--border) !important;
}
body.theme-dark .announcement-card .announce-header .bell-icon .svg-icon { color: var(--accent-light) !important; }
body.theme-dark .announce-header .announce-count { color: #a8a8c8 !important; }
body.theme-dark .announce-item {
    background: transparent !important;
    border-bottom-color: var(--border-light) !important;
    color: #d4d4e8 !important;
}
body.theme-dark .announce-item:hover { background: var(--bg-card-hover) !important; }
body.theme-dark .announce-item.is-urgent { background: rgba(155,124,252,.10) !important; border-left-color: var(--accent) !important; }
body.theme-dark .announce-title {
    color: #f0f0ff !important;
    text-shadow: 0 0 12px rgba(185,164,253,.10) !important;
}
body.theme-dark .announce-desc {
    color: #c8c8dc !important;
    border-left-color: #303058 !important;
}
body.theme-dark .announce-date {
    background: rgba(155,124,252,.18) !important;
    color: #d8ccff !important;
    border: 1px solid rgba(155,124,252,.28) !important;
}
body.theme-dark .announce-tag {
    background: rgba(155,124,252,.18) !important;
    color: #d8ccff !important;
    border: 1px solid rgba(155,124,252,.28) !important;
}
/* ===== /Hermes announcement original layout + bright dark text ===== */

/* ===== Hermes result API key and log type dark fix ===== */
.result-detail-info-value.result-api-key-wrap,
.result-api-key-wrap {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}
.result-api-key-text.is-secret,
.result-api-key-text {
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
    font-size: .75rem !important;
    letter-spacing: .2px !important;
    word-break: break-all !important;
    cursor: pointer !important;
    transition: background var(--transition), color var(--transition), border-color var(--transition) !important;
}
body:not(.theme-dark) .result-api-key-text.is-secret,
body:not(.theme-dark) .result-api-key-text {
    color: #d47291 !important;
    background: #fefafc !important;
    border: 1px solid #f0e6ed !important;
    padding: 2px 8px !important;
    border-radius: 6px !important;
}
body:not(.theme-dark) .result-api-key-text.is-secret:hover,
body:not(.theme-dark) .result-api-key-text:hover {
    background: #fce4ec !important;
    color: #d47291 !important;
}
body.theme-dark .result-api-key-text.is-secret,
body.theme-dark .result-api-key-text {
    color: var(--accent-light) !important;
    background: rgba(155,124,252,.14) !important;
    border: 1px solid rgba(155,124,252,.26) !important;
    padding: 2px 8px !important;
    border-radius: 6px !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.02) !important;
}
body.theme-dark .result-api-key-text.is-secret:hover,
body.theme-dark .result-api-key-text:hover {
    background: rgba(155,124,252,.22) !important;
    color: #d8ccff !important;
}
.result-key-toggle {
    background: var(--bg-card) !important;
    border: 1px solid var(--border) !important;
    color: var(--text-muted) !important;
}
.result-key-toggle:hover {
    color: var(--accent-dark) !important;
    border-color: var(--accent) !important;
    box-shadow: 0 0 14px var(--accent-glow) !important;
}
body.theme-dark .result-key-toggle {
    background: rgba(21,21,42,.92) !important;
    border-color: var(--border) !important;
    color: var(--text-secondary) !important;
}
body.theme-dark .result-key-toggle:hover {
    background: var(--bg-card-hover) !important;
    color: var(--accent-light) !important;
    border-color: var(--accent) !important;
}
.badge,
.badge-stream,
.badge-nonstream {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    padding: 3px 10px !important;
    border-radius: 20px !important;
    font-size: .72rem !important;
    font-weight: 600 !important;
    letter-spacing: .3px !important;
    line-height: 1.35 !important;
    border: 0 !important;
    white-space: nowrap !important;
}
.badge .svg-icon,
.badge-stream .svg-icon,
.badge-nonstream .svg-icon {
    width: 12px !important;
    height: 12px !important;
}
body:not(.theme-dark) .badge-stream {
    background: #d4f1e2 !important;
    color: #3d8b5e !important;
}
body:not(.theme-dark) .badge-nonstream {
    background: #fce4ec !important;
    color: #d47291 !important;
}
body.theme-dark .badge-stream {
    background: #1a3a2e !important;
    color: #5ec9a0 !important;
}
body.theme-dark .badge-nonstream {
    background: rgba(155,124,252,.15) !important;
    color: #b9a4fd !important;
}
body.theme-dark .badge-stream .svg-icon,
body.theme-dark .badge-nonstream .svg-icon {
    color: currentColor !important;
}
/* ===== /Hermes result API key and log type dark fix ===== */

/* ===== Hermes query success badge refinement ===== */
.result-detail-card::before {
    display: none !important;
    content: none !important;
    background: none !important;
}
.result-detail-status {
    gap: 0 !important;
    padding: 6px 16px !important;
    border-radius: 999px !important;
    font-size: .78rem !important;
    font-weight: 800 !important;
    letter-spacing: .2px !important;
    border: 1px solid transparent !important;
    box-shadow: none !important;
}
.result-detail-status-dot {
    display: none !important;
    content: none !important;
}
body:not(.theme-dark) .result-detail-status {
    background: #d4f1e2 !important;
    color: #3d8b5e !important;
    border-color: rgba(61,139,94,.12) !important;
}
body.theme-dark .result-detail-status {
    background: linear-gradient(135deg, #b9a4fd 0%, #9b7cfc 54%, #7c5ce7 100%) !important;
    color: #ffffff !important;
    border-color: rgba(185,164,253,.42) !important;
    font-weight: 900 !important;
    text-shadow: 0 1px 0 rgba(0,0,0,.18) !important;
    box-shadow: 0 0 22px rgba(155,124,252,.30) !important;
}
body.theme-dark .result-status-badge.is-success {
    background: linear-gradient(135deg, #b9a4fd 0%, #9b7cfc 54%, #7c5ce7 100%) !important;
    color: #ffffff !important;
    border-color: rgba(185,164,253,.42) !important;
    font-weight: 900 !important;
}
/* ===== /Hermes query success badge refinement ===== */

/* ===== Hermes dark golden shimmer progress bar ===== */
body.theme-dark .progress-bar-fill.healthy,
body.theme-dark .monitor-card .progress-bar-fill.healthy,
body.theme-dark .monitor-progress-fill.healthy,
body.theme-dark .model-monitor-item .progress-bar-fill.healthy {
    background: linear-gradient(90deg, #b8860b 0%, #ffd700 30%, #ffec8b 50%, #ffd700 70%, #daa520 100%) !important;
    background-size: 200% 100% !important;
    box-shadow:
        0 0 10px rgba(255, 215, 0, 0.5),
        0 0 20px rgba(255, 215, 0, 0.3),
        0 0 6px rgba(255, 236, 139, 0.6) !important;
    animation: goldenShimmer 2.5s ease-in-out infinite !important;
    border-radius: inherit !important;
}
@keyframes goldenShimmer {
    0%, 100% {
        background-position: 0% 50%;
        box-shadow:
            0 0 10px rgba(255, 215, 0, 0.5),
            0 0 20px rgba(255, 215, 0, 0.3),
            0 0 6px rgba(255, 236, 139, 0.6);
    }
    50% {
        background-position: 100% 50%;
        box-shadow:
            0 0 14px rgba(255, 215, 0, 0.7),
            0 0 28px rgba(255, 215, 0, 0.45),
            0 0 10px rgba(255, 236, 139, 0.8);
    }
}
body.theme-dark .percent.healthy,
body.theme-dark .progress-label .percent.healthy,
body.theme-dark .model-monitor-item .percent.healthy {
    color: #ffd700 !important;
    text-shadow: 0 0 8px rgba(255, 215, 0, 0.4) !important;
}
body.theme-dark .monitor-card .status-dot-indicator.healthy,
body.theme-dark .status-dot-indicator.healthy {
    background: #ffd700 !important;
    box-shadow: 0 0 8px rgba(255, 215, 0, 0.6) !important;
}
/* ===== /Hermes dark golden shimmer progress bar ===== */


/* ===== Hermes monitor search input ===== */
.monitor-search-input {
    margin-left: auto;
    width: 200px;
    max-width: 45%;
    padding: 6px 14px;
    font-size: 0.85rem;
    color: var(--text);
    background: var(--bg-card);
    border: 1px solid var(--border-light);
    border-radius: 999px;
    outline: none;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.monitor-search-input::placeholder { color: var(--text-muted); }
.monitor-search-input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(139, 184, 232, 0.18);
}
@media (max-width: 600px) {
    .monitor-search-input { width: 130px; font-size: 0.8rem; }
}