@layer legacy {
:root { color-scheme: light; --bg0: #fff6e8; --bg1: #ecf6ff; --panel: rgba(255, 252, 246, .88); --panel2: rgba(250, 247, 255, .94); --line: rgba(87, 112, 154, .24); --line2: rgba(87, 112, 154, .14); --text: #24324b; --muted: rgba(68, 88, 118, .74); --soft: rgba(68, 88, 118, .52); --accent: #4fa7de; --accent2: #7ecfba; --accent3: #ffb38e; --accent4: #c7b7ff; --good: #2ea86b; --bad: #e16b6b; --shadow: rgba(141, 162, 189, .34); --hourly-chart-height: clamp(178px, 27vh, 236px); }
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; text-size-adjust: 100%; }
body { margin: 0px; min-height: 100dvh; overflow: hidden; color: var(--text); font-family: "PingFang SC", "Microsoft YaHei", "Courier New", monospace; background: linear-gradient(180deg, var(--bg1), var(--bg0)); }
body::before { content: ""; position: fixed; inset: 0px; pointer-events: none; opacity: 0.22; background-image: linear-gradient(rgba(70, 96, 136, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(70, 96, 136, 0.08) 1px, transparent 1px); background-size: 28px 28px; mask-image: linear-gradient(rgba(0, 0, 0, 0.85), transparent 92%); }
button, input, select { font: inherit; }
.scene { position: fixed; inset: 0px; z-index: 0; overflow: hidden; pointer-events: none; }
.scene-image { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; image-rendering: pixelated; transform: scale(1.04); filter: saturate(0.96) brightness(1.06) contrast(0.96); }
.scene-overlay, .scene-particles { position: absolute; inset: 0px; }
.scene-overlay { background: linear-gradient(rgba(255, 245, 232, 0.42), rgba(244, 249, 255, 0.18) 45%, rgba(255, 248, 240, 0.28)); }
.scene-particles { opacity: 0.45; background-image: radial-gradient(circle at 18% 22%, rgba(255, 255, 255, 0.72) 0px, rgba(255, 255, 255, 0.72) 2px, transparent 3px), radial-gradient(circle at 76% 14%, rgba(255, 255, 255, 0.55) 0px, rgba(255, 255, 255, 0.55) 2px, transparent 3px), radial-gradient(circle at 82% 76%, rgba(255, 255, 255, 0.6) 0px, rgba(255, 255, 255, 0.6) 2px, transparent 3px), radial-gradient(circle at 40% 84%, rgba(255, 255, 255, 0.48) 0px, rgba(255, 255, 255, 0.48) 2px, transparent 3px), radial-gradient(circle at 12% 72%, rgba(126, 207, 186, 0.45) 0px, rgba(126, 207, 186, 0.45) 2px, transparent 3px); mix-blend-mode: screen; }
.app { position: fixed; inset: 12px; z-index: 1; display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 12px; min-width: 0px; min-height: 0px; border: 2px solid rgba(72, 95, 124, 0.88); border-radius: 28px; overflow: hidden; background: rgba(255, 255, 255, 0.18); box-shadow: 0 0 0 6px rgba(255, 255, 255, .28),
        14px 14px 0 rgba(140, 161, 187, .16),
        0 28px 60px var(--shadow); }
.topbar { display: grid; grid-template-columns: minmax(0px, 0.82fr) minmax(520px, 1.18fr); gap: 8px; padding: 8px; align-items: stretch; }
.title-copy { position: relative; min-width: 0px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; padding: 10px 14px; border: 2px solid var(--line); border-radius: 24px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(245, 249, 255, 0.9)); box-shadow: rgba(255, 255, 255, 0.68) 0px 0px 0px 4px inset, rgba(155, 173, 198, 0.12) 6px 6px 0px; overflow: hidden; }
body[data-active-view="leaderboard"] .topbar { grid-template-columns: minmax(0px, 0.72fr) minmax(430px, 1.28fr); gap: 6px; padding: 4px 8px; align-items: center; }
body[data-active-view="leaderboard"] .title-copy { flex-direction: row; align-items: center; justify-content: flex-start; gap: 10px; padding: 6px 10px; border-radius: 18px; }
body[data-active-view="leaderboard"] h1 { font-size: clamp(14px, 1.5vw, 20px); letter-spacing: 0.04em; text-shadow: rgba(255, 179, 142, 0.2) 2px 2px 0px, rgba(126, 207, 186, 0.14) -1px 1px 0px; }
body[data-active-view="leaderboard"] .view-switch { padding: 3px; }
body[data-active-view="leaderboard"] .view-tab { min-width: 84px; padding: 5px 8px; font-size: 10px; }
body[data-active-view="leaderboard"] .stats { gap: 6px; grid-template-columns: minmax(82px, 0.65fr) minmax(112px, 0.78fr) minmax(190px, 1.35fr); align-items: stretch; }
body[data-active-view="leaderboard"] .metric { display: grid; grid-template-columns: auto minmax(0px, 1fr); align-items: center; gap: 8px; min-height: 42px; padding: 7px 11px; border-radius: 14px; box-shadow: rgba(155, 173, 198, 0.1) 4px 4px 0px; }
body[data-active-view="leaderboard"] .metric .label { font-size: 8px; letter-spacing: 0.14em; }
body[data-active-view="leaderboard"] .metric .value { min-width: 0px; margin-top: 0px; font-size: 16px; display: inline-flex; align-items: center; justify-content: flex-end; gap: 6px; text-align: right; }
body[data-active-view="leaderboard"] #championName { white-space: nowrap; }
body[data-active-view="leaderboard"] #championName .display-name { min-width: 0px; overflow: hidden; text-overflow: ellipsis; }
body[data-active-view="leaderboard"] #championName .rank-title { flex: 0 0 auto; padding: 2px 6px; font-size: 9px; line-height: 1.2; }
.title-copy::before { content: ""; position: absolute; right: 14px; top: 50%; width: 96px; height: 96px; border-radius: 24px; pointer-events: none; opacity: 0.24; background: radial-gradient(circle at 35% 35%, rgba(255, 179, 142, 0.28), transparent 50%), radial-gradient(circle at 70% 50%, rgba(126, 207, 186, 0.24), transparent 48%), radial-gradient(circle at 50% 72%, rgba(199, 183, 255, 0.2), transparent 50%); translate: 0px -50%; }
.title-copy::after { content: ""; position: absolute; right: 14px; bottom: 10px; width: 10px; height: 10px; border-radius: 4px; background: var(--accent2); box-shadow: rgba(255, 179, 142, 0.78) -14px -8px 0px, rgba(199, 183, 255, 0.78) -28px 4px 0px, rgba(79, 167, 222, 0.62) 14px -4px 0px; }
h1 { position: relative; z-index: 1; margin: 0px; font-size: clamp(22px, 2.8vw, 34px); line-height: 1; letter-spacing: 0.06em; color: var(--text); text-shadow: rgba(255, 179, 142, 0.26) 3px 3px 0px, rgba(126, 207, 186, 0.18) -2px 2px 0px; }
.view-switch { position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 5px; padding: 4px; border: 2px solid rgba(87, 112, 154, 0.18); border-radius: 999px; background: rgba(255, 255, 255, 0.72); box-shadow: rgba(155, 173, 198, 0.1) 4px 4px 0px; }
.view-tab { min-width: 96px; border: 0px; border-radius: 999px; padding: 6px 10px; color: rgb(85, 112, 153); background: transparent; cursor: pointer; font-size: 11px; font-weight: 900; letter-spacing: 0.06em; white-space: nowrap; font-family: "Courier New", monospace; }
.view-tab:hover { transform: translateY(-1px); color: rgb(63, 123, 189); }
.view-tab.active, .view-tab[aria-selected="true"] { color: rgb(47, 95, 148); background: linear-gradient(135deg, rgba(126, 207, 186, 0.32), rgba(79, 167, 222, 0.18)); box-shadow: rgba(79, 167, 222, 0.1) 3px 3px 0px; }
.sr-status { position: absolute; width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; }
.stats { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; min-width: 0px; }
.metric { min-width: 0px; padding: 14px 14px 12px; border: 2px solid var(--line); border-radius: 18px; background: linear-gradient(rgba(255, 255, 255, 0.95), rgba(250, 252, 255, 0.92)); box-shadow: rgba(155, 173, 198, 0.14) 6px 6px 0px; }
.metric:hover { transform: translate(-1px, -1px); box-shadow: rgba(155, 173, 198, 0.18) 8px 8px 0px; }
.metric .label { color: var(--soft); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; font-weight: 900; }
.metric .value { margin-top: 6px; font-size: 24px; font-weight: 900; color: var(--accent); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.stage { min-height: 0px; display: grid; grid-template-columns: minmax(520px, 1.24fr) minmax(340px, 0.76fr); gap: 12px; padding: 0px 12px 12px; overflow: hidden; }
.view[hidden] { display: none; }
.models-stage { grid-template-columns: minmax(0px, 1fr); }
.console-stage { position: relative; grid-template-columns: minmax(0px, 1fr); grid-template-rows: minmax(0px, 1fr); }
.console-shell-panel { grid-area: 1 / 1; }
.console-shell-panel .panel-body { padding: 12px; }
.console-shell { min-width: 0px; min-height: 0px; height: 100%; display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 12px; }
.console-grid { min-height: 0px; display: grid; grid-template-columns: minmax(292px, 0.52fr) minmax(0px, 1.48fr); gap: 12px; overflow: hidden; }
.console-left-rail { min-width: 0px; min-height: 0px; display: grid; grid-template-rows: auto minmax(220px, 1fr); gap: 10px; }
.console-login-card .newapi-card-body { gap: 10px; padding: 13px; }
.console-login-card .newapi-metrics { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px; }
.console-workbench { min-height: 0px; }
.mini-leaderboard-panel { min-width: 0px; min-height: 0px; display: grid; grid-template-rows: auto minmax(0px, 1fr); border: 1px solid rgba(54, 83, 122, 0.13); border-radius: 22px; background: linear-gradient(rgba(255, 255, 255, 0.76), rgba(241, 248, 255, 0.7)), rgba(255, 255, 255, 0.72); box-shadow: rgba(255, 255, 255, 0.72) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.08) 0px 12px 26px; overflow: hidden; }
.mini-leaderboard-panel .panel-head { padding: 9px 11px; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgba(54, 83, 122, 0.1); border-image: initial; border-radius: 0px; background: linear-gradient(90deg, rgba(126, 207, 186, 0.14), rgba(79, 167, 222, 0.08)); font-size: 10px; letter-spacing: 0.12em; }
.mini-leaderboard-panel .panel-body { min-height: 0px; padding: 7px; display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 0px; overflow: hidden; }
.mini-leaderboard-panel .podium, .mini-leaderboard-panel .board-ticker { display: none; }
.mini-leaderboard-panel .rank-list-head { display: grid; grid-template-columns: 34px minmax(0px, 1fr) 86px; gap: 7px; padding: 0px 9px 5px; color: rgb(109, 127, 152); font-size: 9px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.mini-leaderboard-panel .rank-list-head span:last-child { text-align: right; }
.mini-leaderboard-panel .rows { min-height: 0px; gap: 5px; padding-right: 2px; overflow: hidden auto; scrollbar-gutter: stable; }
.mini-leaderboard-panel .row { min-height: 34px; grid-template-columns: 34px minmax(0px, 1fr) 86px; gap: 7px; padding: 5px 9px; border-width: 1px; border-radius: 12px; box-shadow: none; }
.mini-leaderboard-panel .row::after { display: none; }
.mini-leaderboard-panel .rank-badge { width: 24px; height: 24px; border-width: 1px; border-radius: 8px; font-size: 10px; }
.mini-leaderboard-panel .name { font-size: 11px; gap: 4px; min-width: 0px; }
.mini-leaderboard-panel .display-name { max-width: 100%; }
.mini-leaderboard-panel .rank-title { display: none; }
.mini-leaderboard-panel .meta { display: none; }
.mini-leaderboard-panel .pill { justify-self: end; width: 100%; min-width: 0px; padding: 4px 6px; border-width: 1px; border-radius: 10px; font-size: 10px; overflow: hidden; text-overflow: ellipsis; }
.console-detail-panel { display: none; }
.panel { min-width: 0px; min-height: 0px; display: flex; flex-direction: column; overflow: hidden; border: 2px solid var(--line); border-radius: 24px; background: linear-gradient(180deg, var(--panel), rgba(245, 249, 255, .95)); box-shadow: rgba(155, 173, 198, 0.12) 6px 6px 0px; }
.panel-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border-bottom: 2px solid var(--line2); color: rgb(85, 112, 153); font-size: 12px; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; background: linear-gradient(rgba(255, 255, 255, 0.95), rgba(246, 249, 255, 0.92)); }
.management-entry-trigger { appearance: none; border: 0px; padding: 0px; margin: 0px; background: transparent; color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; cursor: pointer; }
.management-entry-trigger:focus-visible { outline: rgba(79, 167, 222, 0.48) solid 2px; outline-offset: 4px; border-radius: 8px; }
.panel-head span:last-child { color: rgb(94, 116, 161); padding: 6px 11px; background: rgba(255, 227, 155, 0.28); border: 2px solid rgba(255, 227, 155, 0.45); border-radius: 999px; font-size: 11px; box-shadow: rgba(255, 227, 155, 0.18) 3px 3px 0px; }
body[data-active-view="leaderboard"] .console-shell-panel > .panel-head { padding: 7px 12px; font-size: 10px; letter-spacing: 0.08em; }
body[data-active-view="leaderboard"] .console-shell-panel > .panel-head span:last-child { padding: 4px 8px; font-size: 9px; border-width: 1px; }
.panel-body { flex: 1 1 0%; min-height: 0px; padding: 12px; overflow: hidden; }
.leaderboard-panel .panel-body { display: grid; grid-template-rows: auto auto auto auto minmax(0px, 1fr); gap: 10px; }
.podium { display: grid; grid-template-columns: 1.16fr 1fr 1fr; gap: 10px; }
.podium-card { position: relative; min-width: 0px; min-height: 108px; padding: 12px; border: 2px solid rgba(87, 112, 154, 0.2); border-radius: 18px; color: var(--text); background: linear-gradient(rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.91)); box-shadow: rgba(155, 173, 198, 0.1) 4px 4px 0px; cursor: pointer; overflow: hidden; text-align: left; display: grid; grid-template-rows: auto auto auto auto minmax(0px, 1fr); align-content: start; }
.podium-card::before { content: ""; position: absolute; right: -28px; bottom: -46px; width: 112px; height: 112px; border-radius: 30px; opacity: 0.28; background: radial-gradient(circle at 38% 36%, rgba(255, 179, 142, 0.8), transparent 42%), radial-gradient(circle at 64% 60%, rgba(126, 207, 186, 0.72), transparent 44%), radial-gradient(circle at 45% 72%, rgba(79, 167, 222, 0.58), transparent 44%); transform: rotate(12deg); }
.podium-card:hover, .podium-card.active { transform: translate(-1px, -1px); border-color: rgba(79, 167, 222, 0.38); box-shadow: rgba(79, 167, 222, 0.1) 6px 6px 0px; }
.podium-card.medal-1 { border-color: rgba(255, 179, 142, 0.52); background: linear-gradient(135deg, rgba(255, 232, 168, 0.58), rgba(255, 255, 255, 0.96)); }
.podium-card.medal-2 { background: linear-gradient(135deg, rgba(219, 232, 255, 0.58), rgba(255, 255, 255, 0.95)); }
.podium-card.medal-3 { background: linear-gradient(135deg, rgba(255, 215, 203, 0.52), rgba(255, 255, 255, 0.95)); }
.podium-card > * { position: relative; z-index: 1; }
.podium-medal { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 30px; border: 2px solid rgba(79, 167, 222, 0.24); border-radius: 12px; background: rgba(255, 255, 255, 0.78); color: rgb(71, 101, 143); font-size: 14px; font-weight: 900; box-shadow: rgba(155, 173, 198, 0.1) 3px 3px 0px; font-family: "Courier New", monospace; }
.podium-name { margin-top: 8px; color: var(--text); font-size: 14px; font-weight: 900; display: flex; align-items: center; gap: 8px; min-width: 0px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.podium-score { margin-top: 4px; color: rgb(63, 123, 189); font-size: 13px; font-weight: 900; white-space: nowrap; font-family: "Courier New", monospace; }
.podium-meta { margin-top: 3px; color: var(--muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.board-ticker { min-height: 34px; display: flex; align-items: center; gap: 8px; padding: 8px 12px; border: 2px solid rgba(126, 207, 186, 0.28); border-radius: 15px; color: rgb(79, 111, 149); background: linear-gradient(90deg, rgba(241, 251, 247, 0.96), rgba(255, 255, 255, 0.91)); box-shadow: rgba(126, 207, 186, 0.08) 4px 4px 0px; font-size: 11px; font-weight: 900; letter-spacing: 0.04em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.rank-list-head { display: grid; grid-template-columns: 48px minmax(0px, 1fr) 132px; gap: 14px; align-items: center; padding: 0px 16px 0px 4px; color: var(--soft); font-size: 10px; font-weight: 900; letter-spacing: 0.16em; text-transform: uppercase; font-family: "Courier New", monospace; }
.rank-list-head span:last-child { text-align: right; }
.board-ticker::before { content: "LIVE"; flex: 0 0 auto; padding: 3px 7px; border-radius: 999px; color: rgb(38, 127, 90); background: rgba(126, 207, 186, 0.24); border: 2px solid rgba(126, 207, 186, 0.28); }
.models-panel .panel-body { overflow: auto; }
.model-hero { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 12px; align-items: center; margin-bottom: 12px; padding: 14px; border: 2px solid rgba(126, 207, 186, 0.28); border-radius: 18px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(241, 251, 247, 0.94)); box-shadow: rgba(126, 207, 186, 0.1) 5px 5px 0px; }
.model-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; align-content: start; }
.model-provider-switch { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 12px; padding: 6px; border: 2px solid rgba(87, 112, 154, 0.18); border-radius: 999px; background: rgba(255, 255, 255, 0.72); box-shadow: rgba(155, 173, 198, 0.1) 4px 4px 0px; }
.model-provider-tab { min-width: 96px; border: 0px; border-radius: 999px; padding: 8px 13px; color: rgb(85, 112, 153); background: transparent; cursor: pointer; font-size: 12px; font-weight: 900; letter-spacing: 0.08em; white-space: nowrap; font-family: "Courier New", monospace; }
.model-provider-tab:hover { transform: translateY(-1px); color: rgb(63, 123, 189); }
.model-provider-tab.active, .model-provider-tab[aria-selected="true"] { color: rgb(47, 95, 148); background: linear-gradient(135deg, rgba(126, 207, 186, 0.32), rgba(79, 167, 222, 0.18)); box-shadow: rgba(79, 167, 222, 0.1) 3px 3px 0px; }
.model-card { position: relative; min-width: 0px; padding: 14px; border: 2px solid rgba(87, 112, 154, 0.2); border-radius: 20px; background: linear-gradient(rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.92)); box-shadow: rgba(155, 173, 198, 0.1) 4px 4px 0px; overflow: hidden; }
.model-card.maintenance { border-color: rgba(225, 107, 107, 0.2); background: linear-gradient(rgba(255, 255, 255, 0.92), rgba(255, 247, 247, 0.88)); }
.model-card::before { content: ""; position: absolute; inset: auto -28px -42px auto; width: 116px; height: 116px; border-radius: 32px; opacity: 0.2; background: radial-gradient(circle at 35% 36%, var(--model-accent, rgba(79, 167, 222, .8)), transparent 44%),
        radial-gradient(circle at 68% 58%, rgba(126, 207, 186, .74), transparent 46%); transform: rotate(14deg); }
.model-card > * { position: relative; z-index: 1; }
.model-card-head { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto; gap: 10px; align-items: flex-start; }
.model-expand-toggle { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-top: -2px; border: 2px solid rgba(79, 167, 222, 0.22); border-radius: 11px; background: linear-gradient(135deg, rgba(126, 207, 186, 0.26), rgba(255, 255, 255, 0.78)); color: rgb(47, 95, 148); cursor: pointer; box-shadow: rgba(155, 173, 198, 0.11) 3px 3px 0px; }
.model-expand-toggle:hover { transform: translateY(-1px); border-color: rgba(79, 167, 222, 0.38); background: linear-gradient(135deg, rgba(126, 207, 186, 0.36), rgba(255, 255, 255, 0.9)); }
.model-expand-toggle::before, .model-expand-toggle::after { content: ""; position: absolute; width: 11px; height: 2px; border-radius: 999px; background: currentcolor; }
.model-expand-toggle::after { transform: rotate(90deg); }
.model-card.expanded .model-expand-toggle::after { transform: rotate(0deg); }
.model-name { min-width: 0px; color: var(--text); font-size: 17px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.model-price-line { margin-top: 4px; color: rgb(91, 120, 152); font-size: 9px; font-weight: 900; line-height: 1.45; letter-spacing: 0.03em; font-family: "Courier New", monospace; }
.model-badge { flex: 0 0 auto; padding: 5px 9px; border-radius: 999px; color: rgb(47, 111, 125); background: rgba(126, 207, 186, 0.22); border: 2px solid rgba(126, 207, 186, 0.28); font-size: 10px; font-weight: 900; letter-spacing: 0.08em; font-family: "Courier New", monospace; }
.model-desc { margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.55; min-height: 38px; }
.model-billing-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 6px; margin-top: 10px; }
.model-billing-details { max-height: 0px; opacity: 0; overflow: hidden; transform: translateY(-4px); }
.model-card.expanded .model-billing-details { max-height: 240px; opacity: 1; transform: translateY(0px); }
.model-billing-chip { min-width: 0px; padding: 7px 8px; border: 1px solid rgba(54, 83, 122, 0.11); border-radius: 13px; background: linear-gradient(135deg, rgba(126, 207, 186, 0.16), transparent 64%), rgba(255, 255, 255, 0.72); box-shadow: rgba(255, 255, 255, 0.62) 0px 0px 0px 1px inset; }
.model-billing-chip span { display: block; color: rgb(102, 122, 150); font-size: 8px; font-weight: 900; letter-spacing: 0.09em; text-transform: uppercase; }
.model-billing-chip strong { display: block; margin-top: 3px; color: rgb(23, 61, 103); font-size: 11px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.model-billing-note, .model-breakdown-pricing, .own-model-table-pricing { min-width: 0px; color: rgb(107, 127, 154); font-weight: 900; font-family: "Courier New", monospace; }
.model-billing-note { margin-top: 7px; font-size: 9px; line-height: 1.45; }
.tag-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.model-tag { padding: 5px 8px; border-radius: 999px; color: rgb(82, 115, 156); background: rgba(79, 167, 222, 0.1); border: 2px solid rgba(79, 167, 222, 0.14); font-size: 10px; font-weight: 900; font-family: "Courier New", monospace; }
.model-stats { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 7px; margin-top: 12px; }
.model-stat { min-width: 0px; padding: 8px; border: 2px solid var(--line2); border-radius: 13px; background: rgba(255, 255, 255, 0.64); }
.model-stat span { display: block; color: var(--soft); font-size: 9px; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; }
.model-stat strong { display: block; margin-top: 4px; color: rgb(63, 123, 189); font-size: 12px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.mini-list { display: grid; gap: 8px; }
.mini-card { padding: 12px; border: 2px solid var(--line); border-radius: 16px; background: linear-gradient(rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.92)); box-shadow: rgba(155, 173, 198, 0.08) 4px 4px 0px; }
.mini-card strong { display: block; color: rgb(63, 127, 178); font-size: 13px; font-weight: 900; margin-bottom: 5px; font-family: "Courier New", monospace; }
.rows { display: grid; gap: 8px; min-height: 0px; align-content: start; overflow: auto; padding-right: 4px; scrollbar-width: thin; }
.row { position: relative; width: 100%; min-width: 0px; border: 2px solid var(--line); border-radius: 20px; padding: 13px 14px; color: var(--text); background: linear-gradient(rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.92)); cursor: pointer; text-align: left; display: grid; grid-template-columns: 48px minmax(0px, 1fr) 132px; gap: 14px; align-items: center; box-shadow: rgba(155, 173, 198, 0.1) 4px 4px 0px; min-height: 70px; overflow: hidden; }
.row::before { content: ""; position: absolute; left: 0px; bottom: 0px; width: var(--token-share, 0%); height: 5px; border-radius: 0px 999px 999px 0px; background: linear-gradient(90deg, var(--accent), var(--accent2), var(--accent3)); opacity: 0.82; }
.row::after { content: "👑"; position: absolute; top: 6px; right: 10px; font-size: 26px; opacity: 0; transform: rotate(10deg); }
.row.top::after { opacity: 0.16; }
.row > * { position: relative; z-index: 1; }
.row:hover { transform: translate(-1px, -1px); border-color: rgba(79, 167, 222, 0.28); box-shadow: rgba(155, 173, 198, 0.12) 6px 6px 0px; }
.row.active { border-color: rgba(79, 167, 222, 0.46); background: linear-gradient(90deg, rgba(79, 167, 222, 0.12), rgba(255, 255, 255, 0.97)); box-shadow: rgba(79, 167, 222, 0.12) 6px 6px 0px; }
.row.top { border-color: rgba(255, 179, 142, 0.55); background: linear-gradient(90deg, rgba(255, 227, 155, 0.28), rgba(255, 255, 255, 0.96)); }
.rank-badge { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; justify-self: center; border-radius: 14px; background: linear-gradient(rgba(110, 191, 255, 0.22), rgba(110, 191, 255, 0.08)); border: 2px solid rgba(79, 167, 222, 0.28); font-weight: 900; font-size: 16px; color: rgb(71, 101, 143); box-shadow: rgba(79, 167, 222, 0.08) 3px 3px 0px; font-family: "Courier New", monospace; }
.row.top .rank-badge { background: linear-gradient(rgb(255, 232, 168), rgb(255, 217, 143)); border-color: rgba(255, 179, 142, 0.56); color: rgb(111, 79, 20); }
.row:nth-child(2) .rank-badge { background: linear-gradient(rgb(238, 244, 255), rgb(219, 232, 255)); border-color: rgba(141, 168, 219, 0.32); }
.row:nth-child(3) .rank-badge { background: linear-gradient(rgb(255, 233, 228), rgb(255, 215, 203)); border-color: rgba(255, 179, 142, 0.36); }
.name { min-width: 0px; font-size: 16px; font-weight: 900; display: flex; align-items: center; gap: 8px; overflow: hidden; white-space: nowrap; letter-spacing: 0.02em; font-family: "Courier New", monospace; }
.display-name { display: block; min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font: inherit; }
.display-name.vip-user { position: relative; display: inline-block; color: transparent; -webkit-text-fill-color: transparent; letter-spacing: 0.02em; background-image: linear-gradient(rgba(255, 255, 255, 0.92) 0%, rgba(255, 255, 255, 0.58) 16%, rgba(255, 255, 255, 0.22) 28%, rgba(255, 255, 255, 0) 42%), linear-gradient(90deg, rgb(13, 92, 255) 0%, rgb(45, 125, 255) 16%, rgb(109, 57, 255) 34%, rgb(194, 47, 255) 52%, rgb(255, 49, 183) 66%, rgb(255, 124, 48) 82%, rgb(255, 228, 90) 100%); background-size: 100% 100%, 100% 100%; background-position: 50% 0%, 50% 50%; background-repeat: no-repeat; background-clip: text; filter: saturate(1.08) brightness(1.04); }
.display-name.vip-user::after { content: attr(data-text); position: absolute; inset: 0px; font: inherit; white-space: inherit; pointer-events: none; color: transparent; -webkit-text-fill-color: transparent; background-image: repeating-linear-gradient(90deg, rgb(13, 92, 255) 0px, rgb(33, 183, 255) 24px, rgb(109, 57, 255) 48px, rgb(194, 47, 255) 72px, rgb(255, 49, 183) 96px, rgb(255, 92, 77) 120px, rgb(255, 154, 31) 144px, rgb(255, 228, 90) 168px, rgb(255, 154, 31) 192px, rgb(255, 92, 77) 216px, rgb(255, 49, 183) 240px, rgb(109, 57, 255) 264px, rgb(33, 183, 255) 288px, rgb(13, 92, 255) 312px); background-position: 0px 50%; background-repeat: repeat; background-clip: text; opacity: 0.72; filter: saturate(1.18) brightness(1.08); }
.rank-title { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-width: 0px; padding: 4px 9px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.72); font-size: 9px; font-weight: 900; letter-spacing: 0.16em; white-space: nowrap; text-transform: uppercase; box-shadow: rgba(255, 255, 255, 0.4) 0px 0px 0px 1px, rgba(79, 167, 222, 0.14) 0px 8px 18px; text-shadow: rgba(255, 255, 255, 0.45) 0px 1px 0px; transform: translateY(-1px); }
.rank-title::before { content: "✦"; margin-right: 4px; font-size: 8px; }
.rank-title.gold { color: rgb(90, 54, 0); background: linear-gradient(135deg, rgba(255, 246, 194, 0.98), rgba(255, 208, 91, 0.96) 48%, rgba(255, 157, 26, 0.94)); box-shadow: rgba(255, 208, 91, 0.46) 0px 0px 0px 1px, rgba(255, 181, 54, 0.34) 0px 0px 18px, rgba(255, 181, 54, 0.16) 0px 10px 22px; }
.rank-title.silver { color: rgb(52, 67, 95); background: linear-gradient(135deg, rgba(243, 249, 255, 0.98), rgba(214, 228, 255, 0.96) 50%, rgba(163, 191, 240, 0.94)); box-shadow: rgba(163, 191, 240, 0.42) 0px 0px 0px 1px, rgba(131, 162, 223, 0.28) 0px 0px 18px, rgba(131, 162, 223, 0.12) 0px 10px 22px; }
.rank-title.bronze { color: rgb(93, 47, 20); background: linear-gradient(135deg, rgba(255, 241, 233, 0.98), rgba(255, 206, 184, 0.96) 48%, rgba(231, 158, 115, 0.94)); box-shadow: rgba(231, 158, 115, 0.42) 0px 0px 0px 1px, rgba(231, 158, 115, 0.26) 0px 0px 18px, rgba(231, 158, 115, 0.12) 0px 10px 22px; }
.meta { margin-top: 5px; color: var(--muted); font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.pill { color: rgb(63, 123, 189); font-size: 13px; font-weight: 900; border-radius: 999px; background: rgba(79, 167, 222, 0.12); border: 2px solid rgba(79, 167, 222, 0.2); padding: 6px 11px; white-space: nowrap; box-shadow: rgba(79, 167, 222, 0.08) 3px 3px 0px; font-family: "Courier New", monospace; text-align: center; }
.rank-change { margin-left: 6px; font-weight: 900; }
.rank-change.up { color: var(--good); }
.rank-change.down { color: var(--bad); }
.summary { padding: 14px; border: 2px solid rgba(126, 207, 186, 0.28); border-radius: 18px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.98), rgba(241, 251, 247, 0.94)); margin-bottom: 12px; box-shadow: rgba(126, 207, 186, 0.12) 5px 5px 0px; }
.summary-title { font-size: 18px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: rgb(63, 127, 178); margin-bottom: 6px; text-shadow: rgba(255, 255, 255, 0.9) 2px 2px 0px; font-family: "Courier New", monospace; }
.section-title { margin: 10px 0px 8px; color: rgb(82, 115, 156); font-size: 12px; font-weight: 900; letter-spacing: 0.16em; text-transform: uppercase; display: flex; align-items: center; gap: 8px; font-family: "Courier New", monospace; }
.section-title::after { content: ""; flex: 1 1 0%; height: 2px; background: linear-gradient(90deg, var(--line2), transparent); border-radius: 999px; }
.detail { display: grid; gap: 7px; }
.detail-row { min-width: 0px; padding: 10px 12px; border: 2px solid var(--line); border-radius: 14px; background: linear-gradient(rgba(255, 255, 255, 0.96), rgba(247, 250, 255, 0.92)); display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 12px; align-items: center; box-shadow: rgba(155, 173, 198, 0.08) 4px 4px 0px; }
.detail-row:hover { transform: translate(-1px, -1px); box-shadow: rgba(155, 173, 198, 0.1) 6px 6px 0px; }
.detail-row strong { display: block; color: var(--text); font-size: 13px; font-weight: 900; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.detail-panel .panel-body { overflow: hidden auto; scrollbar-width: thin; }
.detail-collapsible { margin-top: 2px; border: 2px solid rgba(126, 207, 186, 0.28); border-radius: 16px; background: linear-gradient(rgba(255, 255, 255, 0.98), rgba(241, 251, 247, 0.94)); box-shadow: rgba(126, 207, 186, 0.12) 4px 4px 0px; overflow: hidden; }
.detail-collapsible > summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; cursor: pointer; user-select: none; color: rgb(63, 127, 178); font-size: 12px; font-weight: 900; letter-spacing: 0.16em; text-transform: uppercase; font-family: "Courier New", monospace; }
.detail-collapsible > summary::-webkit-details-marker { display: none; }
.detail-collapsible[open] > summary { border-bottom: 2px solid rgba(126, 207, 186, 0.18); background: linear-gradient(rgba(255, 255, 255, 0.98), rgba(239, 250, 245, 0.94)); }
.detail-collapsible .collapse-left, .detail-collapsible .collapse-right { min-width: 0px; display: flex; align-items: center; gap: 8px; }
.detail-collapsible .collapse-left { flex: 1 1 0%; }
.detail-collapsible .collapse-title { min-width: 0px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.detail-collapsible .collapse-count { color: rgb(94, 116, 161); font-size: 11px; font-weight: 900; padding: 5px 9px; border-radius: 999px; background: rgba(79, 167, 222, 0.12); border: 2px solid rgba(79, 167, 222, 0.2); box-shadow: rgba(79, 167, 222, 0.08) 3px 3px 0px; font-family: "Courier New", monospace; white-space: nowrap; }
.detail-collapsible .collapse-chevron { color: rgb(94, 116, 161); font-size: 14px; line-height: 1; }
.detail-collapsible[open] .collapse-chevron { transform: rotate(180deg); }
.detail-collapsible-body { padding: 0px 12px 12px; }
.detail-collapsible-body .detail { margin-top: 0px; }
.empty { display: flex; align-items: center; justify-content: center; color: var(--muted); font-size: 13px; padding: 32px 0px; text-align: center; background: linear-gradient(rgba(255, 255, 255, 0.88), rgba(245, 249, 255, 0.9)); border: 2px dashed var(--line2); border-radius: 16px; font-family: "Courier New", monospace; }
.bad { color: var(--bad); }
.good { color: var(--good); }
.newapi-stage { grid-template-columns: minmax(0px, 1fr); }
.newapi-panel { min-height: 0px; background: radial-gradient(circle at 12% 8%, rgba(79, 167, 222, 0.18), transparent 28%), radial-gradient(circle at 88% 14%, rgba(126, 207, 186, 0.18), transparent 30%), linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(243, 249, 255, 0.9)); border-color: rgba(54, 83, 122, 0.26); box-shadow: rgba(255, 255, 255, 0.54) 0px 0px 0px 4px inset, rgba(71, 101, 142, 0.18) 0px 24px 58px; }
.newapi-panel .panel-body { display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 14px; overflow: hidden; }
.newapi-hero { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 14px; align-items: center; padding: 18px; border: 1px solid rgba(54, 83, 122, 0.14); border-radius: 22px; background: linear-gradient(90deg, rgba(79, 167, 222, 0.13), transparent 52%), rgba(255, 255, 255, 0.82); box-shadow: rgba(71, 101, 142, 0.09) 0px 16px 34px; }
.newapi-title { margin: 0px; color: rgb(23, 36, 58); font-size: clamp(24px, 2.5vw, 34px); line-height: 1.1; letter-spacing: 0.02em; }
.newapi-subtitle { margin-top: 8px; color: rgb(75, 96, 125); font-size: 13px; line-height: 1.65; font-weight: 800; }
.newapi-status-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 132px; min-height: 42px; padding: 9px 14px; border: 1px solid rgba(54, 83, 122, 0.16); border-radius: 999px; background: rgba(255, 255, 255, 0.86); color: rgb(66, 88, 120); font-size: 12px; font-weight: 900; box-shadow: rgba(255, 255, 255, 0.78) 0px 0px 0px 1px inset; }
.newapi-status-pill.good { border-color: rgba(46, 168, 107, 0.28); background: rgba(237, 255, 247, 0.9); color: rgb(31, 122, 77); }
.newapi-status-pill.bad { border-color: rgba(225, 107, 107, 0.3); background: rgba(255, 244, 244, 0.9); color: rgb(158, 56, 56); }
.newapi-grid { min-height: 0px; display: grid; grid-template-columns: minmax(320px, 0.72fr) minmax(0px, 1.28fr); gap: 14px; overflow: hidden; }
.newapi-grid.console-grid { grid-template-columns: minmax(292px, 0.52fr) minmax(0px, 1.48fr); gap: 12px; }
.newapi-card { min-width: 0px; min-height: 0px; border: 1px solid rgba(54, 83, 122, 0.15); border-radius: 22px; background: rgba(255, 255, 255, 0.86); box-shadow: rgba(255, 255, 255, 0.72) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.09) 0px 14px 30px; overflow: hidden; }
.newapi-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 15px 16px; border-bottom: 1px solid rgba(54, 83, 122, 0.12); background: linear-gradient(90deg, rgba(126, 207, 186, 0.12), transparent 58%), rgba(255, 255, 255, 0.82); }
.newapi-card-title { color: rgb(23, 36, 58); font-size: 14px; font-weight: 900; letter-spacing: 0.04em; }
.newapi-card-desc { margin-top: 5px; color: rgb(90, 110, 137); font-size: 11px; line-height: 1.5; font-weight: 800; }
.newapi-account-title-row { min-width: 0px; display: flex; align-items: center; justify-content: flex-start; gap: 8px; width: 100%; max-width: 100%; min-height: 40px; overflow: hidden; }
.newapi-account-title-row .newapi-card-title { display: inline-flex; align-items: center; flex: 0 1 auto; min-width: 0px; max-width: min(46vw, 360px); min-height: 36px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 18px; line-height: 1; letter-spacing: 0.02em; }
.display-name-edit-button { width: 28px; height: 28px; display: inline-grid; place-items: center; flex: 0 0 auto; border: 1px solid rgba(54, 83, 122, 0.15); border-radius: 999px; background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.95), transparent 45%), linear-gradient(135deg, rgba(126, 207, 186, 0.2), rgba(79, 167, 222, 0.14)); color: rgb(23, 61, 103); box-shadow: rgba(31, 61, 99, 0.1) 0px 10px 22px; cursor: pointer; font-size: 13px; font-weight: 900; line-height: 1; }
.display-name-edit-button:hover { transform: translateY(-1px); border-color: rgba(79, 167, 222, 0.32); box-shadow: rgba(31, 61, 99, 0.14) 0px 14px 28px; }
.display-name-edit-button:disabled { cursor: not-allowed; opacity: 0.55; transform: none; }
.display-name-inline-editor { display: inline-flex; gap: 7px; align-items: center; flex: 1 1 0px; width: auto; min-width: 0px; max-width: min(100%, 520px); }
.display-name-inline-editor[hidden] { display: none; }
.display-name-inline-editor .newapi-input { flex: 1 1 auto; min-width: 0px; height: 36px; border-radius: 12px; font-size: 15px; font-weight: 900; }
.display-name-inline-editor .newapi-button { min-height: 36px; padding-inline: 11px; white-space: nowrap; }
.display-name-policy-note { color: rgb(99, 119, 146); font-size: 10px; font-weight: 800; line-height: 1.45; }
.display-name-policy-note.cooldown { color: rgb(164, 97, 35); }
.admin-display-name-form .display-name-policy-note { grid-column: 1 / -1; }
.admin-account-merge-form { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 7px; align-items: center; }
.admin-account-merge-form .newapi-select { height: 36px; border-radius: 12px; font-size: 11px; }
.newapi-card-body { display: grid; gap: 12px; padding: 16px; min-height: 0px; }
.newapi-utility-strip { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px; }
.newapi-utility { min-width: 0px; padding: 9px; border: 1px solid rgba(54, 83, 122, 0.11); border-radius: 14px; background: linear-gradient(135deg, rgba(126, 207, 186, 0.1), transparent 62%), rgba(248, 251, 255, 0.78); }
.newapi-utility span { display: block; color: rgb(102, 120, 145); font-size: 9px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.newapi-utility strong { display: block; margin-top: 5px; color: rgb(23, 36, 58); font-size: 12px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.newapi-form { display: grid; gap: 12px; }
.newapi-field { display: grid; gap: 7px; }
.newapi-field label { color: rgb(64, 86, 116); font-size: 11px; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase; }
.newapi-input, .newapi-select, .newapi-textarea { width: 100%; min-width: 0px; border: 1px solid rgba(54, 83, 122, 0.18); border-radius: 15px; background: rgba(248, 251, 255, 0.94); color: rgb(23, 36, 58); font-size: 13px; font-weight: 800; outline: none; box-shadow: rgba(255, 255, 255, 0.76) 0px 0px 0px 1px inset; }
.newapi-input, .newapi-select { height: 42px; padding: 0px 13px; }
.newapi-textarea { min-height: 128px; padding: 12px 13px; resize: vertical; line-height: 1.6; }
.newapi-input:focus, .newapi-select:focus, .newapi-textarea:focus { border-color: rgba(79, 167, 222, 0.42); box-shadow: rgba(255, 255, 255, 0.82) 0px 0px 0px 1px inset, rgba(79, 167, 222, 0.12) 0px 0px 0px 4px; }
.newapi-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.newapi-actions.compact { gap: 7px; }
.display-name-console { display: grid; grid-template-columns: minmax(0px, 0.8fr) minmax(260px, 1.2fr); gap: 10px; align-items: center; padding: 10px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 17px; background: radial-gradient(circle at 8% 0%, rgba(79, 167, 222, 0.14), transparent 34%), linear-gradient(135deg, rgba(255, 255, 255, 0.72), rgba(239, 249, 255, 0.58)); }
.display-name-copy { min-width: 0px; display: grid; gap: 4px; }
.display-name-copy span { color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.display-name-copy strong { min-width: 0px; color: rgb(23, 61, 103); font-size: 15px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.display-name-controls, .admin-display-name-form { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 7px; align-items: center; }
.admin-account-tools { display: grid; gap: 7px; }
.admin-display-name-form .newapi-input { min-height: 36px; padding: 8px 10px; border-radius: 12px; font-size: 12px; }
.newapi-button { min-height: 40px; border: 1px solid rgba(54, 83, 122, 0.16); border-radius: 14px; padding: 9px 14px; background: rgba(255, 255, 255, 0.84); color: rgb(44, 64, 94); cursor: pointer; font-size: 12px; font-weight: 900; box-shadow: rgba(71, 101, 142, 0.08) 0px 9px 18px; }
.newapi-button:hover { transform: translateY(-1px); border-color: rgba(79, 167, 222, 0.3); box-shadow: rgba(71, 101, 142, 0.12) 0px 12px 22px; }
.newapi-button.primary { border-color: rgba(79, 167, 222, 0.3); background: linear-gradient(rgb(90, 179, 233), rgb(62, 149, 210)); color: rgb(255, 255, 255); }
.newapi-button.danger { border-color: rgba(225, 107, 107, 0.26); background: linear-gradient(rgb(255, 245, 245), rgb(255, 226, 226)); color: rgb(158, 56, 56); }
.newapi-button:disabled { cursor: not-allowed; opacity: 0.56; transform: none; }
.newapi-button.slim { min-height: 34px; padding: 7px 10px; border-radius: 12px; font-size: 11px; }
.newapi-metrics { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 10px; }
.newapi-metric { min-width: 0px; padding: 12px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 16px; background: rgba(248, 251, 255, 0.86); }
.newapi-metric span { display: block; color: rgb(102, 120, 145); font-size: 10px; font-weight: 900; letter-spacing: 0.05em; text-transform: uppercase; }
.newapi-metric strong { display: block; margin-top: 7px; color: rgb(23, 36, 58); font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.newapi-metric em { display: -webkit-box; margin-top: 7px; overflow: hidden; color: rgb(99, 119, 146); font-size: 10px; font-style: normal; font-weight: 850; line-height: 1.45; letter-spacing: 0px; text-transform: none; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.dashboard-usage-metrics .newapi-metric { padding: 9px 10px; background: radial-gradient(circle at 88% 0%, rgba(126, 207, 186, 0.16), transparent 36%), rgba(248, 251, 255, 0.9); }
.dashboard-usage-metrics .newapi-metric strong { margin-top: 5px; font-size: clamp(15px, 1.55vw, 20px); font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.dashboard-usage-metrics .newapi-metric em { min-height: 13px; margin-top: 4px; font-size: 9px; line-height: 1.3; -webkit-line-clamp: 1; }
.dashboard-state-metrics .newapi-metric { padding: 8px 10px; }
.dashboard-state-metrics .newapi-metric strong { margin-top: 4px; font-size: 13px; }
.newapi-workbench { min-height: 0px; display: grid; grid-template-columns: minmax(0px, 1fr) minmax(300px, 0.68fr); gap: 14px; }
.newapi-scroll { min-height: 0px; overflow: auto; }
.newapi-model-list { display: grid; gap: 8px; max-height: 430px; overflow: auto; padding-right: 4px; }
.newapi-model-tools { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 8px; align-items: center; }
.newapi-model-summary { color: rgb(90, 110, 137); font-size: 11px; font-weight: 900; white-space: nowrap; }
.newapi-model-row { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto; align-items: flex-start; gap: 10px; padding: 11px 12px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 15px; background: rgba(248, 251, 255, 0.82); }
.newapi-model-row .model-expand-toggle { width: 26px; height: 26px; margin-top: 0px; border-width: 1px; border-radius: 10px; box-shadow: rgba(155, 173, 198, 0.1) 2px 2px 0px; }
.newapi-model-row.expanded .model-expand-toggle::after { transform: rotate(0deg); }
.newapi-model-main { min-width: 0px; }
.newapi-model-name { min-width: 0px; color: rgb(23, 36, 58); font-size: 13px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.newapi-model-price-line { margin-top: 4px; color: rgb(101, 126, 157); font-size: 9px; font-weight: 900; line-height: 1.45; letter-spacing: 0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.newapi-model-provider-line { margin-top: 4px; color: rgb(64, 90, 120); font-size: 10px; font-weight: 950; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.newapi-model-tag { flex: 0 0 auto; margin-top: 1px; padding: 4px 8px; border-radius: 999px; background: rgba(79, 167, 222, 0.12); color: rgb(46, 75, 115); font-size: 10px; font-weight: 900; }
.newapi-model-row .model-billing-details { grid-column: 1 / -1; width: 100%; margin-top: -2px; }
.newapi-model-row.expanded .model-billing-details { max-height: 230px; opacity: 1; transform: translateY(0px); }
.newapi-model-row .model-billing-grid { margin-top: 2px; gap: 5px; }
.newapi-model-row .model-billing-chip { padding: 6px 7px; border-radius: 12px; }
.newapi-model-row .model-billing-note { margin-top: 6px; font-size: 8px; }
.newapi-model-row.clickable { cursor: pointer; }
.newapi-model-row.clickable:hover { transform: translateY(-1px); border-color: rgba(79, 167, 222, 0.3); background: rgba(239, 248, 255, 0.9); }
.newapi-result { min-height: 210px; max-height: 360px; overflow: auto; margin: 0px; padding: 13px; border: 1px solid rgba(54, 83, 122, 0.14); border-radius: 16px; background: rgb(22, 32, 51); color: rgb(236, 246, 255); font-size: 12px; line-height: 1.62; white-space: pre-wrap; word-break: break-word; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.newapi-usage-result { max-height: 260px; min-height: 168px; overflow: auto; margin: 0px; padding: 16px 17px; border: 1px solid rgba(79, 167, 222, 0.18); border-radius: 18px; background: radial-gradient(circle at 100% 0%, rgba(79, 167, 222, 0.16), transparent 30%), linear-gradient(135deg, rgb(18, 29, 47), rgb(27, 43, 68) 68%, rgb(24, 52, 74)); color: rgb(234, 246, 255); font-size: 11px; line-height: 1.72; white-space: pre-wrap; word-break: break-word; box-shadow: rgba(255, 255, 255, 0.08) 0px 1px 0px inset, rgba(18, 29, 47, 0.12) 0px 14px 30px; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.newapi-panel.console-shell-panel .panel-body { display: block; padding: 12px; overflow: hidden; }
.console-gate { min-height: 100%; display: grid; place-items: center; padding: clamp(18px, 4vw, 48px); }
.console-gate[hidden], .console-shell[hidden] { display: none; }
.console-gate-card { width: min(720px, 100%); position: relative; overflow: hidden; background: radial-gradient(circle at 14% 0%, rgba(126, 207, 186, 0.24), transparent 30%), radial-gradient(circle at 86% 18%, rgba(79, 167, 222, 0.22), transparent 34%), linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(239, 248, 255, 0.82)); }
.console-gate-card::before { content: ""; position: absolute; inset: -40% auto auto -8%; width: 280px; height: 280px; border-radius: 999px; border: 1px solid rgba(79, 167, 222, 0.18); box-shadow: rgba(126, 207, 186, 0.08) 0px 0px 0px 18px; pointer-events: none; }
.console-gate-copy { position: relative; display: grid; gap: 8px; }
.console-gate-kicker { color: rgb(50, 105, 149); font-size: 11px; font-weight: 900; letter-spacing: 0.18em; text-transform: uppercase; font-family: "Courier New", monospace; }
.console-gate-copy h2 { margin: 0px; color: rgb(20, 36, 58); font-size: clamp(24px, 3vw, 38px); line-height: 1.08; letter-spacing: 0.02em; }
.console-gate-copy p { margin: 0px; max-width: 560px; color: rgb(82, 105, 133); font-size: 13px; line-height: 1.7; font-weight: 800; }
.console-gate-form { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 10px; align-items: end; }
.console-gate-status { min-height: 18px; color: rgb(90, 110, 137); font-size: 11px; font-weight: 900; }
.console-shell { min-width: 0px; min-height: 0px; height: 100%; display: grid; grid-template-columns: 216px minmax(0px, 1fr); grid-template-rows: minmax(0px, 1fr); gap: 12px; }
.console-sidebar { min-width: 0px; min-height: 0px; display: grid; grid-template-rows: auto minmax(0px, 1fr) auto; gap: 12px; padding: 13px; border: 1px solid rgba(54, 83, 122, 0.14); border-radius: 24px; background: radial-gradient(circle at 24% 0%, rgba(79, 167, 222, 0.18), transparent 34%), linear-gradient(rgba(255, 255, 255, 0.84), rgba(241, 248, 255, 0.72)); box-shadow: rgba(255, 255, 255, 0.72) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.08) 0px 14px 30px; }
.console-brand { padding: 11px 10px 13px; border-bottom: 1px solid rgba(54, 83, 122, 0.12); }
.console-brand strong { display: block; color: rgb(23, 36, 58); font-size: 16px; font-weight: 900; letter-spacing: 0.08em; font-family: "Courier New", monospace; }
.console-brand span { display: block; margin-top: 6px; color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; }
.console-nav-list { display: grid; align-content: start; gap: 7px; min-height: 0px; overflow: hidden auto; padding-right: 4px; scrollbar-gutter: stable; }
.console-nav { width: 100%; min-width: 0px; border: 1px solid transparent; border-radius: 15px; padding: 10px 11px; color: rgb(66, 88, 120); background: transparent; cursor: pointer; display: grid; grid-template-columns: 24px minmax(0px, 1fr); align-items: center; gap: 8px; text-align: left; font-size: 12px; font-weight: 900; }
[data-admin-only][hidden], [data-admin-only].is-admin-hidden { display: none; }
.console-nav:hover { transform: none; color: rgb(46, 95, 145); background: rgba(255, 255, 255, 0.62); border-color: rgba(79, 167, 222, 0.16); }
.console-nav.active, .console-nav[aria-selected="true"] { color: rgb(23, 61, 103); background: linear-gradient(135deg, rgba(79, 167, 222, 0.2), rgba(126, 207, 186, 0.16)), rgba(255, 255, 255, 0.76); border-color: rgba(79, 167, 222, 0.26); box-shadow: rgba(79, 167, 222, 0.28) 3px 0px 0px inset, rgba(71, 101, 142, 0.07) 0px 8px 18px; }
.console-nav-icon { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 9px; background: rgba(79, 167, 222, 0.11); color: rgb(52, 104, 149); font-size: 12px; font-family: "Courier New", monospace; }
.console-sidebar-foot { padding: 10px; border: 1px solid rgba(54, 83, 122, 0.11); border-radius: 16px; background: rgba(255, 255, 255, 0.58); color: rgb(95, 114, 141); font-size: 10px; font-weight: 900; line-height: 1.55; display: grid; gap: 8px; }
.console-sidebar-identity { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.console-content { min-width: 0px; min-height: 0px; overflow: hidden; }
.console-page { display: none; min-width: 0px; min-height: 0px; height: 100%; overflow: hidden; }
.console-page.active { display: grid; gap: 12px; }
.console-page[hidden] { display: none; }
.console-page-title { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0px; padding: 13px 15px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 20px; background: linear-gradient(90deg, rgba(126, 207, 186, 0.13), transparent 60%), rgba(255, 255, 255, 0.72); }
.console-page-title h2 { margin: 0px; color: rgb(23, 36, 58); font-size: clamp(18px, 1.7vw, 24px); line-height: 1.15; letter-spacing: 0.03em; }
.console-page-title span { color: rgb(90, 110, 137); font-size: 11px; font-weight: 900; line-height: 1.5; }
.dashboard-page { grid-template-rows: minmax(0px, 1fr); }
.dashboard-grid { min-height: 0px; height: 100%; display: grid; grid-template: "overview board" minmax(0px, 1fr) / minmax(0px, 1fr) minmax(330px, 0.48fr); gap: 12px; overflow: hidden; }
.dashboard-overview { grid-area: overview; display: grid; grid-template-rows: auto minmax(0px, 1fr); }
.dashboard-overview .newapi-card-head { padding: 11px 14px; }
.dashboard-overview .newapi-card-desc { margin-top: 3px; line-height: 1.35; }
.dashboard-head-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; flex-wrap: wrap; flex-shrink: 0; }
.dashboard-refresh-button { min-height: 30px; padding-inline: 12px; white-space: nowrap; }
.dashboard-overview .usage-update-stamp { margin-top: 5px; padding: 4px 8px; font-size: 9px; }
.dashboard-access { grid-area: access; }
.dashboard-quick { grid-area: quick; min-height: 0px; }
.dashboard-leaderboard { grid-area: board; align-self: stretch; height: min(100%, 620px); min-height: 0px; max-height: min(620px, -190px + 100vh); }
.dashboard-leaderboard .panel-body, .dashboard-leaderboard .rank-list { min-height: 0px; overflow: hidden; }
.dashboard-leaderboard .rows { min-height: 0px; overflow: hidden auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.dashboard-quick .newapi-card-body { align-content: start; }
.dashboard-key-form { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 8px; align-items: end; }
.dashboard-key-form .newapi-field { min-width: 0px; }
.dashboard-usage-metrics { grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 8px; }
.dashboard-state-metrics { grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 8px; }
.dashboard-overview .newapi-card-body { gap: 10px; grid-template-rows: auto auto auto auto minmax(0px, 1fr); }
.dashboard-hourly-card { min-height: 0px; display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 6px; padding: 8px; border: 1px solid rgba(79, 167, 222, 0.14); border-radius: 20px; background: radial-gradient(circle at 12% 0%, rgba(79, 167, 222, 0.14), transparent 30%), radial-gradient(circle at 92% 16%, rgba(126, 207, 186, 0.14), transparent 28%), linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(239, 248, 255, 0.68) 58%, rgba(245, 255, 252, 0.58)); box-shadow: rgba(255, 255, 255, 0.82) 0px 1px 0px inset, rgba(71, 101, 142, 0.07) 0px 14px 28px; overflow: hidden; }
.dashboard-hourly-head { min-width: 0px; display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.dashboard-hourly-title { color: rgb(23, 36, 58); font-size: 11px; font-weight: 900; letter-spacing: 0.11em; text-transform: uppercase; }
.dashboard-hourly-title::before { content: ""; display: inline-block; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: rgb(42, 185, 146); box-shadow: rgba(42, 185, 146, 0.14) 0px 0px 0px 5px, rgba(42, 185, 146, 0.42) 0px 0px 18px; vertical-align: 1px; }
.dashboard-hourly-desc { margin-top: 3px; color: rgb(99, 119, 146); font-size: 9px; font-weight: 900; }
.dashboard-hourly-total { flex: 0 0 auto; max-width: 45%; min-height: 24px; display: inline-flex; align-items: center; justify-content: center; padding: 4px 9px; border: 1px solid rgba(79, 167, 222, 0.2); border-radius: 999px; background: rgba(255, 255, 255, 0.66); overflow: hidden; color: rgb(18, 56, 95); font-size: 12px; font-weight: 900; text-align: right; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.hourly-chart { position: relative; width: 100%; min-height: var(--hourly-chart-height); display: block; padding: 5px 7px 7px; border: 1px solid rgba(79, 167, 222, 0.12); border-radius: 18px; background: linear-gradient(rgba(255, 255, 255, 0.82), rgba(239, 248, 255, 0.68)), radial-gradient(circle at 86% 0%, rgba(79, 167, 222, 0.14), transparent 28%), radial-gradient(circle at 10% 100%, rgba(126, 207, 186, 0.13), transparent 32%), repeating-linear-gradient(90deg, rgba(54, 83, 122, 0.03) 0px, rgba(54, 83, 122, 0.03) 1px, transparent 1px, transparent 42px); box-shadow: rgba(255, 255, 255, 0.78) 0px 1px 0px inset, rgba(79, 167, 222, 0.035) 0px -18px 36px inset; overflow: hidden; }
.hourly-chart::before { content: ""; position: absolute; inset: 0px; background: linear-gradient(115deg, transparent 0%, rgba(255, 255, 255, 0.38) 42%, transparent 54%); opacity: 0.24; pointer-events: none; transform: translateX(-28%); }
.hourly-svg { position: relative; z-index: 1; display: block; width: 100%; height: var(--hourly-chart-height); overflow: visible; }
.hourly-svg-grid { stroke: rgba(54, 83, 122, 0.07); stroke-width: 1; vector-effect: non-scaling-stroke; }
.hourly-svg-axis { stroke: rgba(38, 67, 101, 0.2); stroke-width: 1; vector-effect: non-scaling-stroke; }
.hourly-svg-label, .hourly-svg-time { fill: rgb(75, 102, 134); font-size: 11px; font-weight: 900; font-family: "Courier New", monospace; }
.hourly-svg-time { fill: rgb(23, 61, 103); font-size: 10px; letter-spacing: 0.04em; }
.hourly-svg-tick { stroke: rgba(38, 67, 101, 0.22); stroke-width: 1; vector-effect: non-scaling-stroke; }
.hourly-svg-bar { filter: drop-shadow(rgba(40, 92, 128, 0.16) 0px 8px 10px); }
.hourly-svg-cap { fill: rgba(255, 255, 255, 0.58); }
.hourly-svg-glow { fill: rgba(65, 158, 207, 0.12); }
.hourly-svg-peak-mark { stroke: rgba(35, 115, 160, 0.62); stroke-width: 2; stroke-linecap: round; vector-effect: non-scaling-stroke; filter: drop-shadow(rgba(65, 158, 207, 0.22) 0px 0px 6px); }
.hourly-chart > .empty { grid-column: 1 / -1; place-self: center; color: rgb(99, 119, 146); font-size: 11px; font-weight: 900; }
.hourly-chart.is-empty { grid-template-columns: minmax(0px, 1fr); min-height: 228px; padding: 10px; }
.hourly-empty-state { position: relative; min-height: 142px; display: grid; place-items: center; overflow: hidden; border-radius: 18px; background: radial-gradient(circle at 24% 0%, rgba(79, 167, 222, 0.16), transparent 32%), linear-gradient(rgba(255, 255, 255, 0.76), rgba(235, 246, 255, 0.62)), repeating-linear-gradient(0deg, rgba(54, 83, 122, 0.043) 0px, rgba(54, 83, 122, 0.043) 1px, transparent 1px, transparent 34px), repeating-linear-gradient(90deg, rgba(79, 167, 222, 0.04) 0px, rgba(79, 167, 222, 0.04) 1px, transparent 1px, transparent 42px); }
.hourly-empty-copy { position: relative; z-index: 1; width: min(360px, 92%); padding: 16px 18px; border: 1px solid rgba(79, 167, 222, 0.16); border-radius: 16px; background: rgba(255, 255, 255, 0.76); text-align: center; box-shadow: rgba(71, 101, 142, 0.1) 0px 14px 30px; }
.hourly-empty-title { color: rgb(23, 36, 58); font-size: 13px; font-weight: 900; letter-spacing: 0.04em; }
.hourly-empty-desc { margin-top: 6px; color: rgb(99, 119, 146); font-size: 11px; font-weight: 800; line-height: 1.55; }
.hourly-axis { min-width: 0px; display: grid; grid-template-rows: auto 1fr auto; padding: 18px 0px 22px; color: rgb(106, 125, 149); font-size: 9px; font-weight: 900; line-height: 1; text-align: right; font-family: "Courier New", monospace; }
.hourly-axis span:nth-child(2) { align-self: center; }
.hourly-axis span:last-child { align-self: end; }
.hourly-bars { min-width: 0px; min-height: 166px; display: grid; grid-template-columns: repeat(24, minmax(0px, 1fr)); align-items: stretch; gap: 7px; padding: 12px 5px 2px 12px; border-left: 1px solid rgba(54, 83, 122, 0.14); background: repeating-linear-gradient(0deg, rgba(54, 83, 122, 0.055) 0px, rgba(54, 83, 122, 0.055) 1px, transparent 1px, transparent 33.333%), linear-gradient(90deg, rgba(79, 167, 222, 0.035), transparent 24%, transparent 76%, rgba(126, 207, 186, 0.035)); }
.hourly-bar { position: relative; z-index: 1; min-width: 0px; height: 100%; display: grid; grid-template-rows: minmax(0px, 1fr) 16px; gap: 5px; align-items: end; }
.hourly-bar-value { display: none; }
.hourly-bar-track { min-height: 0px; height: 100%; display: flex; align-items: flex-end; border-radius: 999px 999px 7px 7px; background: transparent; overflow: visible; }
.hourly-bar-fill { align-self: end; width: 100%; height: var(--bar-height, 4%); min-height: 7px; border-radius: 999px 999px 6px 6px; background: linear-gradient(rgba(79, 167, 222, 0.95), rgba(126, 207, 186, 0.78)); box-shadow: rgba(79, 167, 222, 0.2) 0px 9px 18px, rgba(255, 255, 255, 0.72) 0px 1px 0px inset; }
.hourly-bar:not(.empty) .hourly-bar-track { background: linear-gradient(rgba(54, 83, 122, 0.043), rgba(54, 83, 122, 0.024)); overflow: hidden; }
.hourly-bar.peak .hourly-bar-fill { background: linear-gradient(rgba(26, 121, 191, 0.98), rgba(42, 185, 146, 0.9)); box-shadow: rgba(26, 121, 191, 0.28) 0px 11px 22px, rgba(255, 255, 255, 0.78) 0px 1px 0px inset; }
.hourly-bar.peak::before { content: ""; position: absolute; top: 1px; left: 50%; width: 7px; height: 7px; border: 2px solid rgba(255, 255, 255, 0.92); border-radius: 50%; background: rgb(26, 121, 191); box-shadow: rgba(79, 167, 222, 0.13) 0px 0px 0px 4px; transform: translateX(-50%); }
.hourly-bar.empty .hourly-bar-fill { display: none; }
.hourly-bar-label { min-width: 0px; color: rgb(99, 119, 146); font-size: 9px; font-weight: 900; line-height: 1; text-align: center; overflow: visible; white-space: nowrap; font-family: "Courier New", monospace; }
.console-page-main { min-width: 0px; min-height: 0px; display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 12px; overflow: hidden; }
.console-page-main.single { grid-template-rows: minmax(0px, 1fr); }
.console-page-grid { min-height: 0px; display: grid; grid-template-columns: minmax(320px, 0.72fr) minmax(0px, 1.28fr); gap: 12px; overflow: hidden; }
.console-page-grid.equal { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
.console-page-grid.single { grid-template-columns: minmax(0px, 1fr); }
.console-snippet-grid { min-height: 0px; display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; overflow: auto; padding-right: 3px; }
.console-snippet-grid .newapi-snippet { min-height: 170px; }
.channel-status-shell { min-height: 0px; display: grid; grid-template-rows: auto auto minmax(0px, 1fr); gap: 10px; }
.channel-status-summary { grid-template-columns: repeat(4, minmax(0px, 1fr)); }
.channel-status-toolbar { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(130px, 0.42fr) auto auto; gap: 8px; align-items: center; }
.channel-status-count { justify-self: end; color: rgb(99, 119, 146); font-family: "Courier New", monospace; font-size: 11px; font-weight: 900; white-space: nowrap; }
.channel-status-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; min-height: 0px; overflow: auto; padding-right: 3px; }
.channel-card { min-width: 0px; display: grid; gap: 12px; padding: 13px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 16px; background: radial-gradient(circle at 12% 0%, rgba(79, 167, 222, 0.14), transparent 34%), linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(241, 248, 255, 0.72)); box-shadow: rgba(71, 101, 142, 0.08) 0px 12px 26px; }
.channel-card.warn { border-color: rgba(232, 172, 76, 0.28); }
.channel-card.idle { border-color: rgba(82, 139, 181, 0.18); }
.channel-card.danger { border-color: rgba(225, 107, 107, 0.28); }
.channel-card-head { min-width: 0px; display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 10px; align-items: start; }
.channel-model-name { min-width: 0px; overflow: hidden; color: rgb(23, 36, 58); font-size: 13px; font-weight: 950; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.channel-provider-line { margin-top: 5px; color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.channel-status-pill { display: inline-flex; align-items: center; gap: 5px; padding: 5px 8px; border-radius: 999px; border: 1px solid rgba(52, 166, 120, 0.2); background: rgba(230, 250, 239, 0.72); color: rgb(40, 123, 86); font-size: 10px; font-weight: 950; white-space: nowrap; }
.channel-status-pill.idle { border-color: rgba(82, 139, 181, 0.18); background: rgba(241, 248, 255, 0.82); color: rgb(69, 99, 131); }
.channel-status-pill.warn { border-color: rgba(226, 165, 62, 0.28); background: rgba(255, 248, 225, 0.8); color: rgb(147, 99, 19); }
.channel-status-pill.danger { border-color: rgba(217, 84, 84, 0.24); background: rgba(255, 234, 234, 0.8); color: rgb(164, 59, 59); }
.channel-card-metrics { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 6px; }
.channel-card-metric { min-width: 0px; display: grid; gap: 4px; padding: 9px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 12px; background: rgba(255, 255, 255, 0.68); }
.channel-card-metric span { color: rgb(112, 130, 154); font-size: 9px; font-weight: 950; letter-spacing: 0.05em; text-transform: uppercase; }
.channel-card-metric strong { min-width: 0px; overflow: hidden; color: rgb(23, 61, 103); font-size: 12px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.channel-bars { display: grid; grid-template-columns: repeat(24, minmax(3px, 1fr)); gap: 3px; align-items: end; min-height: 32px; overflow: hidden; }
.channel-bars.hour-roll { }
.channel-bar { height: 18px; border-radius: 999px; background: rgba(82, 139, 181, 0.2); }
.channel-bar.ok { height: 28px; background: rgba(70, 184, 122, 0.74); }
.channel-bar.ok.idle { height: 28px; background: rgba(70, 184, 122, 0.34); }
.channel-bar.warn { height: 22px; background: rgba(226, 165, 62, 0.78); }
.channel-bar.failed { height: 16px; background: rgba(225, 107, 107, 0.78); }
.channel-bar.idle { background: rgba(82, 139, 181, 0.18); }
@media (prefers-reduced-motion: reduce) {
  .channel-bars.hour-roll { }
}
.channel-card-foot { min-width: 0px; overflow: hidden; color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; font-family: "Courier New", monospace; white-space: nowrap; text-overflow: ellipsis; }
.instance-config-grid { grid-template-columns: minmax(260px, 0.8fr) minmax(280px, 1fr) minmax(320px, 1.2fr); }
.instance-endpoint-list, .instance-model-controls { display: grid; gap: 8px; min-width: 0px; }
.newapi-model-scope { display: flex; min-width: 0px; align-items: center; gap: 8px; padding: 9px 10px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 12px; background: rgba(255, 255, 255, 0.68); color: rgb(66, 97, 125); font-size: 11px; font-weight: 900; }
.newapi-model-scope input { width: 15px; height: 15px; flex: 0 0 auto; accent-color: rgb(45, 117, 191); }
.newapi-model-scope span { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.instance-endpoint-list div { min-width: 0px; display: grid; gap: 5px; padding: 10px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 12px; background: rgba(255, 255, 255, 0.68); }
.instance-endpoint-list span { color: rgb(112, 130, 154); font-size: 10px; font-weight: 950; letter-spacing: 0.05em; text-transform: uppercase; }
.instance-endpoint-list strong { min-width: 0px; overflow: hidden; color: rgb(23, 61, 103); font-size: 12px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.newapi-model-list.compact { max-height: min(38vh, 340px); overflow: auto; display: grid; gap: 7px; padding-right: 2px; }
.compact-snippet { min-height: 118px; max-height: 170px; }
.visually-available { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); clip-path: inset(50%); white-space: nowrap; }
.newapi-snippet { margin: 0px; padding: 12px; border: 1px solid rgba(54, 83, 122, 0.13); border-radius: 15px; background: rgba(248, 251, 255, 0.9); color: rgb(38, 58, 87); font-size: 11px; line-height: 1.62; white-space: pre-wrap; word-break: break-word; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.usage-query-cards { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 10px; }
.usage-ledger-panel { min-height: 0px; display: grid; gap: 12px; padding: 14px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 20px; background: radial-gradient(circle at 92% 0%, rgba(79, 167, 222, 0.15), transparent 32%), linear-gradient(135deg, rgba(126, 207, 186, 0.11), transparent 58%), rgba(248, 251, 255, 0.78); }
.usage-ledger-head { min-width: 0px; display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.usage-ledger-kicker { color: rgb(75, 102, 134); font-size: 10px; font-weight: 900; letter-spacing: 0.14em; text-transform: uppercase; font-family: "Courier New", monospace; }
.usage-ledger-title { margin-top: 4px; color: rgb(23, 36, 58); font-size: 16px; font-weight: 900; line-height: 1.25; }
.usage-ledger-subtitle { margin-top: 5px; color: rgb(99, 119, 146); font-size: 11px; font-weight: 800; line-height: 1.5; }
.usage-update-stamp { display: inline-flex; align-items: center; width: fit-content; margin-top: 7px; padding: 5px 9px; border: 1px solid rgba(79, 167, 222, 0.16); border-radius: 999px; background: rgba(255, 255, 255, 0.6); color: rgb(91, 117, 149); font-size: 10px; font-weight: 900; letter-spacing: 0.03em; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.recharge-grid { min-height: 0px; display: grid; grid-template-columns: minmax(0px, 1.05fr) minmax(320px, 0.72fr); gap: 12px; }
.recharge-wallet-card, .recharge-checkout-card { min-height: 0px; }
.recharge-wallet-card .newapi-card-body, .recharge-checkout-card .newapi-card-body { display: grid; gap: 11px; min-height: 0px; }
.recharge-balance-panel { display: grid; grid-template-columns: 1.15fr repeat(2, minmax(0px, 0.72fr)); gap: 8px; padding: 10px; border: 1px solid rgba(79, 167, 222, 0.16); border-radius: 14px; background: radial-gradient(circle at 6% 0%, rgba(126, 207, 186, 0.26), transparent 36%), linear-gradient(135deg, rgba(255, 255, 255, 0.86), rgba(239, 248, 255, 0.74)); }
.recharge-balance-panel > div { min-width: 0px; padding: 8px; border-radius: 11px; background: rgba(255, 255, 255, 0.58); box-shadow: rgba(255, 255, 255, 0.62) 0px 0px 0px 1px inset; }
.recharge-balance-panel span, .recharge-section-title, .recharge-summary-card span { display: block; color: rgb(95, 114, 141); font-size: 9px; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase; }
.recharge-balance-panel strong { display: block; margin-top: 4px; color: rgb(23, 61, 103); font-size: clamp(15px, 1.7vw, 22px); font-weight: 950; line-height: 1.1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.recharge-section-title { margin-top: 2px; }
.recharge-plan-grid { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 8px; }
.recharge-plan-card { min-width: 0px; min-height: 92px; padding: 10px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 13px; background: linear-gradient(160deg, rgba(255, 255, 255, 0.9), rgba(243, 249, 255, 0.78)); color: rgb(23, 36, 58); text-align: left; cursor: pointer; box-shadow: rgba(71, 101, 142, 0.08) 0px 12px 26px; }
.recharge-plan-card:hover, .recharge-plan-card.active { transform: translateY(-1px); border-color: rgba(79, 167, 222, 0.34); background: radial-gradient(circle at 88% 0%, rgba(126, 207, 186, 0.28), transparent 42%), linear-gradient(160deg, rgba(255, 255, 255, 0.96), rgba(232, 247, 255, 0.84)); }
.recharge-plan-card span, .recharge-plan-card em { display: block; color: rgb(99, 119, 146); font-size: 9px; font-style: normal; font-weight: 900; }
.recharge-plan-card strong { display: block; margin: 7px 0px 5px; color: rgb(20, 54, 95); font-size: 21px; font-weight: 950; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.recharge-custom-row { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 8px; align-items: end; }
.recharge-quota-preview { min-width: 118px; padding: 8px 10px; border: 1px solid rgba(79, 167, 222, 0.16); border-radius: 11px; background: rgba(255, 255, 255, 0.66); color: rgb(40, 84, 127); font-size: 10px; font-weight: 950; text-align: center; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.recharge-method-list { display: grid; gap: 7px; }
.recharge-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px; }
.recharge-setting-card { min-width: 0px; padding: 10px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 15px; background: rgba(248, 251, 255, 0.82); }
.recharge-setting-card span { display: block; color: rgb(96, 117, 143); font-size: 9px; font-weight: 950; letter-spacing: 0.08em; text-transform: uppercase; }
.recharge-setting-card strong { display: block; margin-top: 5px; color: rgb(23, 61, 103); font-size: 11px; font-weight: 950; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.recharge-method-card { width: 100%; min-width: 0px; padding: 9px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 12px; background: rgba(248, 251, 255, 0.86); color: inherit; text-align: left; cursor: pointer; }
.recharge-method-card.active { border-color: rgba(126, 207, 186, 0.34); background: linear-gradient(135deg, rgba(126, 207, 186, 0.18), transparent 64%), rgba(255, 255, 255, 0.84); }
.recharge-method-card.disabled { opacity: 0.58; cursor: not-allowed; }
.recharge-method-card strong { display: block; color: rgb(23, 36, 58); font-size: 11px; font-weight: 950; }
.recharge-method-card span { display: block; margin-top: 3px; color: rgb(99, 119, 146); font-size: 10px; font-weight: 800; line-height: 1.4; }
.recharge-summary-card { padding: 10px; border: 1px solid rgba(79, 167, 222, 0.16); border-radius: 13px; background: radial-gradient(circle at 92% 0%, rgba(79, 167, 222, 0.18), transparent 38%), rgba(255, 255, 255, 0.72); }
.recharge-summary-card strong { display: block; margin-top: 5px; color: rgb(23, 61, 103); font-size: 14px; font-weight: 950; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.recharge-summary-card p { margin: 5px 0px 0px; color: rgb(99, 119, 146); font-size: 10px; font-weight: 800; line-height: 1.45; }
.recharge-result { min-height: 92px; }
.recharge-jump-card { margin-top: 12px; border-color: rgba(79, 167, 222, 0.2); background: radial-gradient(circle at 8% 0%, rgba(126, 207, 186, 0.28), transparent 34%), radial-gradient(circle at 92% 8%, rgba(79, 167, 222, 0.2), transparent 38%), rgba(248, 251, 255, 0.9); }
.recharge-jump-layout { display: grid; grid-template-columns: minmax(220px, 0.42fr) minmax(0px, 1fr); gap: 14px; align-items: stretch; }
.recharge-qr-panel { display: grid; gap: 8px; align-content: start; }
.recharge-qr-frame { position: relative; display: grid; place-items: center; min-height: 260px; padding: 18px; border: 1px solid rgba(79, 167, 222, 0.18); border-radius: 22px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.92), rgba(235, 247, 255, 0.82)); box-shadow: rgba(255, 255, 255, 0.72) 0px 0px 0px 1px inset; overflow: hidden; }
.recharge-qr-frame::before { content: ""; position: absolute; inset: 14px; border: 1px dashed rgba(79, 167, 222, 0.25); border-radius: 18px; pointer-events: none; }
.recharge-qr-frame img { position: relative; z-index: 1; width: min(220px, 86%); aspect-ratio: 1 / 1; object-fit: contain; border-radius: 14px; background: rgb(255, 255, 255); box-shadow: rgba(56, 84, 120, 0.13) 0px 18px 34px; }
.recharge-qr-empty { position: relative; z-index: 1; max-width: 190px; color: rgb(99, 119, 146); font-size: 12px; font-weight: 900; line-height: 1.55; text-align: center; }
.recharge-jump-detail { display: grid; gap: 11px; min-width: 0px; }
.recharge-jump-grid { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 9px; }
.recharge-jump-grid > div { min-width: 0px; padding: 9px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 12px; background: rgba(255, 255, 255, 0.74); }
.recharge-jump-grid span { display: block; color: rgb(96, 117, 143); font-size: 8px; font-weight: 950; letter-spacing: 0.04em; text-transform: uppercase; }
.recharge-jump-grid strong { display: block; margin-top: 5px; overflow: hidden; color: rgb(23, 61, 103); font-size: 11px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.recharge-jump-memo { min-height: 138px; margin: 0px; }
.topup-order-list { display: grid; gap: 9px; max-height: 280px; overflow: auto; padding-right: 2px; }
.topup-order-row { display: grid; grid-template-columns: minmax(0px, 1.2fr) auto auto minmax(82px, auto); gap: 10px; align-items: center; padding: 11px 12px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 15px; background: linear-gradient(135deg, rgba(126, 207, 186, 0.1), transparent 58%), rgba(255, 255, 255, 0.78); }
.topup-order-main { min-width: 0px; display: grid; gap: 4px; }
.topup-order-main strong { overflow: hidden; color: rgb(23, 36, 58); font-size: 13px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.topup-order-main span, .topup-order-meta { overflow: hidden; color: rgb(99, 119, 146); font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.topup-status-pill { display: inline-flex; align-items: center; justify-content: center; min-width: 72px; padding: 6px 9px; border-radius: 999px; border: 1px solid rgba(54, 83, 122, 0.13); background: rgba(255, 255, 255, 0.78); color: rgb(49, 80, 111); font-size: 10px; font-weight: 950; letter-spacing: 0.06em; text-transform: uppercase; }
.topup-status-pill.completed { border-color: rgba(48, 178, 126, 0.26); background: rgba(126, 207, 186, 0.18); color: rgb(23, 112, 82); }
.topup-status-pill.submitted { border-color: rgba(79, 167, 222, 0.28); background: rgba(79, 167, 222, 0.14); color: rgb(29, 93, 137); }
.topup-status-pill.cancelled { border-color: rgba(214, 95, 95, 0.24); background: rgba(255, 179, 142, 0.17); color: rgb(154, 74, 56); }
.topup-order-actions { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 7px; }
.usage-query-card, .admin-account-row { min-width: 0px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 16px; background: linear-gradient(135deg, rgba(126, 207, 186, 0.1), transparent 60%), rgba(248, 251, 255, 0.86); }
.usage-query-card { padding: 12px; }
.usage-query-card span { display: block; color: rgb(95, 114, 141); font-size: 10px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.usage-query-card strong { display: block; margin-top: 7px; color: rgb(23, 36, 58); font-size: 18px; font-weight: 900; font-family: "Courier New", monospace; }
.admin-account-list { display: grid; grid-template-columns: minmax(0px, 1fr); align-content: start; gap: 8px; overflow: visible; padding: 0px 3px 18px 0px; }
.admin-account-list > .empty { grid-column: 1 / -1; }
.admin-summary-strip { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 10px; }
.admin-summary-card { min-width: 0px; padding: 11px 12px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 15px; background: radial-gradient(circle at 12% 0%, rgba(79, 167, 222, 0.13), transparent 38%), rgba(248, 251, 255, 0.86); }
.admin-summary-card span { display: block; color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.admin-summary-card strong { display: block; margin-top: 6px; overflow: hidden; color: rgb(23, 61, 103); font-size: 16px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.admin-account-filter { display: grid; grid-template-columns: minmax(180px, 1fr) minmax(220px, 0.72fr); gap: 8px; align-items: center; margin: 2px 0px 4px; }
.admin-payment-panel { display: grid; gap: 12px; margin: 12px 0px 14px; padding: 14px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 20px; background: radial-gradient(circle at 92% 4%, rgba(126, 207, 186, 0.18), transparent 35%), linear-gradient(135deg, rgba(79, 167, 222, 0.1), transparent 64%), rgba(248, 251, 255, 0.9); box-shadow: rgba(71, 101, 142, 0.07) 0px 12px 28px; }
.admin-payment-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.admin-payment-title { color: rgb(23, 36, 58); font-size: 15px; font-weight: 950; letter-spacing: 0.03em; }
.admin-payment-desc { margin-top: 4px; color: rgb(99, 119, 146); font-size: 11px; font-weight: 800; line-height: 1.55; }
.admin-payment-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; }
.admin-payment-methods { display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 8px; }
.admin-payment-method { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px; padding: 8px 10px; border: 1px solid rgba(54, 83, 122, 0.13); border-radius: 14px; background: rgba(255, 255, 255, 0.74); color: rgb(49, 80, 111); font-size: 11px; font-weight: 900; cursor: pointer; user-select: none; }
.admin-payment-method input { accent-color: rgb(47, 159, 186); }
.admin-payment-status { min-height: 20px; color: rgb(99, 119, 146); font-size: 11px; font-weight: 850; }
.admin-account-row { display: grid; grid-template-columns: minmax(210px, 1.2fr) minmax(360px, 1.6fr) minmax(280px, 1.2fr); gap: 7px; align-items: center; padding: 7px 9px; border-radius: 10px; background: rgba(248, 251, 255, 0.72); box-shadow: none; }
.admin-account-head { min-width: 0px; display: grid; grid-template-columns: auto minmax(0px, 1fr); gap: 7px; align-items: center; }
.admin-account-select { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border: 1px solid rgba(54, 83, 122, 0.14); border-radius: 9px; background: rgba(255, 255, 255, 0.62); cursor: pointer; }
.admin-account-select input { width: 15px; height: 15px; margin: 0px; accent-color: rgb(47, 159, 186); cursor: pointer; }
.admin-account-select:hover { border-color: rgba(79, 167, 222, 0.28); background: rgba(240, 248, 255, 0.88); }
.admin-account-name { min-width: 0px; display: grid; gap: 3px; }
.admin-account-name strong { color: rgb(23, 36, 58); font-size: 13px; font-weight: 900; line-height: 1.25; overflow-wrap: anywhere; white-space: normal; }
.admin-account-name span, .admin-account-stat span { color: rgb(99, 119, 146); font-size: 9px; font-weight: 900; font-family: "Courier New", monospace; }
.admin-account-id { display: inline-flex; width: fit-content; max-width: 100%; padding: 2px 6px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 8px; background: rgba(255, 255, 255, 0.7); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-balance-pill { display: inline-flex; align-items: center; justify-content: center; width: fit-content; max-width: 100%; padding: 2px 7px; border: 1px solid rgba(46, 168, 107, 0.24); border-radius: 8px; background: rgba(237, 255, 247, 0.86); color: rgb(31, 122, 77); font-size: 10px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.admin-account-actions { display: none; }
.admin-account-stats { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 4px; }
.admin-account-stat { min-width: 0px; display: grid; gap: 2px; padding: 4px 6px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 8px; background: rgba(255, 255, 255, 0.44); }
.admin-account-stat strong { overflow: hidden; color: rgb(23, 61, 103); font-size: 11px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.admin-balance-form { display: grid; grid-template-columns: minmax(0px, 1fr) auto auto; gap: 5px; align-items: center; padding-top: 0px; }
.admin-expiry-form, .admin-bulk-expiry { display: grid; grid-template-columns: minmax(0px, 1fr) auto auto; gap: 5px; align-items: center; }
.admin-bulk-expiry { margin: 8px 0px 10px; padding: 10px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 14px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(240, 248, 255, 0.68)); }
.admin-expiry-note, .admin-bulk-expiry-note { color: rgb(99, 119, 146); font-size: 10px; font-weight: 800; line-height: 1.45; }
.admin-bulk-expiry-note { grid-column: 1 / -1; }
.admin-bulk-selection { grid-column: 1 / -1; display: grid; grid-template-columns: auto auto minmax(0px, 1fr); gap: 6px; align-items: center; }
.admin-bulk-selected-count { display: inline-flex; align-items: center; min-height: 30px; padding: 0px 9px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 999px; background: rgba(255, 255, 255, 0.56); color: rgb(82, 112, 147); font-size: 11px; font-weight: 900; justify-self: end; }
.admin-account-tools { min-width: 0px; display: grid; grid-template-columns: auto minmax(0px, 1fr) minmax(0px, 1.15fr); gap: 5px; align-items: center; }
.admin-balance-form .newapi-input, .admin-expiry-form .newapi-input, .admin-bulk-expiry .newapi-input { min-height: 30px; padding: 5px 7px; border-radius: 8px; font-size: 11px; }
.admin-account-tools .admin-display-name-form .newapi-input { min-height: 30px; padding: 5px 7px; border-radius: 8px; font-size: 11px; }
.admin-account-tools .admin-expiry-form { grid-column: 2 / -1; }
.admin-account-tools .newapi-button.slim { min-height: 30px; padding: 5px 8px; border-radius: 8px; font-size: 10px; }
.call-detail-layout { min-height: 0px; display: grid; grid-template-columns: minmax(260px, 0.7fr) minmax(0px, 1.3fr); gap: 12px; align-items: start; }
.own-usage-layout { min-height: 0px; display: grid; grid-template-columns: minmax(0px, 1fr); gap: 12px; align-items: start; }
.own-usage-column { min-width: 0px; display: grid; gap: 12px; }
.own-model-panel { position: static; align-self: start; background: radial-gradient(circle at 14% 0%, rgba(79, 167, 222, 0.13), transparent 36%), linear-gradient(135deg, rgba(126, 207, 186, 0.1), transparent 58%), rgba(248, 251, 255, 0.82); }
.call-detail-panel { min-width: 0px; display: grid; gap: 10px; padding: 13px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 18px; background: rgba(248, 251, 255, 0.72); }
.call-detail-title { color: rgb(23, 36, 58); font-size: 12px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; }
.call-detail-title-row { min-width: 0px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.call-detail-subtitle { color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; white-space: nowrap; font-family: "Courier New", monospace; }
.model-breakdown-list, .call-recent-list { display: grid; gap: 8px; }
.own-model-panel .model-breakdown-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(232px, 1fr)); align-items: stretch; gap: 10px; max-height: none; overflow: visible; padding-right: 0px; }
.own-model-compact-row { min-width: 0px; display: grid; gap: 6px; align-content: start; min-height: 118px; padding: 10px 11px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 16px; background: radial-gradient(circle at 12% 0%, rgba(126, 207, 186, 0.22), transparent 38%), linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(235, 247, 255, 0.66)), rgba(255, 255, 255, 0.68); box-shadow: rgba(255, 255, 255, 0.86) 0px 1px 0px inset, rgba(71, 101, 142, 0.06) 0px 10px 20px; }
.own-model-compact-top { min-width: 0px; display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 10px; align-items: baseline; }
.own-model-compact-name { min-width: 0px; overflow: hidden; color: rgb(23, 36, 58); font-size: 12px; font-weight: 950; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.own-model-compact-cost { color: rgb(13, 71, 125); font-family: "Courier New", monospace; font-size: 12px; font-weight: 950; white-space: nowrap; }
.own-model-compact-meta, .own-model-compact-price { min-width: 0px; overflow: hidden; color: rgb(99, 119, 146); font-family: "Courier New", monospace; font-size: 9px; font-weight: 900; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.own-model-compact-stats, .token-breakdown { min-width: 0px; display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.own-model-compact-chip, .token-breakdown-chip { display: inline-flex; align-items: baseline; gap: 3px; min-width: 0px; padding: 2px 5px; border: 1px solid rgba(55, 117, 172, 0.12); border-radius: 999px; background: rgba(239, 248, 255, 0.72); color: rgb(23, 61, 103); font-family: "Courier New", monospace; font-size: 9px; font-weight: 900; line-height: 1.15; white-space: nowrap; }
.own-model-compact-chip span, .token-breakdown-chip span { color: rgb(112, 130, 154); font-size: 8px; letter-spacing: 0.04em; text-transform: uppercase; }
.own-model-table-head, .own-model-table-row { min-width: 0px; display: grid; grid-template-columns: minmax(174px, 1.45fr) minmax(120px, 0.74fr) minmax(50px, 0.34fr) minmax(62px, 0.4fr) minmax(70px, 0.46fr); gap: 8px; align-items: center; }
.own-model-table-head { padding: 0px 10px 2px; color: rgb(112, 130, 154); font-size: 9px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; font-family: "Courier New", monospace; }
.own-model-table-row { padding: 8px 10px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 13px; background: rgba(255, 255, 255, 0.68); }
.own-model-table-name, .own-model-table-period, .own-model-table-value { min-width: 0px; overflow: hidden; text-overflow: ellipsis; font-family: "Courier New", monospace; }
.own-model-table-name { display: grid; gap: 3px; color: rgb(23, 36, 58); font-size: 12px; font-weight: 900; line-height: 1.25; white-space: normal; }
.own-model-table-name strong { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.own-model-table-pricing { overflow: hidden; font-size: 8px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.own-model-table-period { color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; text-align: right; white-space: nowrap; }
.own-model-table-value { color: rgb(23, 61, 103); font-size: 12px; font-weight: 900; text-align: right; white-space: nowrap; }
.model-breakdown-row { min-width: 0px; display: grid; grid-template-columns: minmax(0px, 1.35fr) minmax(58px, 0.35fr) minmax(72px, 0.45fr) minmax(78px, 0.45fr); gap: 10px; align-items: center; padding: 10px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 14px; background: rgba(255, 255, 255, 0.68); }
.own-model-panel .model-breakdown-row { grid-template-columns: minmax(190px, 1.25fr) minmax(86px, 0.36fr) minmax(86px, 0.36fr) minmax(90px, 0.4fr); gap: 8px; padding: 8px 10px; border-radius: 13px; }
.own-model-panel .model-breakdown-main { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(132px, auto); gap: 10px; align-items: center; }
.own-model-panel .model-breakdown-meta { margin-top: 0px; text-align: right; font-size: 9px; }
.own-model-panel .model-breakdown-metric { grid-template-columns: auto minmax(0px, 1fr); gap: 5px; align-items: baseline; text-align: right; }
.own-model-panel .model-breakdown-metric span { font-size: 8px; letter-spacing: 0.04em; }
.own-model-panel .model-breakdown-metric strong { font-size: 11px; }
.own-model-panel .model-breakdown-cost { display: flex; align-items: baseline; justify-content: flex-end; gap: 5px; font-size: 11px; }
.own-model-panel .model-breakdown-cost::before { display: inline; margin: 0px; font-size: 8px; }
.model-breakdown-main { min-width: 0px; }
.model-breakdown-name { min-width: 0px; color: rgb(23, 36, 58); font-size: 12px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.model-breakdown-meta { margin-top: 4px; color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.model-breakdown-pricing { margin-top: 3px; overflow: hidden; font-size: 9px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.model-breakdown-metric { min-width: 0px; display: grid; gap: 3px; text-align: right; }
.model-breakdown-metric span { color: rgb(112, 130, 154); font-size: 9px; font-weight: 900; letter-spacing: 0.06em; text-transform: uppercase; }
.model-breakdown-metric strong { min-width: 0px; overflow: hidden; color: rgb(23, 61, 103); font-size: 12px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.model-breakdown-cost { color: rgb(23, 61, 103); font-size: 12px; font-weight: 900; overflow: hidden; text-align: right; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.model-breakdown-cost::before { content: "用量估算"; display: block; margin-bottom: 3px; color: rgb(112, 130, 154); font-size: 9px; font-weight: 900; letter-spacing: 0.06em; line-height: 1; text-transform: uppercase; }
.call-recent-row { min-width: 0px; display: grid; gap: 10px; padding: 12px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 18px; background: radial-gradient(circle at 10% 0%, rgba(79, 167, 222, 0.12), transparent 34%), linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(241, 248, 255, 0.74)); box-shadow: rgba(255, 255, 255, 0.84) 0px 1px 0px inset, rgba(71, 101, 142, 0.06) 0px 10px 22px; }
.call-recent-row.failed { border-color: rgba(225, 107, 107, 0.22); background: radial-gradient(circle at 90% 0%, rgba(255, 179, 142, 0.16), transparent 30%), linear-gradient(135deg, rgba(255, 250, 250, 0.9), rgba(255, 241, 241, 0.76)); }
.call-recent-head { min-width: 0px; display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 10px; align-items: start; }
.call-recent-head-main { min-width: 0px; display: grid; gap: 6px; }
.call-recent-kicker { color: rgb(112, 130, 154); font-size: 9px; font-weight: 950; letter-spacing: 0.08em; text-transform: uppercase; font-family: "Courier New", monospace; }
.call-recent-model-name { min-width: 0px; overflow: hidden; color: rgb(23, 36, 58); padding: 7px 10px; border: 1px solid rgba(79, 167, 222, 0.14); border-radius: 13px; background: rgba(240, 248, 255, 0.88); font-size: 14px; font-weight: 950; line-height: 1.35; text-overflow: ellipsis; white-space: normal; overflow-wrap: anywhere; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.call-recent-meta-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.call-recent-time-badge { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; padding: 4px 8px; border: 1px solid rgba(54, 83, 122, 0.11); border-radius: 999px; background: rgba(255, 255, 255, 0.72); color: rgb(98, 118, 146); font-size: 10px; font-weight: 900; white-space: nowrap; font-family: "Courier New", monospace; }
.call-recent-head-side { display: inline-flex; justify-content: flex-end; }
.call-recent-body { min-width: 0px; display: grid; grid-template-columns: minmax(0px, 1.35fr) repeat(3, minmax(82px, 0.44fr)); gap: 8px; align-items: stretch; }
.call-recent-token-card { color: rgb(23, 36, 58); display: grid; gap: 6px; min-width: 0px; padding: 10px 11px; border: 1px solid rgba(79, 167, 222, 0.14); border-radius: 16px; background: radial-gradient(circle at 10% 0%, rgba(126, 207, 186, 0.18), transparent 34%), rgba(240, 248, 255, 0.84); }
.call-recent-token-card .token-breakdown { min-width: 0px; justify-content: flex-start; }
.call-recent-metric { display: grid; gap: 4px; }
.call-recent-metric span { color: rgb(112, 130, 154); font-size: 9px; font-weight: 950; letter-spacing: 0.08em; text-transform: uppercase; font-family: "Courier New", monospace; }
.call-recent-metric strong { min-width: 0px; overflow: hidden; color: rgb(23, 61, 103); padding: 10px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 14px; background: rgba(255, 255, 255, 0.72); font-size: 12px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.call-recent-cell { min-width: 0px; overflow: hidden; color: rgb(38, 58, 87); font-size: 11px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.call-recent-cell.model { color: rgb(23, 36, 58); padding: 5px 8px; border-radius: 10px; background: rgba(79, 167, 222, 0.12); font-size: 12px; font-weight: 950; line-height: 1.25; }
.call-recent-cell.tokenmix { display: grid; gap: 4px; }
.call-recent-token-total { color: rgb(13, 71, 125); font-size: 13px; font-weight: 950; line-height: 1.1; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.call-detail-subtitle { margin: 2px 0px 0px; color: rgb(111, 129, 152); font-size: 10px; font-weight: 900; letter-spacing: 0.05em; text-transform: uppercase; }
.call-model-chip-list { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0px 10px; }
.call-model-chip { max-width: 100%; overflow: hidden; padding: 6px 10px; border: 1px solid rgba(79, 167, 222, 0.18); border-radius: 999px; background: rgba(240, 248, 255, 0.92); color: rgb(23, 61, 103); font-size: 11px; font-weight: 950; line-height: 1; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.call-status-pill { display: inline-flex; align-items: center; justify-content: center; padding: 4px 7px; border-radius: 999px; background: rgba(237, 255, 247, 0.86); color: rgb(31, 122, 77); font-size: 10px; font-weight: 900; white-space: nowrap; }
.call-status-pill.failed { background: rgba(255, 238, 238, 0.9); color: rgb(158, 56, 56); }
.admin-account-row.clickable { cursor: pointer; }
.admin-account-row.clickable:hover, .admin-account-row.expanded { border-color: rgba(79, 167, 222, 0.28); box-shadow: rgba(71, 101, 142, 0.12) 0px 14px 30px; }
.admin-account-row.is-selected { border-color: rgba(47, 159, 186, 0.42); background: linear-gradient(135deg, rgba(126, 207, 186, 0.18), rgba(240, 248, 255, 0.74)); box-shadow: rgba(47, 159, 186, 0.64) 3px 0px 0px inset, rgba(71, 101, 142, 0.08) 0px 10px 24px; }
.admin-account-detail { display: grid; gap: 12px; padding-top: 2px; }
.admin-account-detail-page { grid-column: 1 / -1; display: grid; gap: 12px; padding: 14px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 18px; background: radial-gradient(circle at 12% 0%, rgba(79, 167, 222, 0.14), transparent 34%), linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(241, 248, 255, 0.78)); box-shadow: rgba(71, 101, 142, 0.08) 0px 12px 28px; }
.admin-account-detail-head { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 12px; align-items: start; padding-bottom: 2px; }
.admin-account-detail-title { display: grid; gap: 6px; min-width: 0px; }
.admin-account-detail-title strong { color: rgb(23, 36, 58); font-size: clamp(18px, 2vw, 24px); font-weight: 900; line-height: 1.22; overflow-wrap: anywhere; }
.admin-account-detail-title span { width: fit-content; max-width: 100%; padding: 4px 9px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 999px; background: rgba(255, 255, 255, 0.68); color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: "Courier New", monospace; }
.admin-account-detail-actions { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.admin-account-detail-grid { display: grid; grid-template-columns: minmax(0px, 0.9fr) minmax(0px, 1.1fr); gap: 12px; align-items: start; }
.admin-detail-summary-strip { margin-top: 2px; }
.admin-account-tools-panel { display: grid; gap: 10px; padding: 12px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 18px; background: radial-gradient(circle at 86% 4%, rgba(126, 207, 186, 0.16), transparent 34%), linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(241, 248, 255, 0.78)); box-shadow: rgba(255, 255, 255, 0.84) 0px 1px 0px inset, rgba(71, 101, 142, 0.06) 0px 10px 22px; }
.admin-account-tools-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; }
.admin-account-tool-card { display: grid; gap: 8px; min-width: 0px; padding: 11px 12px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 16px; background: rgba(255, 255, 255, 0.74); }
.admin-account-tool-card.model-access-card { grid-column: 1 / -1; }
.model-access-form { display: grid; gap: 10px; }
.model-access-toolbar { display: grid; grid-template-columns: minmax(170px, 0.45fr) minmax(220px, 1fr) auto; gap: 8px; align-items: center; }
.model-access-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 7px; max-height: 230px; overflow-y: auto; padding: 9px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 13px; background: rgba(246, 250, 255, 0.82); scrollbar-gutter: stable; }
.model-access-option { display: flex; align-items: center; gap: 8px; min-width: 0px; padding: 8px 9px; border: 1px solid rgba(54, 83, 122, 0.1); border-radius: 11px; background: rgba(255, 255, 255, 0.86); color: rgb(51, 75, 106); font: 800 11px / 1.35 "Courier New", monospace; cursor: pointer; }
.model-access-option input { flex: 0 0 auto; accent-color: rgb(50, 121, 200); }
.model-access-option span { min-width: 0px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.model-access-summary { color: rgb(88, 112, 142); font-size: 10px; font-weight: 850; }
.admin-account-tool-title { color: rgb(23, 36, 58); font-size: 11px; font-weight: 950; letter-spacing: 0.06em; text-transform: uppercase; }
.admin-account-tool-hint { color: rgb(99, 119, 146); font-size: 10px; font-weight: 800; line-height: 1.45; }
.admin-detail-toggle { white-space: nowrap; }
.console-page[data-console-page="admin"] { overflow: auto; padding-right: 4px; scrollbar-gutter: stable; }
.console-page[data-console-page="admin"] .console-page-grid, .console-page[data-console-page="admin"] .newapi-card, .console-page[data-console-page="admin"] .newapi-card-body { min-height: auto; overflow: visible; }
.console-page[data-console-page="admin"] .newapi-card-body { padding-bottom: 22px; }
@media (max-width: 1240px) {
  .topbar { grid-template-columns: minmax(0px, 0.72fr) minmax(460px, 1.28fr); }
  .stage { grid-template-columns: minmax(460px, 1.18fr) minmax(300px, 0.82fr); }
  .models-stage { grid-template-columns: minmax(0px, 1fr); }
  .newapi-grid, .newapi-workbench { grid-template-columns: minmax(0px, 1fr); }
  .newapi-grid.console-grid { grid-template-columns: minmax(0px, 1fr); }
  .console-left-rail { grid-template-columns: minmax(0px, 0.92fr) minmax(280px, 0.78fr); grid-template-rows: minmax(0px, 1fr); }
  .model-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 980px) {
  .app { inset: 8px; overflow: auto; }
  .topbar { padding: 10px; grid-template-columns: minmax(0px, 1fr); }
  .stage { padding: 0px 10px 10px; grid-template-columns: minmax(0px, 1fr); overflow: auto; }
  .detail-panel { min-height: 320px; }
  .stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .newapi-panel .panel-body { overflow: visible; }
  .newapi-hero { grid-template-columns: minmax(0px, 1fr); }
  .newapi-metrics { grid-template-columns: minmax(0px, 1fr); }
  .console-stage { overflow: visible; }
  .console-shell-panel .panel-body { padding: 10px; }
  .console-grid, .newapi-grid.console-grid, .console-left-rail, .newapi-model-tools { grid-template-columns: minmax(0px, 1fr); }
  .console-left-rail { grid-template-rows: auto minmax(260px, auto); }
  .mini-leaderboard-panel { width: auto; height: 260px; }
  .models-stage { grid-template-columns: minmax(0px, 1fr); }
  .model-grid { grid-template-columns: minmax(0px, 1fr); }
  .model-provider-switch { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); width: 100%; }
  .model-provider-tab { min-width: 0px; }
  .view-tab { min-width: 92px; padding-inline: 10px; }
}
@media (max-width: 600px) {
  html, body { overflow: auto; }
  .app { position: relative; inset: auto; width: 100%; min-height: 100vh; gap: 6px; border-radius: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; overflow: visible; }
  .topbar { padding: 6px; gap: 6px; }
  .title-copy { padding: 8px 10px; gap: 6px; border-radius: 16px; }
  h1 { font-size: 18px; }
  .view-switch { flex-wrap: wrap; gap: 3px; padding: 3px; }
  .view-tab { min-width: 64px; padding: 5px 8px; font-size: 10px; }
  .stats { gap: 5px; }
  .metric { padding: 10px 10px 8px; border-radius: 14px; box-shadow: rgba(155, 173, 198, 0.14) 3px 3px 0px; }
  .metric .value { font-size: 18px; margin-top: 4px; }
  .metric .label { font-size: 9px; }
  .stage { padding: 0px 6px 6px; gap: 8px; }
  .podium { grid-template-columns: 1fr 1fr 1fr; gap: 6px; }
  .podium-card { min-height: 80px; padding: 8px; border-radius: 14px; }
  .podium-medal { width: 26px; height: 24px; font-size: 11px; border-radius: 10px; }
  .podium-name { font-size: 11px; margin-top: 4px; gap: 4px; }
  .podium-score { font-size: 11px; margin-top: 2px; }
  .podium-meta { font-size: 9px; margin-top: 2px; }
  .board-ticker { font-size: 10px; padding: 6px 10px; border-radius: 12px; }
  .rank-list-head { grid-template-columns: 30px minmax(0px, 1fr) 72px; gap: 6px; padding: 0px 12px 0px 2px; font-size: 9px; }
  .rows { gap: 6px; }
  .row { grid-template-columns: 30px minmax(0px, 1fr) 72px; gap: 6px; padding: 10px; border-radius: 14px; min-height: 52px; }
  .rank-badge { width: 30px; height: 30px; font-size: 12px; border-radius: 10px; }
  .name { font-size: 13px; gap: 4px; }
  .detail-row { padding: 8px 10px; }
  .detail-row strong { font-size: 11px; }
  .detail-panel { min-height: 260px; }
  .panel-head { font-size: 12px; padding: 10px 14px; }
  .scene, body::before { display: none; }
  .leaderboard-panel .panel-body { gap: 6px; }
}
.frontier-news-stage { z-index: 10; grid-template-columns: minmax(0px, 1fr); }
.frontier-news-panel { background: rgb(248, 249, 250); border: 1px solid rgb(224, 224, 224); min-height: 700px; display: flex; flex-direction: column; font-family: "PingFang SC", "Microsoft YaHei", "Hiragino Sans GB", sans-serif; }
.newspaper-header { background: rgb(26, 35, 126); color: white; padding: 20px 30px; border-bottom: 3px solid rgb(255, 107, 107); }
.newspaper-title { font-size: 28px; font-weight: 900; letter-spacing: 2px; text-transform: uppercase; margin-bottom: 8px; text-shadow: rgba(0, 0, 0, 0.3) 2px 2px 4px; }
.newspaper-subtitle { font-size: 14px; opacity: 0.9; font-weight: 300; letter-spacing: 1px; }
.newspaper-content { flex: 1 1 0%; padding: 25px; display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 25px; overflow-y: auto; }
.newspaper-column { background: white; border: 1px solid rgb(221, 221, 221); border-radius: 4px; box-shadow: rgba(0, 0, 0, 0.05) 0px 2px 8px; overflow: hidden; }
.column-header { background: rgb(245, 245, 245); border-bottom: 2px solid; padding: 15px 20px; display: flex; justify-content: space-between; align-items: center; }
.column-title { font-size: 18px; font-weight: 700; color: rgb(51, 51, 51); display: flex; align-items: center; gap: 10px; }
.column-title::before { content: "📰"; font-size: 20px; }
.column-source { font-size: 12px; color: rgb(102, 102, 102); background: rgb(238, 238, 238); padding: 3px 10px; border-radius: 12px; font-weight: 500; }
.column-weibo .column-header { border-color: rgb(255, 130, 0); background: linear-gradient(to right, rgb(255, 248, 240), rgb(255, 255, 255)); }
.column-weibo .column-title::before { content: "🐦"; }
.column-zhihu .column-header { border-color: rgb(0, 132, 255); background: linear-gradient(to right, rgb(240, 248, 255), rgb(255, 255, 255)); }
.column-zhihu .column-title::before { content: "💡"; }
.column-36kr .column-header { border-color: rgb(0, 185, 107); background: linear-gradient(to right, rgb(240, 255, 248), rgb(255, 255, 255)); }
.column-36kr .column-title::before { content: "🚀"; }
.column-huxiu .column-header { border-color: rgb(255, 107, 107); background: linear-gradient(to right, rgb(255, 240, 240), rgb(255, 255, 255)); }
.column-huxiu .column-title::before { content: "🐅"; }
.news-list { padding: 0px; }
.news-item { padding: 15px 20px; border-bottom: 1px solid rgb(240, 240, 240); position: relative; }
.news-item:last-child { border-bottom-width: medium; border-bottom-style: none; border-bottom-color: currentcolor; }
.news-item:hover { background: rgb(249, 249, 249); transform: translateX(5px); }
.news-title { color: rgb(51, 51, 51); text-decoration: none; font-size: 15px; line-height: 1.5; font-weight: 500; display: block; }
.news-title:hover { color: rgb(26, 35, 126); text-decoration: underline; }
.news-time { font-size: 12px; color: rgb(153, 153, 153); margin-top: 5px; font-family: "Courier New", monospace; }
.news-hot { position: absolute; right: 20px; top: 15px; font-size: 12px; color: rgb(255, 107, 107); font-weight: 700; }
.news-hot::before { content: "🔥"; margin-right: 3px; }
.newspaper-search { padding: 18px 20px 16px; border-bottom: 1px solid rgba(87, 112, 154, 0.18); background: radial-gradient(circle at right top, rgba(110, 191, 255, 0.16), transparent 34%), linear-gradient(135deg, rgba(8, 15, 30, 0.98), rgba(13, 25, 49, 0.96) 58%, rgba(22, 43, 79, 0.96)); color: rgb(238, 246, 255); position: relative; overflow: hidden; }
.newspaper-search::before { content: ""; position: absolute; inset: 0px; pointer-events: none; background-image: linear-gradient(rgba(126, 207, 186, 0.08) 1px, transparent 1px), linear-gradient(90deg, rgba(79, 167, 222, 0.08) 1px, transparent 1px); background-size: 100% 22px, 22px 100%; opacity: 0.45; mix-blend-mode: screen; }
.agent-console-head, .agent-statusline, .agent-suggestion-row, .agent-search-container { position: relative; z-index: 1; }
.agent-console-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.agent-console-title { color: rgb(247, 251, 255); font-size: 31px; line-height: 1.15; font-weight: 700; letter-spacing: 0.01em; margin-bottom: 6px; max-width: 11em; text-wrap: balance; font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", "Songti SC", serif; }
.agent-console-subtitle { color: rgba(223, 236, 255, 0.78); font-size: 13px; line-height: 1.75; max-width: 640px; }
.agent-model-pill { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; border: 1px solid rgba(126, 207, 186, 0.26); background: rgba(255, 255, 255, 0.08); color: rgb(215, 255, 244); font-size: 11px; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; box-shadow: rgba(255, 255, 255, 0.04) 0px 0px 0px 1px inset; white-space: nowrap; }
.agent-model-pill::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: rgb(126, 207, 186); box-shadow: rgba(126, 207, 186, 0.72) 0px 0px 12px; }
.search-container.agent-search-container { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 12px; align-items: stretch; max-width: none; margin: 0px; }
.search-input.agent-input { min-height: 110px; resize: vertical; padding: 17px 18px; border: 1px solid rgba(110, 191, 255, 0.22); border-radius: 20px; background: rgba(4, 10, 21, 0.72); color: rgb(247, 251, 255); font-size: 15px; line-height: 1.75; font-family: "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif; box-shadow: rgba(255, 255, 255, 0.02) 0px 0px 0px 1px inset, rgba(0, 0, 0, 0.16) 0px 14px 30px; }
.search-input.agent-input::placeholder { color: rgba(216, 228, 255, 0.48); }
.search-input.agent-input:focus { border-color: rgba(126, 207, 186, 0.72); box-shadow: rgba(126, 207, 186, 0.12) 0px 0px 0px 4px, rgba(0, 0, 0, 0.18) 0px 14px 30px; }
.agent-actions { display: flex; flex-direction: column; gap: 10px; width: 168px; }
.search-button.agent-run-button, .refresh-button.agent-brief-button { width: 100%; min-height: 48px; border-radius: 16px; padding: 12px 18px; font-weight: 900; letter-spacing: 0.02em; text-transform: none; font-size: 13px; }
.search-button.agent-run-button { border: 1px solid rgba(110, 191, 255, 0.3); background: linear-gradient(135deg, rgb(79, 167, 222), rgb(53, 109, 240)); box-shadow: rgba(53, 109, 240, 0.22) 0px 12px 24px; }
.search-button.agent-run-button:hover { background: linear-gradient(135deg, rgb(93, 183, 239), rgb(70, 120, 245)); box-shadow: rgba(53, 109, 240, 0.26) 0px 16px 28px; }
.refresh-button.agent-brief-button { border: 1px solid rgba(126, 207, 186, 0.22); background: rgba(255, 255, 255, 0.08); color: rgb(219, 255, 243); box-shadow: rgba(255, 255, 255, 0.02) 0px 0px 0px 1px inset; }
.refresh-button.agent-brief-button:hover { background: rgba(126, 207, 186, 0.14); box-shadow: rgba(126, 207, 186, 0.16) 0px 10px 22px; }
.agent-suggestion-row { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.agent-suggestion-chip { display: inline-flex; align-items: center; gap: 7px; border: 1px solid rgba(255, 255, 255, 0.1); background: rgba(255, 255, 255, 0.06); color: rgb(238, 246, 255); border-radius: 999px; padding: 8px 13px; font-size: 12px; font-weight: 700; cursor: pointer; }
.agent-suggestion-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: rgb(126, 207, 186); box-shadow: rgba(126, 207, 186, 0.5) 0px 0px 10px; }
.agent-suggestion-chip:hover { transform: translateY(-1px); background: rgba(79, 167, 222, 0.12); border-color: rgba(110, 191, 255, 0.3); }
.agent-statusline { display: flex; align-items: center; gap: 10px; margin-top: 14px; padding: 10px 12px; border-radius: 14px; border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(255, 255, 255, 0.04); color: rgba(238, 246, 255, 0.84); font-size: 12px; font-weight: 600; letter-spacing: 0px; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.agent-status-dot { width: 8px; height: 8px; border-radius: 50%; background: rgb(126, 207, 186); box-shadow: rgba(126, 207, 186, 0.68) 0px 0px 12px; }
.agent-briefing { margin: 18px 20px 12px; padding: 20px 22px; border-radius: 22px; border: 1px solid rgba(87, 112, 154, 0.16); background: linear-gradient(rgba(255, 255, 255, 0.98), rgba(245, 248, 255, 0.96)), rgb(255, 255, 255); box-shadow: rgba(54, 41, 22, 0.08) 0px 16px 34px; }
.agent-brief-shell { display: grid; gap: 14px; }
.agent-brief-head { display: grid; gap: 8px; }
.agent-brief-title { color: rgb(23, 32, 48); font-size: 25px; line-height: 1.34; font-weight: 700; text-wrap: balance; font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", "Songti SC", serif; }
.agent-brief-meta { color: rgb(107, 114, 128); font-size: 11px; line-height: 1.6; text-align: left; white-space: normal; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.agent-summary { padding: 18px 20px; border-radius: 18px; border: 1px solid rgba(79, 167, 222, 0.16); background: linear-gradient(135deg, rgba(79, 167, 222, 0.08), rgba(126, 207, 186, 0.06)); color: rgb(31, 41, 55); font-size: 15px; line-height: 1.9; font-weight: 600; }
.agent-signal-wrap, .agent-source-wrap, .agent-follow-wrap { display: grid; gap: 10px; }
.agent-section-label { font-size: 12px; font-weight: 800; letter-spacing: 0.04em; color: rgb(71, 85, 105); }
.agent-signal-list { display: grid; gap: 10px; margin: 0px; padding: 0px; list-style: none; }
.agent-signal-item { display: flex; align-items: flex-start; gap: 10px; padding: 13px 15px; border-radius: 16px; border: 1px solid rgba(87, 112, 154, 0.12); background: rgba(255, 255, 255, 0.8); color: rgb(31, 41, 55); font-size: 14px; line-height: 1.72; font-weight: 600; }
.agent-signal-index { flex: 0 0 auto; width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: linear-gradient(135deg, rgb(15, 23, 42), rgb(35, 65, 109)); color: rgb(255, 255, 255); font-size: 11px; font-weight: 900; }
.agent-source-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; }
.agent-source-card { display: grid; gap: 9px; padding: 15px; border-radius: 18px; border: 1px solid rgba(87, 112, 154, 0.14); background: rgb(255, 255, 255); box-shadow: rgba(54, 41, 22, 0.05) 0px 10px 24px; text-decoration: none; }
.agent-source-card:hover { transform: translateY(-2px); border-color: rgba(79, 167, 222, 0.28); box-shadow: rgba(54, 41, 22, 0.08) 0px 14px 30px; }
.agent-source-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.agent-source-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(79, 167, 222, 0.08); color: rgb(49, 91, 137); font-size: 10px; font-weight: 900; letter-spacing: 0.08em; text-transform: uppercase; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
.agent-source-time { color: rgb(107, 114, 128); font-size: 11px; white-space: nowrap; }
.agent-source-title { color: rgb(20, 32, 47); font-size: 15px; line-height: 1.62; font-weight: 800; }
.agent-source-note { color: rgb(75, 85, 99); font-size: 12.5px; line-height: 1.65; }
.agent-source-cta { color: rgb(53, 109, 240); font-size: 11px; font-weight: 900; letter-spacing: 0.04em; text-transform: none; }
.agent-follow-list { display: flex; flex-wrap: wrap; gap: 10px; }
.agent-follow-chip { display: inline-flex; align-items: center; gap: 8px; border: 1px solid rgba(79, 167, 222, 0.16); background: rgba(79, 167, 222, 0.06); color: rgb(39, 71, 110); border-radius: 999px; padding: 9px 12px; font-size: 12.5px; font-weight: 700; cursor: pointer; }
.agent-follow-chip:hover { transform: translateY(-1px); background: rgba(79, 167, 222, 0.11); border-color: rgba(79, 167, 222, 0.28); }
.agent-follow-chip::after { content: "→"; color: rgb(53, 109, 240); font-weight: 900; }
.agent-idle, .agent-error, .agent-loading { display: grid; gap: 12px; padding: 18px; border-radius: 18px; border: 1px dashed rgba(79, 167, 222, 0.2); background: rgba(248, 251, 255, 0.82); color: rgb(36, 50, 75); }
.agent-idle-title, .agent-error-title, .agent-loading-title { font-size: 19px; font-weight: 700; letter-spacing: 0.01em; font-family: "Iowan Old Style", "Palatino Linotype", "Book Antiqua", "Songti SC", serif; }
.agent-idle-desc, .agent-error-desc, .agent-loading-desc { color: rgb(85, 101, 121); font-size: 13px; line-height: 1.7; }
.agent-loading-log { display: grid; gap: 8px; }
.agent-loading-step { display: flex; align-items: center; gap: 10px; font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; font-size: 12px; color: rgb(29, 53, 87); opacity: 0.56; }
.agent-loading-step::before { content: ">"; color: rgb(53, 109, 240); font-weight: 900; }
.agent-loading-step.active { opacity: 1; color: rgb(20, 36, 58); }
.signal-radar-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0px 20px 12px; color: rgb(107, 95, 77); font-size: 12px; font-weight: 800; letter-spacing: 0.04em; }
.newspaper-footer { padding: 15px 25px; background: rgb(245, 245, 245); border-top: 1px solid rgb(224, 224, 224); font-size: 12px; color: rgb(102, 102, 102); display: flex; justify-content: space-between; align-items: center; }
.update-info { display: flex; align-items: center; gap: 15px; }
.update-time { font-weight: 600; color: rgb(51, 51, 51); }
.refresh-button { background: rgb(76, 175, 80); color: white; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; padding: 6px 15px; border-radius: 15px; font-size: 11px; cursor: pointer; }
.refresh-button:hover { background: rgb(67, 160, 71); transform: translateY(-1px); }
@media (max-width: 768px) {
  .newspaper-content { grid-template-columns: 1fr; gap: 15px; padding: 15px; }
  .newspaper-header { padding: 15px 20px; }
  .newspaper-title { font-size: 22px; }
  .search-container { flex-direction: column; }
  .search-button { width: 100%; }
}
.empty-column { padding: 40px 20px; text-align: center; color: rgb(153, 153, 153); }
.empty-icon { font-size: 48px; margin-bottom: 15px; opacity: 0.5; }
.empty-text { font-size: 14px; }
.newspaper-content::-webkit-scrollbar { width: 8px; }
.newspaper-content::-webkit-scrollbar-track { background: rgb(241, 241, 241); }
.newspaper-content::-webkit-scrollbar-thumb { background: rgb(193, 193, 193); border-radius: 4px; }
.newspaper-content::-webkit-scrollbar-thumb:hover { background: rgb(168, 168, 168); }
.frontier-news-panel { min-height: 0px; display: flex; flex-direction: column; overflow: hidden; background: rgba(255, 255, 255, 0.95); border-radius: 20px; box-shadow: rgba(15, 23, 42, 0.08) 0px 16px 40px -12px, rgba(15, 23, 42, 0.02) 0px 0px 0px 1px; }
.frontier-news-panel .panel-head { color: rgb(255, 255, 255); background: linear-gradient(135deg, rgb(30, 41, 59) 0%, rgb(51, 65, 85) 100%); padding: 16px 24px; font-size: 16px; font-weight: 700; letter-spacing: 0.1em; border-bottom: 2px solid rgba(255, 255, 255, 0.1); display: flex; justify-content: space-between; align-items: center; }
.frontier-news-panel .panel-head span:last-child { display: none; }
.frontier-news-panel .panel-body { display: grid; grid-template-rows: minmax(0px, 1fr) auto; gap: 20px; min-height: 0px; padding: 24px; }
.news-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(360px, 1fr)); gap: 24px; min-height: 0px; overflow-y: auto; padding-right: 8px; scrollbar-width: thin; scrollbar-color: rgba(148, 163, 184, 0.4) transparent; align-items: start; }
.news-list::-webkit-scrollbar { width: 6px; }
.news-list::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(148, 163, 184, 0.4); }
.news-list::-webkit-scrollbar-track { background: transparent; }
.news-group-card { --news-accent: #3b82f6; --news-accent-rgb: 59, 130, 246; display: flex; flex-direction: column; gap: 16px; padding: 20px; background: rgb(255, 255, 255); border-radius: 24px; border: 1px solid rgba(226, 232, 240, 0.8); box-shadow: rgba(15, 23, 42, 0.05) 0px 4px 20px -6px; position: relative; overflow: hidden; }
.news-group-card::before { content: ""; position: absolute; top: 0px; left: 0px; right: 0px; height: 4px; background: var(--news-accent); opacity: 0.8; }
.news-group-card:hover { transform: translateY(-4px); box-shadow: rgba(15, 23, 42, 0.12) 0px 12px 30px -8px; border-color: rgba(var(--news-accent-rgb), 0.3); }
.news-group-card.ai { --news-accent: #10b981; --news-accent-rgb: 16, 185, 129; }
.news-group-card.tech { --news-accent: #3b82f6; --news-accent-rgb: 59, 130, 246; }
.news-group-card.innovation { --news-accent: #8b5cf6; --news-accent-rgb: 139, 92, 246; }
.news-group-card.general { --news-accent: #64748b; --news-accent-rgb: 100, 116, 139; }
.news-group-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.news-group-name { color: rgb(15, 23, 42); font-size: 17px; font-weight: 800; letter-spacing: 0.02em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.news-group-count { flex-shrink: 0; padding: 4px 12px; border-radius: 999px; color: var(--news-accent); background: rgba(var(--news-accent-rgb), 0.1); font-size: 12px; font-weight: 700; }
.news-group-list { display: flex; flex-direction: column; gap: 12px; }
.news-group-link { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 16px; align-items: center; padding: 14px 16px; border-radius: 16px; background: rgba(248, 250, 252, 0.7); border: 1px solid transparent; text-decoration: none; position: relative; }
.news-group-link::before { content: ""; position: absolute; left: 16px; top: 18px; width: 6px; height: 6px; border-radius: 50%; background: var(--news-accent); opacity: 0; transform: scale(0); }
.news-group-link:hover { background: rgb(255, 255, 255); border-color: rgba(var(--news-accent-rgb), 0.2); box-shadow: rgba(15, 23, 42, 0.08) 0px 4px 12px -4px; padding-left: 32px; }
.news-group-link:hover::before { opacity: 1; transform: scale(1); }
.news-group-title { color: rgb(51, 65, 85); font-size: 14px; line-height: 1.6; font-weight: 600; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.news-group-link:hover .news-group-title { color: rgb(15, 23, 42); }
.news-group-meta { color: rgb(148, 163, 184); font-size: 11px; font-weight: 600; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; white-space: nowrap; }
.news-empty { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 60px 24px; background: rgba(255, 255, 255, 0.6); border-radius: 24px; border: 2px dashed rgba(203, 213, 225, 0.8); text-align: center; }
.empty-icon { font-size: 48px; margin-bottom: 24px; filter: grayscale(0.5); }
.empty-title { font-size: 18px; font-weight: 700; color: rgb(71, 85, 105); margin-bottom: 8px; }
.empty-desc { font-size: 14px; color: rgb(148, 163, 184); max-width: 400px; line-height: 1.6; }
.frontier-news-panel { min-height: 720px; border: 1px solid rgba(89, 72, 51, 0.18); background: radial-gradient(circle at left top, rgba(255, 255, 255, 0.96), transparent 32%), radial-gradient(circle at right bottom, rgba(244, 226, 191, 0.2), transparent 28%), linear-gradient(rgb(252, 248, 239) 0%, rgb(247, 241, 229) 100%); box-shadow: rgba(54, 41, 22, 0.12) 0px 20px 56px; overflow: hidden; }
.newspaper-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; padding: 18px 22px 14px; background: linear-gradient(rgba(255, 250, 239, 0.98), rgba(248, 239, 222, 0.96)); border-bottom: 3px double rgba(85, 68, 46, 0.62); position: relative; }
.newspaper-header::after { content: "EDITORIAL DIGEST"; flex: 0 0 auto; margin-bottom: 2px; padding: 6px 10px; border: 1px solid rgba(85, 68, 46, 0.16); border-radius: 999px; background: rgba(255, 255, 255, 0.72); color: rgb(123, 102, 79); font-family: "Courier New", monospace; font-size: 10px; font-weight: 900; letter-spacing: 0.24em; white-space: nowrap; }
.newspaper-title { margin: 0px 0px 4px; color: rgb(20, 20, 20); font-family: Georgia, "Songti SC", SimSun, serif; font-size: clamp(20px, 2.5vw, 30px); line-height: 1; letter-spacing: 0.18em; text-shadow: none; }
.newspaper-subtitle { color: rgb(120, 103, 83); font-size: 10px; font-weight: 700; letter-spacing: 0.14em; line-height: 1.35; text-transform: uppercase; }
.newspaper-search { padding: 10px 14px 12px; background: linear-gradient(rgba(247, 238, 221, 0.98), rgba(244, 233, 211, 0.94)); border-bottom: 1px solid rgba(85, 68, 46, 0.14); }
.search-container { display: flex; gap: 10px; align-items: center; max-width: 860px; margin: 0px auto; }
.search-input { flex: 1 1 0%; min-width: 0px; height: 40px; border-radius: 999px; border: 1px solid rgba(85, 68, 46, 0.18); background: rgba(255, 254, 248, 0.98); box-shadow: rgba(255, 255, 255, 0.95) 0px 1px 0px inset, rgba(54, 41, 22, 0.05) 0px 6px 16px; padding: 0px 16px; color: rgb(31, 41, 55); font-size: 13px; }
.search-input::placeholder { color: rgb(154, 136, 113); }
.search-button, .refresh-button { flex: 0 0 auto; height: 40px; border-radius: 999px; border: 1px solid rgba(85, 68, 46, 0.18); padding: 0px 16px; background: linear-gradient(rgb(254, 248, 234), rgb(234, 219, 189)); color: rgb(68, 52, 33); font-size: 12px; font-weight: 900; letter-spacing: 0.08em; box-shadow: rgba(54, 41, 22, 0.08) 0px 8px 20px; }
.search-button:hover, .refresh-button:hover { transform: translateY(-1px); box-shadow: rgba(54, 41, 22, 0.12) 0px 10px 24px; }
.newspaper-content { flex: 1 1 0%; padding: 14px; display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 12px; align-items: start; overflow-y: auto; background: linear-gradient(rgba(120, 101, 72, 0.06) 1px, transparent 1px) 0% 0% / 100% 28px, linear-gradient(90deg, rgba(120, 101, 72, 0.05) 1px, transparent 1px) 0% 0% / 28px 100%, linear-gradient(rgba(255, 255, 255, 0.28), transparent 40%) 0% 0% / 100% 100%,  0% 0% / 100% 100% rgb(251, 247, 237); }
.news-group-card { --news-accent: #475569; --news-accent-rgb: 71, 85, 105; position: relative; min-width: 0px; border-radius: 18px; border: 1px solid rgba(89, 72, 51, 0.18); background: rgba(255, 253, 247, 0.96); box-shadow: rgba(54, 41, 22, 0.07) 0px 10px 24px; overflow: hidden; }
.news-group-card::before { content: ""; position: absolute; inset: 0px 0px auto; height: 4px; background: linear-gradient(90deg, var(--news-accent), rgba(var(--news-accent-rgb), .25)); }
.news-group-card:hover { transform: translateY(-1px); box-shadow: rgba(54, 41, 22, 0.11) 0px 14px 30px; border-color: rgba(var(--news-accent-rgb), .34); }
.news-group-card.weibo { --news-accent: #dc2626; --news-accent-rgb: 220, 38, 38; }
.news-group-card.kr36 { --news-accent: #2563eb; --news-accent-rgb: 37, 99, 235; }
.news-group-card.ithome { --news-accent: #059669; --news-accent-rgb: 5, 150, 105; }
.news-group-card.hn { --news-accent: #ea580c; --news-accent-rgb: 234, 88, 12; }
.news-group-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 14px 10px; border-bottom: 1px solid rgba(var(--news-accent-rgb), .16); background: linear-gradient(180deg, rgba(var(--news-accent-rgb), .08), rgba(255, 255, 255, 0)); }
.news-group-name { min-width: 0px; color: rgb(20, 32, 47); font-family: Georgia, "Songti SC", SimSun, serif; font-size: 13px; font-weight: 900; letter-spacing: 0.1em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.news-group-count { flex: 0 0 auto; padding: 4px 10px; border-radius: 999px; border: 1px solid rgba(var(--news-accent-rgb), .24); background: rgba(255, 255, 255, 0.84); color: var(--news-accent); font-size: 10px; font-weight: 900; box-shadow: rgba(54, 41, 22, 0.05) 0px 4px 10px; white-space: nowrap; }
.news-group-list { padding: 4px 0px 6px; }
.news-group-link { display: grid; grid-template-columns: 34px minmax(0px, 1fr); gap: 8px; align-items: start; padding: 9px 14px; border-width: 0px 0px 1px; border-style: none none solid; border-color: currentcolor currentcolor rgba(89, 72, 51, 0.1); border-image: initial; border-radius: 0px; background: transparent; text-decoration: none; }
.news-group-link:last-child { border-bottom: 0px; }
.news-group-link::before { display: none; }
.news-group-link:hover { padding-left: 18px; background: rgba(var(--news-accent-rgb), .08); box-shadow: inset 3px 0 0 rgba(var(--news-accent-rgb), .9); }
.news-rank { width: 22px; height: 22px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: linear-gradient(135deg, var(--news-accent), rgba(var(--news-accent-rgb), .82)); color: rgb(255, 255, 255); font-family: "Courier New", monospace; font-size: 10px; font-weight: 900; box-shadow: 0 5px 12px rgba(var(--news-accent-rgb), .24); }
.news-group-title { color: rgb(31, 41, 55); font-size: 12.5px; line-height: 1.45; font-weight: 700; display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.news-group-empty { margin: 10px 12px 12px; padding: 14px 12px; border-radius: 14px; border: 1px dashed rgba(89, 72, 51, 0.2); background: rgba(255, 255, 255, 0.72); color: rgb(154, 136, 113); font-size: 12px; font-weight: 700; text-align: center; letter-spacing: 0.08em; }
.news-group-link:hover .news-group-title { color: rgb(17, 24, 39); }
.newspaper-footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 14px; background: linear-gradient(rgb(244, 234, 216), rgb(236, 223, 198)); border-top: 1px solid rgba(89, 72, 51, 0.16); color: rgb(107, 95, 77); font-size: 11px; }
.update-info { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; min-width: 0px; }
.update-time, .news-count { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px; border: 1px solid rgba(89, 72, 51, 0.16); background: rgba(255, 255, 255, 0.7); color: rgb(93, 80, 62); font-weight: 800; white-space: nowrap; }
.news-count { letter-spacing: 0.04em; }
@media (max-width: 1180px) {
  .newspaper-content { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 760px) {
  .frontier-news-panel { min-height: auto; }
  .newspaper-header { align-items: flex-start; flex-direction: column; }
  .newspaper-header::after { align-self: flex-start; }
  .newspaper-search { padding: 14px 14px 12px; }
  .agent-console-head { flex-direction: column; }
  .agent-console-title { font-size: 26px; max-width: none; }
  .agent-brief-title { font-size: 22px; }
  .search-container.agent-search-container { grid-template-columns: 1fr; }
  .agent-actions { width: 100%; }
  .search-button.agent-run-button, .refresh-button.agent-brief-button, .refresh-button { width: 100%; }
  .agent-source-grid { grid-template-columns: 1fr; }
  .newspaper-content { grid-template-columns: 1fr; padding: 10px; }
  .news-group-link { padding: 10px 12px; }
  .news-group-link:hover { padding-left: 16px; }
  .newspaper-footer { flex-direction: column; align-items: flex-start; }
}
.frontier-news-stage { grid-template-columns: minmax(0px, 1fr); }
.frontier-news-panel { min-height: 0px; display: flex; flex-direction: column; overflow: hidden; font-family: inherit; border: 2px solid var(--line); border-radius: 24px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(245, 249, 255, 0.9)); box-shadow: rgba(255, 255, 255, 0.58) 0px 0px 0px 4px inset, rgba(155, 173, 198, 0.12) 8px 8px 0px, rgba(141, 162, 189, 0.2) 0px 22px 48px; }
.newspaper-header { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 18px; border-bottom: 2px solid var(--line); background: linear-gradient(90deg, rgba(126, 207, 186, 0.14), transparent 42%), linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(247, 251, 255, 0.9)); }
.newspaper-header::after { display: none; }
.newspaper-title { margin: 0px; color: var(--text); font-family: inherit; font-size: clamp(20px, 2.1vw, 28px); line-height: 1.08; font-weight: 900; letter-spacing: 0.06em; text-shadow: rgba(255, 179, 142, 0.18) 2px 2px 0px, rgba(126, 207, 186, 0.16) -1px 1px 0px; }
.newspaper-subtitle { color: rgb(68, 88, 118); font-size: 12px; line-height: 1.4; font-weight: 800; letter-spacing: 0.04em; text-transform: none; }
.newspaper-search { padding: 12px 16px 14px; color: var(--text); border-bottom: 2px solid var(--line2); background: linear-gradient(90deg, rgba(255, 179, 142, 0.12), transparent 38%), rgba(255, 255, 255, 0.48); }
.newspaper-search::before { display: none; }
.agent-console-head { align-items: center; margin-bottom: 10px; }
.agent-console-title { max-width: none; margin: 0px; color: var(--text); font-family: inherit; font-size: 17px; line-height: 1.25; font-weight: 900; letter-spacing: 0.03em; }
.agent-console-subtitle, .signal-radar-head, .agent-source-note { display: none; }
.agent-model-pill { border: 2px solid rgba(79, 167, 222, 0.24); background: rgba(255, 255, 255, 0.82); color: rgb(49, 91, 137); box-shadow: rgba(155, 173, 198, 0.1) 4px 4px 0px; }
.agent-model-pill::before { background: var(--accent2); box-shadow: rgba(126, 207, 186, 0.72) 0px 0px 10px; }
.search-container.agent-search-container { grid-template-columns: minmax(0px, 1fr) auto; gap: 10px; align-items: stretch; max-width: none; margin: 0px; }
.search-input.agent-input { min-height: 66px; resize: vertical; padding: 13px 15px; border: 2px solid rgba(87, 112, 154, 0.22); border-radius: 18px; background: rgba(255, 254, 248, 0.96); color: var(--text); box-shadow: rgba(255, 255, 255, 0.9) 0px 1px 0px inset, rgba(141, 162, 189, 0.12) 0px 8px 18px; font-family: inherit; font-size: 14px; line-height: 1.55; }
.search-input.agent-input::placeholder { color: rgb(97, 112, 137); }
.search-input.agent-input:focus { outline: none; border-color: rgba(79, 167, 222, 0.62); box-shadow: rgba(79, 167, 222, 0.12) 0px 0px 0px 4px, rgba(141, 162, 189, 0.16) 0px 10px 22px; }
.agent-actions { width: 144px; gap: 8px; }
.search-button.agent-run-button, .refresh-button.agent-brief-button { min-height: 0px; height: 34px; padding: 0px 14px; border-radius: 999px; font-size: 12px; font-weight: 900; letter-spacing: 0.03em; }
.search-button.agent-run-button { border: 2px solid rgba(79, 167, 222, 0.28); background: linear-gradient(rgb(111, 187, 233), rgb(79, 167, 222)); color: rgb(255, 255, 255); box-shadow: rgba(79, 167, 222, 0.14) 4px 4px 0px; }
.search-button.agent-run-button:hover { background: linear-gradient(rgb(126, 200, 242), rgb(79, 167, 222)); box-shadow: rgba(79, 167, 222, 0.18) 5px 5px 0px; }
.refresh-button.agent-brief-button, .newspaper-footer .refresh-button { border: 2px solid rgba(126, 207, 186, 0.28); background: linear-gradient(rgb(244, 255, 251), rgb(223, 247, 240)); color: rgb(35, 99, 82); box-shadow: rgba(126, 207, 186, 0.14) 4px 4px 0px; }
.refresh-button.agent-brief-button:hover, .newspaper-footer .refresh-button:hover { background: linear-gradient(rgb(251, 255, 253), rgb(214, 243, 235)); box-shadow: rgba(126, 207, 186, 0.18) 5px 5px 0px; }
.agent-suggestion-row { gap: 8px; margin-top: 10px; }
.agent-suggestion-chip { border: 2px solid rgba(87, 112, 154, 0.16); background: rgba(255, 255, 255, 0.76); color: rgb(46, 64, 95); box-shadow: rgba(155, 173, 198, 0.08) 3px 3px 0px; font-size: 12px; font-weight: 800; }
.agent-suggestion-chip:hover { background: rgba(236, 246, 255, 0.95); border-color: rgba(79, 167, 222, 0.32); }
.agent-statusline { display: none; }
.frontier-news-stage[data-agent-state="loading"] .newspaper-search, .frontier-news-stage[data-agent-state="result"] .newspaper-search, .frontier-news-stage[data-agent-state="error"] .newspaper-search { padding: 10px 16px 12px; }
.frontier-news-stage[data-agent-state="loading"] .agent-suggestion-row, .frontier-news-stage[data-agent-state="result"] .agent-suggestion-row, .frontier-news-stage[data-agent-state="error"] .agent-suggestion-row { display: none; }
.frontier-news-stage[data-agent-state="loading"] .search-input.agent-input, .frontier-news-stage[data-agent-state="result"] .search-input.agent-input, .frontier-news-stage[data-agent-state="error"] .search-input.agent-input { height: 46px; min-height: 46px; max-height: 46px; overflow: hidden; resize: none; }
.agent-briefing { margin: 12px 16px 10px; padding: 0px; border: 2px solid rgba(87, 112, 154, 0.16); border-radius: 20px; background: rgba(255, 255, 255, 0.72); box-shadow: rgba(155, 173, 198, 0.08) 5px 5px 0px; overflow: hidden; max-height: min(46vh, 560px); display: flex; flex-direction: column; }
.agent-briefing[hidden] { display: none; }
.agent-drawer-shell { min-height: 0px; display: flex; flex: 1 1 0%; flex-direction: column; }
.agent-drawer-head { position: sticky; top: 0px; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border-bottom: 2px solid rgba(87, 112, 154, 0.13); background: linear-gradient(90deg, rgba(126, 207, 186, 0.11), transparent 58%), rgba(255, 255, 255, 0.94); }
.agent-drawer-title-wrap { min-width: 0px; display: grid; gap: 3px; }
.agent-drawer-kicker { color: rgb(82, 98, 125); font-size: 10px; line-height: 1.2; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; }
.agent-drawer-title { color: var(--text); font-size: 16px; line-height: 1.35; font-weight: 900; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.agent-drawer-actions { flex: 0 0 auto; display: flex; align-items: center; gap: 8px; }
.agent-drawer-button { height: 32px; border-radius: 999px; border: 2px solid rgba(87, 112, 154, 0.16); padding: 0px 12px; background: rgba(255, 255, 255, 0.82); color: rgb(46, 64, 95); font-size: 12px; font-weight: 900; cursor: pointer; box-shadow: rgba(155, 173, 198, 0.08) 3px 3px 0px; white-space: nowrap; }
.agent-drawer-button:hover { transform: translateY(-1px); background: rgba(236, 246, 255, 0.95); border-color: rgba(79, 167, 222, 0.32); }
.agent-drawer-button:disabled { cursor: not-allowed; opacity: 0.58; transform: none; }
.agent-drawer-button.primary { border-color: rgba(126, 207, 186, 0.28); background: linear-gradient(rgb(244, 255, 251), rgb(223, 247, 240)); color: rgb(35, 99, 82); }
.agent-drawer-body { min-height: 0px; overflow-y: auto; padding: 14px; display: grid; gap: 14px; scrollbar-width: thin; scrollbar-color: rgba(87, 112, 154, 0.22) transparent; }
.agent-drawer-body::-webkit-scrollbar { width: 6px; }
.agent-drawer-body::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(87, 112, 154, 0.22); }
.agent-brief-title, .agent-idle-title, .agent-error-title, .agent-loading-title { color: var(--text); font-family: inherit; }
.agent-brief-title { font-size: 20px; }
.agent-brief-meta, .agent-source-time { color: rgb(82, 98, 125); }
.agent-summary, .agent-signal-item { color: var(--text); border-color: rgba(87, 112, 154, 0.14); background: rgba(255, 255, 255, 0.78); }
.agent-source-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
.agent-source-card { border: 2px solid rgba(87, 112, 154, 0.14); border-radius: 18px; background: rgba(255, 255, 255, 0.82); box-shadow: rgba(155, 173, 198, 0.08) 4px 4px 0px; }
.agent-source-title { color: var(--text); font-size: 14px; }
.newspaper-content { flex: 1 1 0%; min-height: 0px; padding: 14px; display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 12px; align-items: start; overflow-y: auto; background: linear-gradient(rgba(70, 96, 136, 0.06) 1px, transparent 1px) 0% 0% / 28px 28px, linear-gradient(90deg, rgba(70, 96, 136, 0.05) 1px, transparent 1px) 0% 0% / 28px 28px,  0% 0% / 100% 100% rgba(255, 255, 255, 0.38); }
.news-group-card { --news-accent: var(--accent); --news-accent-rgb: 79, 167, 222; border: 2px solid rgba(87, 112, 154, 0.17); border-radius: 18px; background: rgba(255, 255, 255, 0.86); box-shadow: rgba(155, 173, 198, 0.1) 6px 6px 0px; }
.news-group-card:hover { transform: translateY(-1px); border-color: rgba(var(--news-accent-rgb), .36); box-shadow: rgba(155, 173, 198, 0.13) 7px 7px 0px; }
.news-group-head { padding: 11px 13px 9px; border-bottom: 2px solid rgba(var(--news-accent-rgb), .14); background: linear-gradient(90deg, rgba(var(--news-accent-rgb), .12), transparent 68%),
        rgba(255, 255, 255, .46); }
.news-group-name { color: var(--text); font-family: inherit; font-size: 13px; font-weight: 900; letter-spacing: 0.05em; }
.news-group-count { border: 2px solid rgba(var(--news-accent-rgb), .22); background: rgba(255, 255, 255, 0.86); color: rgb(49, 91, 137); font-size: 10px; }
.news-group-list { padding: 4px 0px 6px; }
.news-group-link { grid-template-columns: 30px minmax(0px, 1fr); gap: 8px; padding: 9px 12px; border-bottom: 1px solid rgba(87, 112, 154, 0.12); color: var(--text); }
.news-group-link:hover { padding-left: 14px; background: rgba(var(--news-accent-rgb), .1); box-shadow: inset 4px 0 0 rgba(var(--news-accent-rgb), .72); }
.news-rank { width: 23px; height: 23px; color: rgb(255, 255, 255); font-family: "Courier New", monospace; font-size: 10px; box-shadow: 0 4px 10px rgba(var(--news-accent-rgb), .2); }
.news-group-title { display: -webkit-box; overflow: hidden; color: var(--text); font-size: 13px; line-height: 1.45; font-weight: 800; white-space: normal; text-overflow: initial; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.news-group-link:hover .news-group-title { color: rgb(20, 32, 47); }
.news-empty, .empty-column { border: 2px dashed rgba(87, 112, 154, 0.2); border-radius: 20px; background: rgba(255, 255, 255, 0.7); color: rgb(68, 88, 118); }
.empty-title { color: var(--text); }
.empty-desc, .empty-text { color: rgb(68, 88, 118); }
.newspaper-footer { padding: 10px 14px; border-top: 2px solid var(--line2); background: linear-gradient(rgba(255, 255, 255, 0.66), rgba(245, 249, 255, 0.72)); color: var(--text); }
.update-time, .news-count { border: 2px solid rgba(87, 112, 154, 0.16); background: rgba(255, 255, 255, 0.78); color: rgb(46, 64, 95); }
@media (max-width: 1180px) {
  .newspaper-content { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .agent-source-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 760px) {
  .frontier-news-panel { border-radius: 20px; }
  .newspaper-header { align-items: flex-start; flex-direction: column; }
  .newspaper-search { padding: 12px; }
  .search-container.agent-search-container, .agent-source-grid, .newspaper-content { grid-template-columns: 1fr; }
  .agent-actions { width: 100%; }
  .agent-briefing { margin: 10px 12px; max-height: 34vh; }
  .agent-drawer-head { align-items: flex-start; padding: 11px 12px; }
  .agent-drawer-title { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  .agent-drawer-actions { flex-direction: column; align-items: stretch; gap: 6px; }
  .agent-drawer-button { height: 30px; padding: 0px 10px; font-size: 11px; }
  .agent-drawer-body { padding: 12px; }
  .agent-suggestion-row { display: none; }
  .news-group-link:hover { padding-left: 12px; }
}
body[data-active-view="frontier-news"] .topbar, body[data-active-view="new-api"] .topbar { grid-template-columns: minmax(0px, 1fr); }
body[data-active-view="frontier-news"] .stats, body[data-active-view="frontier-news"] .title-copy h1, body[data-active-view="new-api"] .stats, body[data-active-view="new-api"] .title-copy h1 { display: none; }
body[data-active-view="frontier-news"] .title-copy, body[data-active-view="new-api"] .title-copy { min-height: 0px; justify-content: center; padding: 10px 14px; }
body[data-active-view="frontier-news"] .view-switch, body[data-active-view="new-api"] .view-switch { width: 100%; max-width: 720px; }
body[data-active-view="frontier-news"] .view-tab, body[data-active-view="new-api"] .view-tab { flex: 1 1 0%; }
.frontier-news-panel { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(360px, 420px); grid-template-rows: auto minmax(0px, 1fr) auto; gap: 0px; height: 100%; min-height: 0px; background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(244, 250, 255, 0.9)), rgb(247, 251, 255); border-color: rgba(54, 83, 122, 0.28); box-shadow: rgba(255, 255, 255, 0.55) 0px 0px 0px 4px inset, rgba(71, 101, 142, 0.2) 0px 24px 58px; }
.frontier-news-panel::before { content: ""; position: absolute; inset: 0px; pointer-events: none; background: linear-gradient(rgba(37, 99, 235, 0.043) 1px, transparent 1px) 0% 0% / 28px 28px, linear-gradient(90deg, rgba(20, 184, 166, 0.04) 1px, transparent 1px); mask-image: linear-gradient(rgba(0, 0, 0, 0.7), transparent 86%); }
.newspaper-header { grid-area: 1 / 1 / auto / -1; z-index: 1; padding: 16px 18px; border-bottom: 1px solid rgba(54, 83, 122, 0.22); background: linear-gradient(90deg, rgba(79, 167, 222, 0.14), transparent 44%), linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(238, 247, 255, 0.86)); }
.newspaper-title { color: rgb(23, 36, 58); font-size: clamp(24px, 2.6vw, 34px); letter-spacing: 0.04em; }
.newspaper-subtitle { color: rgb(61, 82, 111); font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; font-size: 12px; font-weight: 900; }
.news-intel-panel { grid-area: 2 / 2; z-index: 1; min-width: 0px; min-height: 0px; display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 12px; padding: 14px 14px 14px 0px; border-left: 1px solid rgba(54, 83, 122, 0.16); overflow: hidden; }
.news-intel-panel .newspaper-search { position: relative; margin: 0px; padding: 16px; border: 1px solid rgba(54, 83, 122, 0.16); border-radius: 20px; background: linear-gradient(rgba(37, 99, 235, 0.035) 1px, transparent 1px) 0% 0% / 24px 24px, linear-gradient(90deg, rgba(20, 184, 166, 0.03) 1px, transparent 1px) 0% 0% / 24px 24px, linear-gradient(135deg, rgba(255, 255, 255, 0.97), rgba(239, 248, 255, 0.92)) 0% 0% / 100% 100%; color: rgb(23, 36, 58); box-shadow: rgba(255, 255, 255, 0.76) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.12) 0px 16px 34px; }
.news-intel-panel .agent-console-head { align-items: flex-start; margin-bottom: 12px; }
.news-intel-panel .agent-console-title { color: rgb(23, 36, 58); font-size: 20px; letter-spacing: 0.02em; }
.news-intel-panel .agent-console-subtitle { display: block; margin-top: 6px; color: rgb(79, 99, 128); font-size: 12px; line-height: 1.6; }
.news-intel-panel .agent-model-pill { border-color: rgba(79, 167, 222, 0.26); background: rgba(236, 246, 255, 0.9); color: rgb(46, 75, 115); box-shadow: rgba(255, 255, 255, 0.72) 0px 0px 0px 1px inset; }
.news-intel-panel .search-container.agent-search-container { display: grid; grid-template-columns: 1fr; gap: 12px; }
.news-intel-panel .search-input.agent-input, .frontier-news-stage[data-agent-state="loading"] .news-intel-panel .search-input.agent-input, .frontier-news-stage[data-agent-state="result"] .news-intel-panel .search-input.agent-input, .frontier-news-stage[data-agent-state="error"] .news-intel-panel .search-input.agent-input { width: 100%; height: auto; min-height: 132px; max-height: 230px; padding: 14px 15px; resize: vertical; overflow: auto; border: 1px solid rgba(54, 83, 122, 0.18); border-radius: 16px; background: rgba(248, 251, 255, 0.92); color: rgb(23, 36, 58); box-shadow: rgba(255, 255, 255, 0.78) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.06) 0px 8px 18px; }
.news-intel-panel .search-input.agent-input::placeholder { color: rgb(122, 138, 163); }
.news-intel-panel .agent-actions { width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.news-intel-panel .search-button.agent-run-button, .news-intel-panel .refresh-button.agent-brief-button { height: 42px; min-height: 42px; border-radius: 14px; box-shadow: rgba(71, 101, 142, 0.1) 0px 10px 18px; }
.news-intel-panel .search-button.agent-run-button { border: 1px solid rgba(79, 167, 222, 0.28); background: linear-gradient(rgb(90, 179, 233), rgb(62, 149, 210)); color: rgb(255, 255, 255); }
.news-intel-panel .refresh-button.agent-brief-button { border: 1px solid rgba(126, 207, 186, 0.32); background: linear-gradient(rgb(244, 255, 251), rgb(223, 247, 240)); color: rgb(35, 99, 82); }
.news-intel-panel .search-button.agent-run-button:disabled { cursor: not-allowed; opacity: 0.58; filter: saturate(0.62); }
.news-intel-panel .agent-interrupt-button { border-color: rgba(255, 179, 142, 0.36); background: linear-gradient(rgba(255, 242, 234, 0.98), rgba(255, 209, 188, 0.94)); color: rgb(138, 50, 31); }
.news-intel-panel .agent-suggestion-row, .frontier-news-stage[data-agent-state="loading"] .news-intel-panel .agent-suggestion-row, .frontier-news-stage[data-agent-state="result"] .news-intel-panel .agent-suggestion-row, .frontier-news-stage[data-agent-state="error"] .news-intel-panel .agent-suggestion-row { display: flex; margin-top: 12px; gap: 8px; }
.news-intel-panel .agent-suggestion-chip { border-color: rgba(54, 83, 122, 0.14); background: rgba(255, 255, 255, 0.82); color: rgb(46, 64, 95); box-shadow: rgba(71, 101, 142, 0.06) 0px 6px 12px; }
.news-intel-panel .agent-suggestion-chip:disabled { cursor: not-allowed; opacity: 0.42; }
.news-intel-panel .agent-statusline { display: flex; border-color: rgba(54, 83, 122, 0.14); background: rgba(255, 255, 255, 0.76); color: rgb(67, 87, 113); }
.news-intel-panel .agent-briefing { margin: 0px; min-height: 0px; max-height: none; border: 1px solid rgba(54, 83, 122, 0.18); border-radius: 20px; background: linear-gradient(rgba(37, 99, 235, 0.027) 1px, transparent 1px) 0% 0% / 24px 24px, linear-gradient(135deg, rgba(255, 255, 255, 0.95), rgba(243, 249, 255, 0.9)) 0% 0% / 100% 100%; box-shadow: rgba(255, 255, 255, 0.7) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.12) 0px 16px 34px; }
.news-intel-panel .agent-drawer-head { border-bottom: 1px solid rgba(54, 83, 122, 0.14); background: linear-gradient(90deg, rgba(126, 207, 186, 0.14), transparent 54%), rgba(255, 255, 255, 0.94); }
.news-intel-panel .agent-drawer-button.danger { border-color: rgba(255, 179, 142, 0.36); background: linear-gradient(rgb(255, 246, 239), rgb(255, 217, 201)); color: rgb(138, 50, 31); }
.news-intel-panel .agent-drawer-body { padding: 14px; }
.news-intel-panel .agent-result-bar { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 10px; }
.news-intel-panel .agent-result-stat { padding: 10px 12px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 14px; background: rgba(255, 255, 255, 0.76); color: rgb(52, 72, 97); font-size: 12px; font-weight: 800; }
.news-intel-panel .agent-summary { border-radius: 16px; background: linear-gradient(135deg, rgba(79, 167, 222, 0.1), rgba(126, 207, 186, 0.08)); color: rgb(23, 36, 58); font-size: 14px; line-height: 1.76; }
.news-intel-panel .agent-source-grid { grid-template-columns: 1fr; }
.news-intel-panel .agent-source-card, .news-intel-panel .agent-signal-item { border-radius: 16px; background: rgba(255, 255, 255, 0.82); }
.news-intel-panel .agent-empty-block { padding: 12px 14px; border: 1px dashed rgba(54, 83, 122, 0.2); border-radius: 16px; background: rgba(255, 255, 255, 0.68); color: rgb(79, 99, 128); font-size: 13px; line-height: 1.65; font-weight: 700; }
.frontier-news-panel .newspaper-content { grid-area: 2 / 1; z-index: 1; min-height: 0px; padding: 12px; display: grid; grid-template-columns: 1fr; gap: 10px; align-items: start; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: auto; scrollbar-gutter: stable; background: linear-gradient(rgba(54, 83, 122, 0.04) 1px, transparent 1px) 0% 0% / 28px 28px, rgba(255, 255, 255, 0.5); }
.news-feed-shell { min-width: 0px; min-height: 0px; display: grid; gap: 12px; }
.news-filter-bar { position: sticky; top: 0px; z-index: 2; display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 10px 12px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 18px; background: rgba(255, 255, 255, 0.84); box-shadow: rgba(71, 101, 142, 0.08) 0px 10px 24px; }
.news-filter-button { display: inline-grid; grid-template-rows: auto auto; gap: 2px; align-items: start; min-width: 102px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 14px; padding: 8px 12px; background: rgba(248, 251, 255, 0.9); color: rgb(36, 50, 75); text-align: left; cursor: pointer; }
.news-filter-button:hover { transform: translateY(-1px); border-color: rgba(79, 167, 222, 0.28); box-shadow: rgba(71, 101, 142, 0.08) 0px 8px 16px; }
.news-filter-button.active { border-color: rgba(79, 167, 222, 0.36); background: linear-gradient(rgba(236, 246, 255, 0.98), rgba(224, 241, 255, 0.92)); box-shadow: rgba(71, 101, 142, 0.1) 0px 10px 20px; }
.news-filter-name { font-size: 12px; line-height: 1.2; font-weight: 900; letter-spacing: 0.02em; }
.news-filter-count { color: rgb(81, 102, 128); font-size: 11px; line-height: 1.2; font-weight: 800; }
.news-feed-list { display: grid; gap: 10px; min-width: 0px; min-height: 0px; }
.news-feed-row { display: grid; grid-template-columns: auto minmax(0px, 1fr) auto; align-items: center; gap: 12px; min-width: 0px; padding: 12px 14px; border: 1px solid rgba(54, 83, 122, 0.12); border-radius: 16px; background: rgba(255, 255, 255, 0.86); text-decoration: none; color: inherit; box-shadow: rgba(71, 101, 142, 0.06) 0px 8px 18px; contain: content; content-visibility: auto; contain-intrinsic-size: 72px; }
.news-feed-row:hover { transform: translateY(-1px); border-color: rgba(79, 167, 222, 0.24); box-shadow: rgba(71, 101, 142, 0.1) 0px 12px 24px; background: rgba(248, 251, 255, 0.98); }
.news-feed-rank { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; background: linear-gradient(rgba(54, 83, 122, 0.92), rgba(32, 46, 72, 0.98)); color: rgb(255, 255, 255); font-family: SFMono-Regular, "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; font-size: 11px; font-weight: 900; }
.news-feed-body { min-width: 0px; display: grid; gap: 6px; }
.news-feed-topline { display: flex; align-items: center; gap: 8px; min-width: 0px; flex-wrap: wrap; }
.news-feed-source { flex: 0 0 auto; padding: 3px 8px; border-radius: 999px; border: 1px solid rgba(79, 167, 222, 0.22); background: rgba(236, 246, 255, 0.92); color: rgb(46, 75, 115); font-size: 10px; font-weight: 900; letter-spacing: 0.04em; text-transform: uppercase; }
.news-feed-time { color: rgb(82, 98, 125); font-size: 11px; font-weight: 700; white-space: nowrap; }
.news-feed-title { min-width: 0px; color: rgb(20, 36, 58); font-size: 14px; line-height: 1.5; font-weight: 800; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.news-feed-meta { display: inline-flex; align-items: center; justify-content: flex-end; gap: 8px; color: rgb(96, 115, 140); font-size: 11px; font-weight: 800; white-space: nowrap; }
.news-feed-hash { padding: 4px 8px; border-radius: 999px; background: rgba(125, 211, 252, 0.14); color: rgb(46, 75, 115); }
.frontier-news-panel .news-group-card { border: 1px solid rgba(54, 83, 122, 0.18); border-radius: 18px; background: rgba(255, 255, 255, 0.9); box-shadow: rgba(255, 255, 255, 0.72) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.1) 0px 14px 30px; }
.frontier-news-panel .news-group-card:hover { transform: translateY(-2px); box-shadow: rgba(255, 255, 255, 0.8) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.16) 0px 18px 34px; }
.frontier-news-panel .news-group-head { padding: 13px 14px 11px; }
.frontier-news-panel .news-group-name { color: rgb(23, 36, 58); font-size: 14px; letter-spacing: 0.04em; }
.frontier-news-panel .news-group-link { grid-template-columns: 30px minmax(0px, 1fr); padding: 10px 14px; }
.frontier-news-panel .news-group-title { color: rgb(27, 43, 70); font-size: 13px; line-height: 1.55; font-weight: 800; -webkit-line-clamp: 2; }
.frontier-news-panel .newspaper-footer { grid-area: 3 / 1 / auto / -1; z-index: 1; border-top: 1px solid rgba(54, 83, 122, 0.16); background: rgba(255, 255, 255, 0.84); }
@media (max-width: 1180px) {
  .frontier-news-panel { grid-template-columns: 1fr; grid-template-rows: auto auto minmax(0px, 1fr) auto; }
  .news-intel-panel { grid-area: 2 / 1; grid-template-rows: auto minmax(0px, auto); padding: 14px; border-left: 0px; border-bottom: 1px solid rgba(54, 83, 122, 0.14); }
  .frontier-news-panel .newspaper-content { grid-area: 3 / 1; }
  .news-filter-bar { position: static; }
  .frontier-news-panel .newspaper-footer { grid-row: 4; }
  .news-intel-panel .agent-briefing { max-height: 360px; }
}
@media (max-width: 760px) {
  body[data-active-view="frontier-news"] .topbar { padding: 8px; }
  body[data-active-view="frontier-news"] .title-copy { padding: 8px; }
  .newspaper-header { gap: 8px; padding: 14px; }
  .news-intel-panel { padding: 12px; }
  .news-intel-panel .newspaper-search { padding: 14px; }
  .news-intel-panel .agent-actions { grid-template-columns: 1fr; }
  .news-intel-panel .agent-suggestion-row { display: none; }
  .news-intel-panel .agent-briefing { max-height: 390px; }
  .news-intel-panel .agent-result-bar { grid-template-columns: 1fr; }
  .frontier-news-panel .newspaper-content { grid-template-columns: 1fr; padding: 12px; }
  .news-filter-bar { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .news-filter-button { min-width: 0px; }
  .news-feed-row { grid-template-columns: auto minmax(0px, 1fr); align-items: start; gap: 10px; padding: 12px; }
  .news-feed-meta { grid-column: 2; justify-content: flex-start; }
}
@media (max-width: 1180px) {
  .console-shell { grid-template-columns: 190px minmax(0px, 1fr); }
  .dashboard-grid { grid-template: "overview" "board" minmax(260px, 1fr) / minmax(0px, 1fr); }
  .dashboard-leaderboard { height: clamp(300px, 42vh, 520px); max-height: clamp(300px, 42vh, 520px); }
  .dashboard-overview .newapi-card-body { grid-template-rows: auto auto auto auto minmax(0px, 1fr); }
  .hourly-chart { min-height: 218px; }
  .hourly-svg { height: 218px; }
  .console-snippet-grid, .instance-config-grid, .console-page-grid, .recharge-grid, .recharge-jump-layout, .console-page-grid.equal, .call-detail-layout, .own-usage-layout, .admin-account-detail-grid { grid-template-columns: minmax(0px, 1fr); }
  .own-model-panel { position: static; }
  .usage-query-cards, .channel-status-summary, .channel-card-metrics, .recharge-plan-grid, .recharge-jump-grid, .admin-payment-grid, .admin-summary-strip, .admin-account-stats, .admin-account-row { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .admin-payment-methods { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .channel-status-toolbar { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 760px) {
  .console-shell { grid-template-columns: minmax(0px, 1fr); grid-template-rows: auto minmax(0px, 1fr); }
  .console-gate { padding: 12px; }
  .console-gate-form { grid-template-columns: minmax(0px, 1fr); }
  .console-sidebar { grid-template-rows: auto auto; padding: 10px; }
  .console-nav-list { grid-template-columns: repeat(2, minmax(0px, 1fr)); overflow: hidden visible; padding-right: 0px; }
  .console-sidebar-foot { display: none; }
  .console-page-title { align-items: flex-start; flex-direction: column; }
  .newapi-status-pill { width: 100%; }
  .dashboard-key-form, .dashboard-state-metrics, .dashboard-usage-metrics, .usage-query-cards, .recharge-balance-panel, .recharge-custom-row, .recharge-plan-grid, .recharge-jump-grid, .model-billing-grid, .admin-summary-strip, .admin-account-stats, .admin-account-detail-head, .call-recent-row, .admin-account-row, .admin-balance-form { grid-template-columns: minmax(0px, 1fr); }
  .dashboard-leaderboard { height: clamp(300px, 44vh, 460px); max-height: clamp(300px, 44vh, 460px); }
  .dashboard-overview .newapi-card-body { grid-template-rows: auto auto auto auto minmax(0px, 1fr); }
  .dashboard-hourly-head { flex-direction: column; }
  .dashboard-hourly-total { max-width: 100%; text-align: left; }
  .hourly-chart { grid-template-columns: 34px minmax(0px, 1fr); min-height: 184px; gap: 3px; padding: 8px; }
  .hourly-svg { height: 184px; }
  .hourly-chart.is-empty { grid-template-columns: minmax(0px, 1fr); min-height: 168px; padding: 8px; }
  .hourly-empty-state { min-height: 112px; }
  .hourly-axis { padding: 14px 0px 6px; font-size: 8px; }
  .hourly-bars { min-height: 124px; gap: 3px; padding: 8px 2px 0px 7px; }
  .hourly-bar { grid-template-rows: minmax(0px, 1fr); }
  .hourly-bar-value, .hourly-bar-label { display: none; }
  .recharge-qr-frame { min-height: 220px; }
  .topup-order-row { grid-template-columns: minmax(0px, 1fr); align-items: stretch; }
  .topup-order-actions { justify-content: stretch; }
  .topup-order-actions .newapi-button { flex: 1 1 0%; }
  .model-card { padding: 12px; }
  .model-card-head { align-items: stretch; flex-direction: column; }
  .model-desc { min-height: 0px; }
  .model-stats { grid-template-columns: minmax(0px, 1fr); }
  .usage-query-card strong { font-size: 16px; }
  .model-breakdown-row { grid-template-columns: minmax(0px, 1fr); }
  .own-model-panel .model-breakdown-row { grid-template-columns: minmax(0px, 1fr); }
  .own-model-table-head { display: none; }
  .own-model-table-row { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 6px; }
  .own-model-table-name { grid-column: 1 / -1; }
  .own-model-table-period { grid-column: 1 / -1; text-align: left; }
  .own-model-table-value { text-align: left; }
  .model-breakdown-main { grid-column: 1 / -1; }
  .own-model-panel .model-breakdown-main { grid-template-columns: minmax(0px, 1fr); }
  .own-model-panel .model-breakdown-meta { margin-top: 4px; text-align: left; }
  .model-breakdown-metric, .model-breakdown-cost { text-align: left; }
  .call-recent-cell { display: flex; justify-content: space-between; gap: 10px; white-space: normal; }
  .call-recent-cell::before { flex: 0 0 auto; color: rgb(112, 130, 154); font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; }
  .call-recent-cell.time::before { content: "时间"; }
  .call-recent-cell.model::before { content: "模型"; }
  .call-recent-cell.tokens::before { content: "Token"; }
  .call-recent-cell.quota::before { content: "Quota"; }
  .call-recent-cell.cost::before { content: "用量估算"; }
  .call-recent-cell.latency::before { content: "延迟"; }
  .own-model-panel .model-breakdown-metric { grid-template-columns: auto minmax(0px, 1fr); text-align: left; }
  .own-model-panel .model-breakdown-cost { justify-content: flex-start; }
  .usage-ledger-head { align-items: stretch; flex-direction: column; }
  .usage-ledger-head .newapi-button { width: 100%; }
}
@media (max-width: 600px) {
  .console-shell-panel { border-radius: 18px; }
  .console-shell-panel > .panel-head { padding: 8px 10px; font-size: 10px; }
  .console-shell-panel .panel-body { padding: 7px; overflow: visible; }
  .console-gate-card .newapi-card-body { padding: 12px; }
  .console-gate-copy h2 { font-size: 22px; }
  .console-gate-copy p { font-size: 12px; line-height: 1.55; }
  .console-shell { height: auto; display: flex; flex-direction: column; gap: 8px; }
  .console-sidebar { position: sticky; top: 0px; z-index: 20; gap: 8px; padding: 8px; border-radius: 18px; }
  .console-brand { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 6px 8px 8px; }
  .console-brand strong { font-size: 13px; }
  .console-brand span { margin-top: 0px; font-size: 9px; }
  .console-nav-list { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 5px; }
  .console-nav { grid-template-columns: minmax(0px, 1fr); justify-items: center; gap: 4px; padding: 7px 4px; border-radius: 12px; font-size: 10px; text-align: center; }
  .console-nav-icon { width: 20px; height: 20px; border-radius: 8px; font-size: 10px; }
  .console-content, .console-page, .console-page.active, .dashboard-page, .console-page-main, .dashboard-grid, .dashboard-overview, .newapi-card, .newapi-card-body, .console-page-grid, .usage-ledger-panel { height: auto; min-height: 0px; overflow: visible; }
  .console-page.active, .console-page-main, .console-page-grid { gap: 8px; }
  .console-page-title { gap: 5px; padding: 9px 10px; border-radius: 16px; }
  .console-page-title h2 { font-size: 17px; }
  .console-page-title span { font-size: 10px; line-height: 1.4; }
  .newapi-card { border-radius: 17px; }
  .newapi-card-head { align-items: flex-start; flex-direction: column; gap: 6px; padding: 11px 12px; }
  .newapi-card-title { font-size: 13px; }
  .newapi-card-desc { font-size: 10px; line-height: 1.4; }
  .newapi-card-body { gap: 9px; padding: 11px; }
  .newapi-status-pill { align-self: stretch; justify-content: center; min-height: 32px; }
  .newapi-actions, .newapi-actions.compact { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 6px; }
  .newapi-actions .newapi-button, .dashboard-key-form .newapi-button, .console-gate-form .newapi-button { width: 100%; min-width: 0px; }
  .newapi-button { min-height: 36px; padding: 8px 10px; border-radius: 12px; font-size: 11px; }
  .newapi-input, .newapi-select, .newapi-textarea { min-height: 38px; padding: 8px 10px; border-radius: 12px; font-size: 12px; }
  .newapi-metrics, .dashboard-usage-metrics, .dashboard-state-metrics, .usage-query-cards { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 7px; }
  .newapi-metric, .usage-query-card { padding: 9px; border-radius: 13px; }
  .newapi-metric span, .usage-query-card span { font-size: 8px; letter-spacing: 0.05em; }
  .newapi-metric strong, .usage-query-card strong { margin-top: 5px; font-size: 13px; white-space: normal; overflow-wrap: anywhere; }
  .dashboard-overview .newapi-card-body { grid-template-rows: auto; }
  .dashboard-hourly-card { gap: 7px; padding: 8px; border-radius: 16px; }
  .dashboard-hourly-head { gap: 6px; }
  .dashboard-hourly-title { font-size: 11px; letter-spacing: 0.06em; }
  .dashboard-hourly-desc { font-size: 9px; }
  .dashboard-hourly-total { flex: 1 1 auto; justify-content: flex-start; max-width: 100%; min-width: 0px; font-size: 11px; }
  .hourly-chart { min-height: 178px; padding: 4px; border-radius: 14px; }
  .hourly-svg { height: 168px; }
  .hourly-svg-label, .hourly-svg-time { font-size: 9px; }
  .hourly-chart.is-empty { min-height: 150px; }
  .dashboard-leaderboard { height: clamp(300px, 44vh, 460px); min-height: 300px; border-radius: 16px; }
  .mini-leaderboard-panel .rank-list-head { grid-template-columns: 28px minmax(0px, 1fr) 70px; gap: 5px; padding: 0px 7px 5px; font-size: 8px; }
  .mini-leaderboard-panel .row { min-height: 32px; grid-template-columns: 28px minmax(0px, 1fr) 70px; gap: 5px; padding: 5px 7px; }
  .mini-leaderboard-panel .rank-badge { width: 22px; height: 22px; border-radius: 8px; font-size: 9px; }
  .mini-leaderboard-panel .pill { padding: 4px 5px; font-size: 9px; }
  .newapi-model-tools { gap: 6px; }
  .newapi-model-list { max-height: none; overflow: visible; padding-right: 0px; }
  .newapi-model-row { grid-template-columns: 26px minmax(0px, 1fr); gap: 8px; padding: 9px 10px; border-radius: 13px; }
  .newapi-model-row .model-expand-toggle { width: 24px; height: 24px; border-radius: 9px; }
  .newapi-model-name { font-size: 12px; white-space: normal; overflow-wrap: anywhere; }
  .newapi-model-price-line { white-space: normal; overflow-wrap: anywhere; }
  .newapi-model-tag { grid-column: 2 / -1; justify-self: start; margin-top: -3px; }
  .newapi-model-row .model-billing-details { grid-column: 1 / -1; }
  .newapi-model-row .model-billing-grid { grid-template-columns: 1fr; }
  .model-provider-switch { gap: 4px; padding: 4px; }
  .model-provider-tab { padding: 7px 4px; font-size: 10px; letter-spacing: 0.03em; }
  .model-card { padding: 11px; border-radius: 16px; }
  .model-card::before { width: 90px; height: 90px; }
  .model-card-head { align-items: flex-start; flex-direction: row; }
  .model-name { font-size: 15px; }
  .model-desc { margin-top: 6px; font-size: 11px; line-height: 1.45; }
  .model-billing-grid, .model-stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 5px; }
  .model-billing-chip { padding: 6px 5px; border-radius: 11px; }
  .model-billing-chip span, .model-stat span { font-size: 7px; letter-spacing: 0.05em; }
  .model-billing-chip strong, .model-stat strong { font-size: 10px; }
  .model-billing-note { font-size: 8px; }
  .tag-row { gap: 5px; margin-top: 8px; }
  .model-tag { padding: 4px 6px; font-size: 9px; }
  .model-stat { padding: 6px 5px; border-radius: 11px; }
  .own-usage-layout, .own-usage-column { gap: 8px; }
  .call-detail-panel { gap: 8px; padding: 10px; border-radius: 15px; }
  .call-detail-title-row { align-items: flex-start; flex-direction: column; gap: 3px; }
  .call-detail-subtitle { font-size: 9px; white-space: normal; }
  .own-model-panel .model-breakdown-list { max-height: none; overflow: visible; padding-right: 0px; }
  .own-model-table-row { grid-template-columns: repeat(3, minmax(0px, 1fr)); padding: 8px; border-radius: 12px; }
  .own-model-table-name strong, .own-model-table-pricing { white-space: normal; overflow-wrap: anywhere; }
  .own-model-compact-row { padding: 8px; }
  .own-model-compact-top { grid-template-columns: minmax(0px, 1fr); gap: 4px; }
  .own-model-compact-cost { justify-self: start; }
  .own-model-compact-meta, .own-model-compact-price { white-space: normal; overflow-wrap: anywhere; }
  .call-recent-list { gap: 7px; }
  .call-recent-row { gap: 8px; padding: 10px; border-radius: 14px; }
  .call-recent-head, .call-recent-body, .admin-account-tools-grid { grid-template-columns: minmax(0px, 1fr); }
  .call-recent-head-side { justify-content: flex-start; }
  .call-recent-model-name { font-size: 13px; }
  .call-status-pill { justify-self: stretch; width: 100%; }
  .newapi-result { min-height: 160px; max-height: none; padding: 10px; border-radius: 12px; font-size: 10.5px; }
  .usage-ledger-panel { gap: 8px; padding: 10px; border-radius: 16px; }
  .admin-payment-head { flex-direction: column; }
  .admin-payment-grid, .admin-payment-methods, .topup-order-row { grid-template-columns: minmax(0px, 1fr); }
  .topup-order-actions { justify-content: stretch; }
  .topup-order-actions .newapi-button { flex: 1 1 auto; }
  .usage-ledger-title { font-size: 18px; }
  .usage-ledger-subtitle { font-size: 10px; }
  .admin-account-list { grid-template-columns: minmax(0px, 1fr); gap: 8px; }
}
@media (max-width: 380px) {
  .console-nav-list { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .newapi-actions, .newapi-actions.compact, .newapi-metrics, .dashboard-usage-metrics, .dashboard-state-metrics, .usage-query-cards, .recharge-balance-panel, .recharge-custom-row, .recharge-plan-grid { grid-template-columns: minmax(0px, 1fr); }
  .model-billing-grid, .model-stats { grid-template-columns: minmax(0px, 1fr); }
  .model-card-head { flex-direction: column; }
}
@media (min-width: 1440px) {
  .app { inset: 14px; }
  .console-shell { grid-template-columns: 224px minmax(0px, 1fr); }
  .dashboard-grid { grid-template-columns: minmax(0px, 1fr) minmax(360px, 0.46fr); }
}
@media (max-width: 1320px) and (min-width: 981px) {
  .topbar, body[data-active-view="leaderboard"] .topbar { grid-template-columns: minmax(0px, 0.86fr) minmax(360px, 1fr); }
  .stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .console-shell { grid-template-columns: 196px minmax(0px, 1fr); }
  .console-sidebar { padding: 10px; }
  .console-nav { padding: 9px; font-size: 11px; }
  .dashboard-usage-metrics, .dashboard-state-metrics { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .dashboard-usage-metrics .newapi-metric em { -webkit-line-clamp: 2; }
}
@media (max-width: 980px) {
  html, body { min-height: 100%; overflow: auto; }
  .app { position: relative; inset: auto; width: 100%; min-height: 100dvh; height: auto; border-radius: 0px; overflow: visible; }
  .topbar, body[data-active-view="leaderboard"] .topbar { grid-template-columns: minmax(0px, 1fr); align-items: stretch; }
  body[data-active-view="leaderboard"] .title-copy { flex-wrap: wrap; }
  .stage, .console-stage, .models-stage, .frontier-news-stage { min-height: 0px; height: auto; overflow: visible; }
  .panel, .newapi-panel, .console-shell-panel { min-height: 0px; overflow: visible; }
  .panel-body, .newapi-panel.console-shell-panel .panel-body, .console-shell-panel .panel-body { overflow: visible; }
  .console-shell { height: auto; grid-template-columns: minmax(0px, 1fr); grid-template-rows: auto minmax(0px, 1fr); overflow: visible; }
  .console-sidebar { grid-template-rows: auto auto; gap: 9px; padding: 10px; border-radius: 20px; }
  .console-brand { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; padding: 8px 10px; }
  .console-brand span { margin-top: 0px; }
  .console-nav-list { display: flex; gap: 8px; overflow: auto hidden; padding: 0px 2px 4px; scrollbar-gutter: auto; scroll-snap-type: x; }
  .console-nav { flex: 0 0 auto; min-width: 128px; grid-template-columns: 24px minmax(0px, 1fr); scroll-snap-align: start; }
  .console-sidebar-foot { display: none; }
  .console-content, .console-page, .console-page-main, .console-page-grid, .dashboard-grid, .recharge-grid, .own-usage-layout, .call-detail-layout, .admin-account-detail-grid { height: auto; overflow: visible; }
  .console-page.active { min-height: 0px; }
  .console-page-grid, .console-page-grid.equal, .dashboard-grid, .recharge-grid, .own-usage-layout, .call-detail-layout, .admin-account-detail-grid { grid-template-columns: minmax(0px, 1fr); }
  .dashboard-leaderboard { min-height: 300px; }
  .newapi-card-body { min-height: 0px; }
  .newapi-result, .newapi-usage-result, .call-recent-list, .topup-order-list, .admin-account-list { max-height: none; }
}
@media (max-width: 760px) {
  .app { gap: 8px; }
  .topbar, body[data-active-view="leaderboard"] .topbar { padding: 8px; }
  .title-copy, body[data-active-view="leaderboard"] .title-copy { flex-direction: column; align-items: stretch; }
  .view-switch { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); width: 100%; }
  .view-tab { min-width: 0px; width: 100%; }
  .stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .metric { min-width: 0px; }
  .console-shell-panel > .panel-head { align-items: flex-start; flex-direction: column; gap: 6px; }
  .console-shell-panel > .panel-head span:last-child { align-self: stretch; text-align: center; }
  .console-nav-list { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); overflow: visible; }
  .console-nav { width: 100%; min-width: 0px; }
  .dashboard-usage-metrics, .dashboard-state-metrics, .usage-query-cards, .recharge-balance-panel, .recharge-plan-grid, .recharge-jump-grid, .admin-summary-strip, .admin-account-stats { grid-template-columns: minmax(0px, 1fr); }
  .dashboard-usage-metrics .newapi-metric em { -webkit-line-clamp: 2; }
  .dashboard-hourly-card, .hourly-chart { overflow: hidden; }
  .hourly-chart { min-height: 210px; }
  .hourly-svg { height: 210px; }
  .model-grid, .model-billing-grid, .model-stats, .newapi-workbench, .console-snippet-grid, .admin-payment-grid, .admin-payment-methods { grid-template-columns: minmax(0px, 1fr); }
}
@media (max-width: 520px) {
  .topbar, body[data-active-view="leaderboard"] .topbar { padding: 6px; }
  .title-copy h1 { white-space: normal; }
  .stats { gap: 6px; }
  .metric { padding: 8px; }
  .metric .value { font-size: 16px; }
  .stage { padding: 0px 6px 6px; }
  .panel-head, body[data-active-view="leaderboard"] .console-shell-panel > .panel-head { padding: 8px 10px; letter-spacing: 0.06em; }
  .newapi-panel.console-shell-panel .panel-body, .console-shell-panel .panel-body { padding: 8px; }
  .newapi-card-head, .dashboard-overview .newapi-card-head { align-items: flex-start; flex-direction: column; padding: 10px; }
  .newapi-card-body { gap: 9px; padding: 10px; }
  .newapi-status-pill { width: 100%; min-width: 0px; min-height: 34px; }
  .newapi-actions, .newapi-actions.compact { display: grid; grid-template-columns: minmax(0px, 1fr); }
  .newapi-button, .newapi-button.slim { width: 100%; }
  .console-brand { display: grid; }
  .console-nav-list { gap: 6px; }
  .console-nav { padding: 8px; border-radius: 12px; font-size: 11px; }
  .dashboard-hourly-head { flex-direction: column; }
  .dashboard-hourly-total { max-width: 100%; width: 100%; justify-content: flex-start; }
  .hourly-chart { min-height: 188px; padding: 4px; }
  .hourly-svg { height: 188px; }
  .topup-order-row, .call-recent-row, .own-model-table-row, .model-breakdown-row { grid-template-columns: minmax(0px, 1fr); }
  .call-recent-cell, .own-model-table-value, .model-breakdown-metric, .model-breakdown-cost { text-align: left; }
  .usage-log-table, .usage-log-table thead, .usage-log-table tbody, .usage-log-table tr, .usage-log-table th, .usage-log-table td { display: block; }
  .usage-log-table thead { display: none; }
  .usage-log-table tbody { display: grid; gap: 8px; }
  .usage-log-table tr { padding: 8px; border: 1px solid rgba(82, 139, 181, 0.14); border-radius: 10px; background: rgba(255, 255, 255, 0.64); }
  .usage-log-table td { display: flex; align-items: center; justify-content: space-between; gap: 10px; width: 100%; padding: 5px 2px; border-bottom: 0px; text-align: right; white-space: normal; }
  .usage-log-table td::before { content: attr(data-label); flex: 0 0 auto; color: rgb(112, 130, 154); font-size: 9px; font-weight: 900; }
  .usage-log-empty td { justify-content: center; min-height: 100px; text-align: center; }
  .usage-log-empty td::before { display: none; }
}
@media (max-width: 360px) {
  .view-switch, .stats, .console-nav-list { grid-template-columns: minmax(0px, 1fr); }
  .podium { grid-template-columns: minmax(0px, 1fr); }
  .rank-list-head, .row { grid-template-columns: 28px minmax(0px, 1fr) 58px; }
  .hourly-chart { min-height: 168px; }
  .hourly-svg { height: 168px; }
}
@media (max-height: 760px) and (min-width: 981px) {
  .app { inset: 8px; gap: 8px; }
  .topbar, body[data-active-view="leaderboard"] .topbar { padding-block: 4px; }
  .title-copy, body[data-active-view="leaderboard"] .title-copy, .metric, .panel-head, .newapi-card-head, .newapi-card-body { padding-block: 8px; }
  .console-shell { gap: 8px; }
  .console-sidebar { gap: 8px; padding: 9px; }
  .dashboard-hourly-card { padding: 7px; }
  .hourly-chart { min-height: 198px; }
  .hourly-svg { height: 198px; }
}
body { font-size: 13px; }
.console-nav, .newapi-button, .newapi-input, .newapi-select, .newapi-textarea, .newapi-result, .newapi-usage-result, .newapi-card-desc, .console-page-title span, .usage-ledger-subtitle, .recharge-summary-card p, .recharge-method-card span, .admin-payment-desc, .topup-order-main span, .topup-order-meta, .call-recent-cell, .model-breakdown-meta, .model-breakdown-pricing, .own-model-table-pricing { font-size: 12px; }
.newapi-card-title, .usage-ledger-title, .admin-payment-title, .recharge-summary-card strong, .newapi-metric strong, .usage-query-card strong, .admin-summary-card strong { font-size: 14px; }
.newapi-metric span, .usage-query-card span, .admin-summary-card span, .recharge-section-title, .recharge-setting-card span, .dashboard-hourly-desc, .hourly-svg-time { font-size: 11px; }
.dashboard-usage-metrics .newapi-metric strong { font-size: 17px; }
.dashboard-usage-metrics .newapi-metric em { font-size: 9px; }
.console-nav { font-size: 12px; }
.console-nav-icon { font-size: 11px; }
.newapi-button.slim { font-size: 11px; }
.metric .label, .view-tab, .panel-head, .dashboard-hourly-title, .topup-status-pill, .call-status-pill { font-size: 12px; }
.metric .value, .podium-score, .score { font-size: 14px; }
@media (max-width: 760px) {
  body { font-size: 12.5px; }
  .console-nav, .newapi-button, .newapi-button.slim, .view-tab { font-size: 11px; }
  .newapi-input, .newapi-select, .newapi-textarea { font-size: 12px; }
  .newapi-card-desc, .console-page-title span, .newapi-metric em, .usage-query-card .newapi-card-desc { font-size: 10px; }
}
@media (max-width: 520px) {
  body { font-size: 12px; }
  .metric .value { font-size: 15px; }
  .newapi-card-title, .usage-ledger-title { font-size: 13px; }
  .dashboard-usage-metrics .newapi-metric strong { font-size: 16px; }
}
@media (max-width: 760px) {
  .display-name-console, .display-name-controls, .admin-display-name-form { grid-template-columns: minmax(0px, 1fr); }
  .newapi-account-title-row { width: 100%; max-width: 100%; }
  .display-name-inline-editor { width: 100%; min-width: 0px; max-width: 100%; flex: 1 1 auto; }
  .display-name-console { align-items: stretch; }
}
.usage-log-page { grid-template-rows: minmax(0px, 1fr); }
.usage-log-page > .console-page-grid, .usage-log-panel { height: 100%; }
.usage-log-panel { display: grid; grid-template-rows: auto auto minmax(0px, 1fr) auto; gap: 9px; min-height: 0px; overflow: hidden; border: 1px solid rgba(82, 139, 181, 0.2); border-radius: 16px; padding: 10px; background: rgba(255, 255, 255, 0.5); box-shadow: rgba(255, 255, 255, 0.54) 0px 0px 0px 1px inset; }
.usage-log-toolbar { display: grid; gap: 8px; min-width: 0px; }
.usage-log-admin-filters { display: grid; grid-template-columns: minmax(260px, 1.25fr) minmax(220px, 0.75fr); gap: 8px; padding: 8px; border: 1px solid rgba(82, 139, 181, 0.14); border-radius: 13px; background: rgba(245, 250, 255, 0.72); }
.usage-log-admin-filters[hidden] { display: none; }
.usage-log-primary-filters { display: grid; grid-template-columns: minmax(126px, 0.68fr) minmax(210px, 1.08fr) minmax(210px, 1.08fr) minmax(112px, 0.62fr) minmax(142px, 0.78fr) auto; grid-template-areas: "range start end status model actions"; gap: 8px; align-items: end; min-width: 0px; }
.usage-log-filter-field, .usage-log-date { display: grid; gap: 5px; min-width: 0px; }
.usage-log-filter-field > span, .usage-log-date > span { color: rgb(88, 112, 142); font-size: 9px; font-weight: 900; line-height: 1; letter-spacing: 0.06em; }
.usage-log-filter-field .newapi-input, .usage-log-filter-field .newapi-select, .usage-log-date .newapi-input { width: 100%; height: 42px; min-width: 0px; border-radius: 12px; }
.usage-log-date .newapi-input { padding-inline: 10px; font-size: 11px; font-variant-numeric: tabular-nums; }
.usage-log-range-field { grid-area: range; }
.usage-log-start-field { grid-area: start; }
.usage-log-end-field { grid-area: end; }
.usage-log-status-field { grid-area: status; }
.usage-log-model-field { grid-area: model; }
.usage-log-filter-actions { grid-area: actions; display: grid; grid-template-columns: repeat(2, minmax(76px, 1fr)); gap: 7px; align-items: end; }
.usage-log-filter-actions .newapi-button, .usage-log-filter-actions .newapi-button.slim { width: 100%; min-height: 42px; padding: 8px 12px; white-space: nowrap; }
.usage-log-stats { grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 7px; }
.usage-log-stats .usage-query-card { min-height: 0px; padding: 7px 9px; border-radius: 10px; }
.usage-log-stats .usage-query-card span { font-size: 8px; line-height: 1.1; }
.usage-log-stats .usage-query-card strong { margin-top: 4px; font-size: 13px; line-height: 1.08; }
.usage-log-stats .usage-query-card .newapi-card-desc { margin-top: 3px; font-size: 9px; line-height: 1.25; }
.usage-log-table-wrap { height: 100%; min-height: 0px; max-height: none; overflow: auto; scrollbar-gutter: stable; overscroll-behavior: contain; border: 1px solid rgba(82, 139, 181, 0.16); border-radius: 12px; background: rgba(255, 255, 255, 0.58); }
.admin-recent-table-wrap { min-height: 180px; max-height: min(34vh, 340px); overflow: auto; }
.usage-log-table { width: 100%; min-width: 0px; border-collapse: collapse; font-size: 12px; color: rgb(23, 54, 91); table-layout: fixed; }
.usage-log-table th, .usage-log-table td { padding: 9px; border-bottom: 1px solid rgba(82, 139, 181, 0.14); text-align: center; vertical-align: middle; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.usage-log-table th { position: sticky; top: 0px; z-index: 1; background: rgba(243, 248, 252, 0.94); color: rgb(69, 99, 131); font-size: 10.5px; letter-spacing: 0px; }
.usage-log-table td:nth-child(1) { width: 96px; }
.usage-log-table td:nth-child(2), .usage-log-table td:nth-child(3), .usage-log-table td:nth-child(6) { font-weight: 800; }
.usage-log-table td:nth-child(5), .usage-log-table td:nth-child(7), .usage-log-table td:nth-child(8), .usage-log-table td:nth-child(9), .usage-log-table td:nth-child(10) { text-align: center; font-variant-numeric: tabular-nums; }
.usage-log-empty td { height: 120px; text-align: center; color: rgb(106, 131, 162); font-weight: 800; }
.usage-log-status { display: inline-flex; justify-content: center; min-width: 38px; border-radius: 999px; padding: 2px 7px; border: 1px solid rgba(52, 166, 120, 0.2); background: rgba(230, 250, 239, 0.72); color: rgb(40, 123, 86); font-weight: 900; font-size: 11px; }
.usage-log-status.failed { border-color: rgba(217, 84, 84, 0.24); background: rgba(255, 234, 234, 0.8); color: rgb(164, 59, 59); }
.usage-log-pager { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 40px; margin-top: 0px; padding: 8px 3px 0px; border-top: 1px solid rgba(82, 139, 181, 0.1); }
.usage-log-page-buttons { display: flex; align-items: center; justify-content: flex-start; flex-wrap: nowrap; gap: 4px; min-width: 0px; }
.usage-log-page-button { min-width: 32px; min-height: 32px; padding: 5px 9px; border: 1px solid rgba(82, 139, 181, 0.18); border-radius: 9px; background: rgba(255, 255, 255, 0.7); color: rgb(54, 91, 130); font-size: 10px; font-weight: 900; cursor: pointer; }
.usage-log-page-button.nav { min-width: 62px; }
.usage-log-page-button:hover:not(:disabled) { border-color: rgba(79, 167, 222, 0.34); background: rgba(237, 248, 255, 0.92); color: rgb(23, 71, 111); }
.usage-log-page-button.current { border-color: rgba(79, 167, 222, 0.38); background: linear-gradient(rgb(90, 179, 233), rgb(62, 149, 210)); color: rgb(255, 255, 255); box-shadow: rgba(62, 149, 210, 0.18) 0px 6px 14px; }
.usage-log-page-button.current:disabled { cursor: default; opacity: 1; }
.usage-log-page-ellipsis { display: inline-grid; place-items: center; width: 24px; min-height: 32px; color: rgb(23, 71, 111); font-size: 11px; font-weight: 900; }
.usage-log-page-button:disabled { cursor: not-allowed; opacity: 0.5; }
.usage-log-page-info { color: rgb(99, 119, 146); font-size: 10px; font-weight: 900; white-space: nowrap; font-family: "Courier New", monospace; }
@media (max-width: 1320px) {
  .usage-log-primary-filters { grid-template-columns: minmax(126px, 0.7fr) minmax(205px, 1fr) minmax(205px, 1fr); grid-template-areas: "range start end" "status model actions"; }
}
@media (max-width: 980px) {
  .usage-log-page { grid-template-rows: auto; }
  .usage-log-page > .console-page-grid, .usage-log-panel { height: auto; }
  .usage-log-panel { grid-template-rows: auto auto minmax(360px, 58vh) auto; }
  .usage-log-admin-filters { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .admin-account-filter, .admin-account-row, .admin-account-tools { grid-template-columns: minmax(0px, 1fr); }
  .usage-log-stats { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 760px) {
  .usage-log-admin-filters { grid-template-columns: minmax(0px, 1fr); }
  .usage-log-primary-filters { grid-template-columns: repeat(2, minmax(0px, 1fr)); grid-template-areas: "range range" "start end" "status model" "actions actions"; }
}
@media (max-width: 520px) {
  .usage-log-stats, .channel-status-toolbar, .channel-status-summary, .channel-card-metrics { grid-template-columns: minmax(0px, 1fr); }
  .usage-log-panel { grid-template-rows: auto auto auto auto; padding: 8px; }
  .usage-log-primary-filters { grid-template-columns: minmax(0px, 1fr); grid-template-areas: "range" "start" "end" "status" "model" "actions"; }
  .usage-log-table-wrap, .admin-recent-table-wrap { height: auto; min-height: 160px; }
  .admin-recent-table-wrap { max-height: 56vh; }
  .usage-log-table { font-size: 10px; }
  .usage-log-table th, .usage-log-table td { padding: 5px 4px; }
  .usage-log-pager { align-items: flex-start; flex-direction: column; }
  .usage-log-page-info { white-space: normal; }
}
.console-page[data-console-page="recharge"], .console-page[data-console-page="admin"] { overflow: auto; padding-right: 4px; scrollbar-gutter: stable; }
.console-page[data-console-page="recharge"] .console-page-title { padding: 10px 12px; border-radius: 14px; }
.console-page[data-console-page="recharge"] .console-page-title h2 { font-size: 20px; letter-spacing: 0px; }
.console-page[data-console-page="recharge"] .console-page-title span, .console-page[data-console-page="recharge"] .newapi-card-desc, .console-page[data-console-page="admin"] .newapi-card-desc { font-size: 12px; line-height: 1.45; }
.console-page[data-console-page="recharge"] .recharge-grid, .console-page[data-console-page="recharge"] .recharge-jump-layout { grid-template-columns: minmax(360px, 0.92fr) minmax(360px, 1.08fr); gap: 10px; align-items: start; }
.console-page[data-console-page="recharge"] .newapi-card, .console-page[data-console-page="admin"] .newapi-card { border-radius: 14px; }
.console-page[data-console-page="recharge"] .newapi-card-head, .console-page[data-console-page="admin"] .newapi-card-head { padding: 10px 12px; }
.console-page[data-console-page="recharge"] .newapi-card-body, .console-page[data-console-page="admin"] .newapi-card-body { gap: 9px; padding: 10px 12px 14px; overflow: visible; }
.console-page[data-console-page="recharge"] .newapi-card-title, .console-page[data-console-page="admin"] .newapi-card-title { font-size: 15px; }
.console-page[data-console-page="recharge"] .recharge-balance-panel { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 7px; padding: 8px; border-radius: 12px; }
.console-page[data-console-page="recharge"] .recharge-balance-panel > div { padding: 8px; border-radius: 10px; }
.console-page[data-console-page="recharge"] .recharge-balance-panel span, .console-page[data-console-page="recharge"] .recharge-section-title, .console-page[data-console-page="recharge"] .recharge-summary-card span { font-size: 11px; letter-spacing: 0px; text-transform: none; }
.console-page[data-console-page="recharge"] .recharge-balance-panel strong { font-size: 18px; }
.console-page[data-console-page="recharge"] .recharge-plan-grid { gap: 7px; }
.console-page[data-console-page="recharge"] .recharge-plan-card { min-height: 74px; padding: 9px; border-radius: 11px; }
.console-page[data-console-page="recharge"] .recharge-plan-card span, .console-page[data-console-page="recharge"] .recharge-plan-card em { font-size: 11px; }
.console-page[data-console-page="recharge"] .recharge-plan-card strong { margin: 5px 0px 3px; font-size: 20px; }
.console-page[data-console-page="recharge"] .recharge-method-list, .console-page[data-console-page="recharge"] .topup-order-list { gap: 7px; }
.console-page[data-console-page="recharge"] .recharge-method-card { padding: 9px 10px; border-radius: 10px; }
.console-page[data-console-page="recharge"] .recharge-method-card strong, .console-page[data-console-page="recharge"] .topup-order-main strong { font-size: 13px; }
.console-page[data-console-page="recharge"] .recharge-method-card span, .console-page[data-console-page="recharge"] .recharge-summary-card p, .console-page[data-console-page="recharge"] .topup-order-main span, .console-page[data-console-page="recharge"] .topup-order-meta, .console-page[data-console-page="admin"] .topup-order-main span, .console-page[data-console-page="admin"] .topup-order-meta { font-size: 12px; line-height: 1.42; }
.console-page[data-console-page="recharge"] .recharge-summary-card { padding: 9px 10px; border-radius: 11px; }
.console-page[data-console-page="recharge"] .recharge-summary-card strong { font-size: 15px; }
.console-page[data-console-page="recharge"] .recharge-result { min-height: 68px; padding: 9px; font-size: 12px; line-height: 1.5; }
.console-page[data-console-page="recharge"] .topup-order-list { max-height: min(30vh, 220px); }
.console-page[data-console-page="recharge"] .topup-order-row, .console-page[data-console-page="admin"] .topup-order-row { gap: 8px; padding: 9px 10px; border-radius: 11px; }
.console-page[data-console-page="recharge"] .newapi-button, .console-page[data-console-page="recharge"] .newapi-button.slim, .console-page[data-console-page="recharge"] .newapi-input, .console-page[data-console-page="admin"] .newapi-button, .console-page[data-console-page="admin"] .newapi-button.slim, .console-page[data-console-page="admin"] .newapi-input, .console-page[data-console-page="admin"] .newapi-select { font-size: 12px; }
.console-page[data-console-page="admin"] .admin-recent-table-wrap { min-height: 138px; max-height: min(20vh, 180px); }
.console-page[data-console-page="admin"] .admin-summary-strip { gap: 7px; }
.console-page[data-console-page="admin"] .admin-summary-card { padding: 8px 10px; border-radius: 10px; }
.console-page[data-console-page="admin"] .admin-summary-card span { font-size: 11px; letter-spacing: 0px; text-transform: none; }
.console-page[data-console-page="admin"] .admin-summary-card strong { margin-top: 4px; font-size: 15px; }
.console-page[data-console-page="admin"] .admin-account-filter { grid-template-columns: minmax(220px, 1fr) minmax(240px, 0.8fr); gap: 9px; margin: 0px; }
.console-page[data-console-page="admin"] .admin-bulk-expiry { grid-template-columns: minmax(220px, 1fr) auto auto; gap: 8px; margin: 0px; padding: 11px; border-radius: 12px; }
.console-page[data-console-page="admin"] .admin-account-list { gap: 7px; max-height: min(48vh, 560px); overflow: auto; padding: 0px 4px 10px 0px; scrollbar-gutter: stable; }
.console-page[data-console-page="admin"] .admin-account-row { grid-template-columns: minmax(220px, 0.9fr) minmax(300px, 1fr) minmax(390px, 1.34fr); gap: 9px; padding: 9px 10px; border-radius: 12px; }
.console-page[data-console-page="admin"] .admin-account-name strong { font-size: 13px; line-height: 1.2; }
.console-page[data-console-page="admin"] .admin-account-name span, .console-page[data-console-page="admin"] .admin-account-stat span { font-size: 10px; }
.console-page[data-console-page="admin"] .admin-balance-pill { font-size: 11px; }
.console-page[data-console-page="admin"] .admin-account-stats { gap: 4px; }
.console-page[data-console-page="admin"] .admin-account-stat { padding: 5px 6px; border-radius: 8px; }
.console-page[data-console-page="admin"] .admin-account-stat strong { font-size: 12px; }
.console-page[data-console-page="admin"] .admin-account-tools { grid-template-columns: auto minmax(150px, 0.78fr) minmax(230px, 1fr); gap: 6px; }
.console-page[data-console-page="admin"] .admin-balance-form .newapi-input, .console-page[data-console-page="admin"] .admin-account-tools .admin-display-name-form .newapi-input { min-height: 31px; font-size: 12px; }
.console-page[data-console-page="admin"] .admin-account-tools .newapi-button.slim { min-height: 31px; font-size: 11px; }
.console-page[data-console-page="admin"] .recharge-section-title { font-size: 12px; letter-spacing: 0px; text-transform: none; }
@media (max-width: 1180px) {
  .console-page[data-console-page="recharge"] .recharge-grid, .console-page[data-console-page="recharge"] .recharge-jump-layout, .console-page[data-console-page="admin"] .admin-account-row, .console-page[data-console-page="admin"] .admin-account-tools { grid-template-columns: minmax(0px, 1fr); }
  .console-page[data-console-page="admin"] .admin-account-list { max-height: none; overflow: visible; }
}
@media (max-width: 760px) {
  .console-page[data-console-page="recharge"], .console-page[data-console-page="admin"] { padding-right: 0px; }
  .console-page[data-console-page="recharge"] .recharge-balance-panel, .console-page[data-console-page="recharge"] .recharge-plan-grid, .console-page[data-console-page="admin"] .admin-summary-strip, .console-page[data-console-page="admin"] .admin-account-filter, .console-page[data-console-page="admin"] .admin-account-stats, .console-page[data-console-page="admin"] .admin-balance-form, .console-page[data-console-page="admin"] .admin-expiry-form, .console-page[data-console-page="admin"] .admin-bulk-expiry { grid-template-columns: minmax(0px, 1fr); }
  .console-page[data-console-page="admin"] .admin-bulk-selection { grid-template-columns: minmax(0px, 1fr); }
  .console-page[data-console-page="admin"] .admin-bulk-selection .newapi-button, .console-page[data-console-page="admin"] .admin-bulk-selected-count { width: 100%; justify-content: center; justify-self: stretch; }
  .console-page[data-console-page="recharge"] .topup-order-list, .console-page[data-console-page="admin"] .admin-recent-table-wrap { max-height: none; }
}
.newapi-panel .dashboard-leaderboard { min-height: 0px; overflow: hidden; }
.newapi-panel .dashboard-leaderboard .panel-body { min-height: 0px; display: grid; grid-template-rows: auto minmax(0px, 1fr); overflow: hidden; }
.newapi-panel .dashboard-leaderboard .rows { min-height: 0px; max-height: 100%; overflow: hidden auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.stage.console-stage { grid-template-columns: minmax(0px, 1fr); }
.console-gate-card { width: min(860px, 100%); border-color: rgba(79, 167, 222, 0.22); overflow: hidden; box-shadow: rgba(255, 255, 255, 0.78) 0px 0px 0px 1px inset, rgba(71, 101, 142, 0.14) 0px 22px 52px; }
.console-gate-card .newapi-card-body { display: grid; grid-template-columns: minmax(0px, 1.08fr) minmax(300px, 0.92fr); grid-template-areas: "copy form" "copy status"; gap: 10px clamp(22px, 3vw, 38px); align-items: center; padding: clamp(24px, 3vw, 36px); }
.console-gate-copy { grid-area: copy; align-content: center; gap: 10px; }
.console-gate-copy h2 { max-width: 520px; text-wrap: balance; }
.console-gate-copy p { max-width: 520px; }
.console-gate-points { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 4px; }
.console-gate-points span { display: inline-flex; align-items: center; gap: 5px; min-height: 28px; padding: 5px 9px; border: 1px solid rgba(79, 167, 222, 0.16); border-radius: 999px; background: rgba(255, 255, 255, 0.6); color: rgb(72, 105, 133); font-size: 10px; font-weight: 900; white-space: nowrap; }
.console-gate-points span::before { content: ""; width: 7px; height: 7px; flex: 0 0 auto; border-radius: 999px; background: var(--accent2); box-shadow: rgba(126, 207, 186, 0.15) 0px 0px 0px 3px; }
.console-gate-form { grid-area: form; grid-template-columns: minmax(0px, 1fr); align-self: end; gap: 12px; padding: 16px; border: 1px solid rgba(54, 83, 122, 0.13); border-radius: 20px; background: radial-gradient(circle at 100% 0%, rgba(79, 167, 222, 0.12), transparent 36%), rgba(255, 255, 255, 0.62); box-shadow: rgba(255, 255, 255, 0.68) 0px 0px 0px 1px inset; }
.console-gate-label-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.console-gate-label-row span, .console-key-hint { color: rgb(114, 132, 155); font-size: 10px; font-weight: 800; }
.console-key-input-wrap { position: relative; }
.console-key-input-wrap .newapi-input { height: 46px; padding-right: 68px; border-radius: 14px; background: rgba(255, 255, 255, 0.9); }
.console-key-visibility { position: absolute; top: 50%; right: 7px; min-width: 52px; min-height: 32px; translate: 0px -50%; border: 1px solid rgba(79, 167, 222, 0.18); border-radius: 10px; background: rgba(235, 247, 255, 0.92); color: rgb(55, 101, 142); cursor: pointer; font-size: 10px; font-weight: 900; }
.console-gate-form > .newapi-button { width: 100%; min-height: 46px; }
.console-gate-status { grid-area: status; align-self: start; display: flex; align-items: center; gap: 7px; min-height: 24px; padding: 0px 4px; }
.console-gate-status::before { content: ""; width: 8px; height: 8px; flex: 0 0 auto; border-radius: 999px; background: rgb(240, 189, 85); box-shadow: rgba(240, 189, 85, 0.14) 0px 0px 0px 4px; }
.console-gate-status.good { color: rgb(47, 125, 93); }
.console-gate-status.good::before { background: var(--good); box-shadow: rgba(46, 168, 107, 0.13) 0px 0px 0px 4px; }
.console-gate-status.bad { color: rgb(168, 70, 70); }
.console-gate-status.bad::before { background: var(--bad); box-shadow: rgba(225, 107, 107, 0.13) 0px 0px 0px 4px; }
.view-tab:focus-visible, .newapi-button:focus-visible, .console-nav:focus-visible, .console-key-visibility:focus-visible { outline: rgba(79, 167, 222, 0.26) solid 3px; outline-offset: 2px; }
@media (min-width: 981px) {
  body[data-active-view="leaderboard"] .topbar { grid-template-columns: minmax(520px, 0.9fr) minmax(0px, 1.1fr); gap: 8px; }
  body[data-active-view="leaderboard"] .title-copy { display: grid; grid-template-columns: auto minmax(0px, 1fr); align-items: center; gap: 12px; min-height: 50px; }
  body[data-active-view="leaderboard"] .title-copy::after { display: none; }
  body[data-active-view="leaderboard"] h1 { white-space: nowrap; }
  body[data-active-view="leaderboard"] .view-switch { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); width: 100%; }
  body[data-active-view="leaderboard"] .view-tab { width: 100%; min-width: 0px; }
  body[data-active-view="leaderboard"] .stats { gap: 8px; }
  body[data-active-view="leaderboard"] .metric { min-height: 50px; padding: 8px 12px; }
}
@media (max-width: 760px) {
  body[data-active-view="leaderboard"] .title-copy { gap: 8px; padding: 8px 10px; }
  body[data-active-view="leaderboard"] h1 { font-size: 18px; line-height: 1.15; }
  body[data-active-view="leaderboard"] .stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  body[data-active-view="leaderboard"] .metric { grid-template-columns: minmax(0px, 1fr); align-content: center; align-items: start; gap: 3px; min-height: 68px; padding: 9px 10px; }
  body[data-active-view="leaderboard"] .metric .value { justify-content: flex-start; text-align: left; }
  body[data-active-view="leaderboard"] #championName .rank-title { display: none; }
  .console-shell-panel > .panel-head, body[data-active-view="leaderboard"] .console-shell-panel > .panel-head { flex-direction: row; align-items: center; gap: 8px; }
  .console-shell-panel > .panel-head span:last-child, body[data-active-view="leaderboard"] .console-shell-panel > .panel-head span:last-child { align-self: auto; margin-left: auto; text-align: center; }
  .console-gate { place-items: start center; padding: 10px; }
  .console-gate-card .newapi-card-body { grid-template-columns: minmax(0px, 1fr); grid-template-areas: "copy" "form" "status"; gap: 14px; padding: 18px; }
  .console-gate-copy h2 { font-size: clamp(23px, 7vw, 28px); }
  .console-gate-copy p { font-size: 12px; line-height: 1.6; }
  .console-gate-form { padding: 13px; border-radius: 17px; }
  .console-gate-status { min-height: 20px; }
}
@media (max-width: 600px) {
  .console-nav-list { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .console-nav { gap: 5px; padding: 8px 6px; }
  .dashboard-head-actions { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 7px; }
}
@media (max-width: 360px) {
  .console-nav-list { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
  .console-gate-points span { width: 100%; justify-content: center; }
}
.console-page-eyebrow { margin-bottom: 4px; color: rgb(67, 133, 180); font-size: 9px; font-weight: 950; letter-spacing: 0.16em; text-transform: uppercase; }
.console-page[data-console-page="recharge"], .console-page[data-console-page="admin"] { gap: 12px; padding: 0px 4px 18px 0px; overflow: hidden auto; }
.console-page[data-console-page="recharge"].active, .console-page[data-console-page="admin"].active { display: flex; flex-direction: column; align-items: stretch; }
.console-page[data-console-page="recharge"].active > *, .console-page[data-console-page="admin"].active > * { flex: 0 0 auto; }
.recharge-page-hero, .admin-page-hero { min-height: 76px; padding: 14px 16px; border: 1px solid rgba(69, 133, 180, 0.16); border-radius: 18px; background: radial-gradient(circle at 84% 10%, rgba(126, 207, 186, 0.2), transparent 30%), linear-gradient(125deg, rgba(255, 255, 255, 0.96), rgba(239, 248, 255, 0.9)); box-shadow: rgba(58, 96, 137, 0.08) 0px 12px 28px; }
.recharge-page-hero h2, .admin-page-hero h2 { margin: 0px; color: rgb(22, 45, 73); font-size: 22px; line-height: 1.15; letter-spacing: -0.02em; }
.recharge-page-hero span, .admin-page-hero span { display: block; margin-top: 5px; color: rgb(93, 115, 144); font-size: 12px; font-weight: 800; line-height: 1.5; }
.recharge-flow { display: grid; grid-template-columns: auto minmax(30px, 1fr) auto minmax(30px, 1fr) auto; align-items: center; gap: 9px; padding: 0px 14px; }
.recharge-flow-step { display: inline-flex; align-items: center; gap: 7px; color: rgb(109, 128, 153); font-size: 11px; font-weight: 900; white-space: nowrap; }
.recharge-flow-step b { display: inline-grid; width: 25px; height: 25px; place-items: center; border: 1px solid rgba(69, 133, 180, 0.18); border-radius: 50%; background: rgba(255, 255, 255, 0.8); color: rgb(88, 128, 161); font: 900 11px / 1 "Courier New", monospace; }
.recharge-flow-step.active { color: rgb(23, 107, 114); }
.recharge-flow-step.active b { border-color: rgba(47, 159, 186, 0.32); background: linear-gradient(135deg, rgb(74, 169, 219), rgb(101, 200, 178)); color: rgb(255, 255, 255); box-shadow: rgba(47, 159, 186, 0.2) 0px 5px 12px; }
.recharge-flow-line { height: 1px; background: linear-gradient(90deg, rgba(69, 133, 180, 0.28), rgba(126, 207, 186, 0.26)); }
.console-page[data-console-page="recharge"] .recharge-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 12px; align-items: stretch; }
.console-page[data-console-page="recharge"] .newapi-card, .console-page[data-console-page="admin"] .newapi-card { border: 1px solid rgba(65, 104, 145, 0.14); border-radius: 17px; background: rgba(252, 254, 255, 0.92); box-shadow: rgba(65, 96, 132, 0.07) 0px 10px 24px; }
.console-page[data-console-page="recharge"] .newapi-card-head, .console-page[data-console-page="admin"] .newapi-card-head { min-height: 64px; padding: 12px 14px; border-bottom-color: rgba(65, 104, 145, 0.1); }
.recharge-card-heading { min-width: 0px; display: flex; align-items: flex-start; gap: 10px; }
.recharge-step-badge { display: inline-grid; flex: 0 0 auto; width: 32px; height: 32px; place-items: center; border-radius: 10px; background: linear-gradient(135deg, rgba(74, 169, 219, 0.18), rgba(101, 200, 178, 0.22)); color: rgb(38, 121, 156); font: 950 11px / 1 "Courier New", monospace; }
.recharge-step-badge.quiet { background: rgba(232, 241, 250, 0.82); color: rgb(97, 123, 150); }
.console-page[data-console-page="recharge"] .newapi-card-title, .console-page[data-console-page="admin"] .newapi-card-title { color: rgb(23, 47, 76); font-size: 16px; letter-spacing: 0px; }
.console-page[data-console-page="recharge"] .newapi-card-desc, .console-page[data-console-page="admin"] .newapi-card-desc { margin-top: 3px; color: rgb(105, 126, 151); font-size: 11px; line-height: 1.45; }
.console-page[data-console-page="recharge"] .newapi-card-body, .console-page[data-console-page="admin"] .newapi-card-body { gap: 11px; padding: 12px 14px 15px; }
.console-page[data-console-page="recharge"] .recharge-balance-panel { gap: 8px; padding: 9px; border-color: rgba(47, 159, 186, 0.14); background: linear-gradient(135deg, rgba(229, 248, 247, 0.86), rgba(238, 247, 255, 0.84)); }
.console-page[data-console-page="recharge"] .recharge-balance-panel > div { min-height: 66px; display: grid; align-content: center; padding: 9px 10px; background: rgba(255, 255, 255, 0.76); }
.console-page[data-console-page="recharge"] .recharge-balance-panel strong { margin-top: 5px; color: rgb(21, 62, 104); font-size: 19px; }
.recharge-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.recharge-section-head > span { color: rgb(122, 141, 164); font-size: 10px; font-weight: 850; }
.console-page[data-console-page="recharge"] .recharge-plan-grid { gap: 8px; }
.console-page[data-console-page="recharge"] .recharge-plan-card { position: relative; min-height: 88px; padding: 11px; border-color: rgba(65, 104, 145, 0.14); background: rgba(255, 255, 255, 0.78); box-shadow: none; }
.console-page[data-console-page="recharge"] .recharge-plan-card:hover { transform: translateY(-1px); border-color: rgba(74, 169, 219, 0.38); box-shadow: rgba(64, 115, 154, 0.1) 0px 10px 18px; }
.console-page[data-console-page="recharge"] .recharge-plan-card.active { border-color: rgba(47, 159, 186, 0.44); background: linear-gradient(145deg, rgba(229, 248, 247, 0.98), rgba(239, 248, 255, 0.98)); box-shadow: rgba(47, 159, 186, 0.12) 0px 0px 0px 1px inset, rgba(47, 159, 186, 0.1) 0px 9px 20px; }
.console-page[data-console-page="recharge"] .recharge-plan-card.active::after { content: "✓"; position: absolute; top: 8px; right: 9px; display: grid; width: 18px; height: 18px; place-items: center; border-radius: 50%; background: rgb(53, 168, 137); color: rgb(255, 255, 255); font-size: 10px; font-weight: 950; }
.console-page[data-console-page="recharge"] .recharge-plan-card strong { color: rgb(21, 62, 104); font-size: 22px; }
.console-page[data-console-page="recharge"] .recharge-custom-row { grid-template-columns: minmax(0px, 1fr) minmax(120px, 0.36fr); gap: 8px; }
.console-page[data-console-page="recharge"] .recharge-quota-preview { border-color: rgba(74, 169, 219, 0.2); background: rgba(239, 248, 255, 0.82); color: rgb(36, 97, 142); }
.console-page[data-console-page="recharge"] .recharge-method-list { gap: 8px; }
.console-page[data-console-page="recharge"] .recharge-method-card.disabled { display: none; }
.console-page[data-console-page="recharge"] .recharge-method-card { position: relative; min-height: 62px; padding: 11px 42px 11px 12px; border-color: rgba(65, 104, 145, 0.15); background: rgba(255, 255, 255, 0.78); }
.console-page[data-console-page="recharge"] .recharge-method-card.active { border-color: rgba(47, 159, 186, 0.38); background: linear-gradient(135deg, rgba(233, 249, 246, 0.94), rgba(244, 250, 255, 0.94)); }
.console-page[data-console-page="recharge"] .recharge-method-card.active::after { content: "可用"; position: absolute; top: 50%; right: 11px; transform: translateY(-50%); padding: 4px 7px; border-radius: 999px; background: rgba(47, 159, 186, 0.12); color: rgb(23, 117, 101); font-size: 9px; font-weight: 950; }
.console-page[data-console-page="recharge"] .recharge-summary-card { padding: 12px 13px; border-color: rgba(74, 169, 219, 0.22); background: radial-gradient(circle at 94% 12%, rgba(126, 207, 186, 0.22), transparent 30%), linear-gradient(135deg, rgba(236, 247, 255, 0.96), rgba(246, 252, 255, 0.96)); }
.console-page[data-console-page="recharge"] .recharge-summary-card strong { margin-top: 6px; color: rgb(20, 63, 105); font-size: 17px; }
.recharge-primary-actions { display: grid; grid-template-columns: minmax(150px, 1fr) auto auto; align-items: stretch; }
.recharge-primary-actions .newapi-button { min-height: 38px; justify-content: center; }
#newApiRechargeOpenButton:disabled { display: none; }
.console-page[data-console-page="recharge"] .recharge-result { min-height: 62px; margin: 0px; border-style: solid; background: rgba(247, 250, 254, 0.94); color: rgb(83, 108, 136); }
.recharge-orders-card { margin-top: 0px; }
.recharge-orders-card .topup-order-list { max-height: 250px; }
.console-page[data-console-page="admin"] .admin-overview-strip { gap: 9px; min-height: 72px; }
.console-page[data-console-page="admin"] .admin-overview-strip .admin-summary-card { min-height: 72px; display: grid; align-content: center; padding: 10px 12px; border-color: rgba(69, 133, 180, 0.14); background: radial-gradient(circle at 88% 8%, rgba(126, 207, 186, 0.16), transparent 34%), rgba(250, 253, 255, 0.94); }
.console-page[data-console-page="admin"] .admin-overview-strip .admin-summary-card strong { margin-top: 6px; color: rgb(21, 62, 104); font-size: 18px; }
.admin-section { min-height: 0px; }
.admin-section-head { align-items: center; }
.admin-section-chip { flex: 0 0 auto; padding: 5px 8px; border: 1px solid rgba(69, 133, 180, 0.13); border-radius: 999px; background: rgba(236, 246, 253, 0.84); color: rgb(93, 120, 149); font: 900 9px / 1 "Courier New", monospace; letter-spacing: 0.08em; }
.console-page[data-console-page="admin"] .admin-account-filter { grid-template-columns: minmax(0px, 1fr) minmax(220px, 0.58fr); gap: 9px; margin: 0px; }
.admin-filter-field { min-width: 0px; display: grid; gap: 5px; }
.admin-filter-field > span { color: rgb(96, 120, 149); font-size: 10px; font-weight: 900; }
.admin-filter-field .newapi-input, .admin-filter-field .newapi-select { min-height: 38px; font-size: 12px; }
.admin-bulk-panel { border: 1px solid rgba(65, 104, 145, 0.12); border-radius: 13px; background: linear-gradient(135deg, rgba(248, 251, 255, 0.96), rgba(239, 248, 255, 0.78)); overflow: hidden; }
.admin-bulk-panel > summary { min-height: 40px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 8px 11px; color: rgb(41, 77, 112); font-size: 11px; font-weight: 950; cursor: pointer; list-style: none; user-select: none; }
.admin-bulk-panel > summary::-webkit-details-marker { display: none; }
.admin-bulk-panel > summary::before { content: "+"; display: inline-grid; width: 20px; height: 20px; margin-right: 2px; place-items: center; border-radius: 7px; background: rgba(74, 169, 219, 0.12); color: rgb(57, 125, 167); font: 900 15px / 1 "Courier New", monospace; }
.admin-bulk-panel[open] > summary::before { content: "−"; }
.admin-bulk-panel > summary > span:first-of-type { margin-right: auto; }
.admin-bulk-panel .admin-bulk-selected-count { min-height: 26px; margin: 0px; padding: 0px 8px; justify-self: auto; }
.console-page[data-console-page="admin"] .admin-bulk-expiry { grid-template-columns: minmax(210px, 1fr) auto auto; gap: 7px; margin: 0px; padding: 10px 11px 12px; border-width: 1px 0px 0px; border-style: solid none none; border-color: rgba(65, 104, 145, 0.1) currentcolor currentcolor; border-image: initial; border-radius: 0px; background: rgba(255, 255, 255, 0.52); }
.console-page[data-console-page="admin"] .admin-bulk-selection { grid-template-columns: auto auto; justify-content: start; }
.console-page[data-console-page="admin"] .admin-account-list { gap: 8px; max-height: 480px; overflow: hidden auto; padding: 1px 5px 7px 1px; scrollbar-gutter: stable; }
.console-page[data-console-page="admin"] .admin-account-list:has(.admin-account-detail-page) { max-height: none; overflow: visible; padding-right: 1px; }
.console-page[data-console-page="admin"] .admin-accounts-section:has(.admin-account-detail-page) .admin-account-filter, .console-page[data-console-page="admin"] .admin-accounts-section:has(.admin-account-detail-page) .admin-bulk-panel { display: none; }
.console-page[data-console-page="admin"] .admin-account-row { grid-template-columns: minmax(220px, 0.9fr) minmax(320px, 1.15fr) minmax(170px, 0.55fr); gap: 10px; min-height: 84px; padding: 10px 11px; border: 1px solid rgba(65, 104, 145, 0.12); border-radius: 13px; background: rgba(250, 253, 255, 0.9); }
.console-page[data-console-page="admin"] .admin-account-row.clickable:hover { transform: translateY(-1px); border-color: rgba(74, 169, 219, 0.34); box-shadow: rgba(60, 104, 145, 0.1) 0px 10px 22px; }
.console-page[data-console-page="admin"] .admin-account-head { gap: 9px; }
.console-page[data-console-page="admin"] .admin-account-select { width: 30px; height: 30px; }
.console-page[data-console-page="admin"] .admin-account-name { grid-template-columns: minmax(0px, 1fr) auto; align-items: center; gap: 4px 7px; }
.console-page[data-console-page="admin"] .admin-account-name strong { grid-column: 1 / -1; font-size: 14px; line-height: 1.25; }
.console-page[data-console-page="admin"] .admin-account-id { max-width: 150px; padding: 3px 7px; font-size: 9px; }
.console-page[data-console-page="admin"] .admin-balance-pill { padding: 3px 7px; font-size: 10px; }
.console-page[data-console-page="admin"] .admin-account-stats { gap: 5px; }
.console-page[data-console-page="admin"] .admin-account-stat { min-height: 52px; align-content: center; padding: 6px 7px; border-color: rgba(65, 104, 145, 0.09); background: rgba(255, 255, 255, 0.7); }
.console-page[data-console-page="admin"] .admin-account-stat span { font-size: 9px; }
.console-page[data-console-page="admin"] .admin-account-stat strong { margin-top: 2px; font-size: 12px; }
.console-page[data-console-page="admin"] .admin-account-row-actions { display: grid; grid-template-columns: minmax(0px, 1fr); gap: 7px; align-content: center; }
.admin-account-expiry { min-width: 0px; display: grid; gap: 3px; padding: 7px 9px; border: 1px solid rgba(65, 104, 145, 0.1); border-radius: 9px; background: rgba(255, 255, 255, 0.66); }
.admin-account-expiry-label { color: rgb(115, 134, 157); font-size: 9px; font-weight: 900; }
.admin-account-expiry strong { overflow: hidden; color: rgb(49, 93, 128); font-size: 10px; font-weight: 950; text-overflow: ellipsis; white-space: nowrap; }
.admin-account-expiry.expired { border-color: rgba(218, 100, 100, 0.2); background: rgba(255, 242, 242, 0.78); }
.admin-account-expiry.expired strong { color: rgb(165, 76, 76); }
.console-page[data-console-page="admin"] .admin-detail-toggle { width: 100%; min-height: 32px; justify-content: center; }
.console-page[data-console-page="admin"] .admin-activity-section .newapi-card-body { padding-top: 10px; }
.console-page[data-console-page="admin"] .admin-recent-table-wrap { min-height: 220px; max-height: 270px; border-radius: 12px; overflow: auto; }
.console-page[data-console-page="admin"] .admin-recent-table-wrap .usage-log-table { min-width: 980px; }
.console-page[data-console-page="admin"] .admin-recent-table-wrap .usage-log-table thead { position: sticky; top: 0px; z-index: 2; }
.console-page[data-console-page="admin"] .admin-recent-table-wrap .usage-log-table th, .console-page[data-console-page="admin"] .admin-recent-table-wrap .usage-log-table td { height: 39px; padding: 7px 8px; text-align: center; vertical-align: middle; }
.console-page[data-console-page="admin"] .admin-recent-table-wrap .usage-log-table td:nth-child(2), .console-page[data-console-page="admin"] .admin-recent-table-wrap .usage-log-table td:nth-child(6) { max-width: 160px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.console-page[data-console-page="admin"] .admin-orders-section .topup-order-list { max-height: 260px; }
.console-page[data-console-page="admin"] .admin-account-detail-page { padding: 15px; border-radius: 15px; box-shadow: none; }
.console-page[data-console-page="admin"] .admin-account-tools-panel, .console-page[data-console-page="admin"] .admin-account-tool-card { border-radius: 13px; box-shadow: none; }
.console-page[data-console-page="admin"] .admin-recent-call-panel { min-height: 0px; align-content: start; overflow: hidden; }
.console-page[data-console-page="admin"] .admin-recent-call-list { max-height: clamp(340px, 46vh, 520px); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; scrollbar-width: thin; scrollbar-color: rgba(54, 83, 122, 0.28) transparent; align-content: start; padding: 1px 5px 1px 1px; }
.console-page[data-console-page="admin"] .admin-recent-call-list::-webkit-scrollbar { width: 7px; }
.console-page[data-console-page="admin"] .admin-recent-call-list::-webkit-scrollbar-thumb { border-radius: 999px; background: rgba(54, 83, 122, 0.24); }
.console-page[data-console-page="admin"] .admin-recent-call-list .call-recent-row { border-radius: 13px; box-shadow: none; }
@media (max-width: 1180px) {
  .console-page[data-console-page="admin"] .admin-account-row { grid-template-columns: minmax(210px, 0.8fr) minmax(300px, 1.2fr); }
  .console-page[data-console-page="admin"] .admin-account-row-actions { grid-column: 1 / -1; grid-template-columns: minmax(0px, 1fr) minmax(140px, 0.34fr); }
}
@media (max-width: 760px) {
  .recharge-page-hero, .admin-page-hero { align-items: stretch; padding: 13px; }
  .recharge-page-hero .newapi-button, .admin-page-hero .newapi-button { width: 100%; justify-content: center; }
  .recharge-flow { grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 5px; padding: 0px; }
  .recharge-flow-line { display: none; }
  .recharge-flow-step { justify-content: center; gap: 5px; font-size: 9px; text-align: center; white-space: normal; }
  .console-page[data-console-page="recharge"] .recharge-grid, .console-page[data-console-page="admin"] .admin-account-filter, .console-page[data-console-page="admin"] .admin-account-row, .console-page[data-console-page="admin"] .admin-account-row-actions, .console-page[data-console-page="admin"] .admin-bulk-expiry { grid-template-columns: minmax(0px, 1fr); }
  .console-page[data-console-page="recharge"] .recharge-balance-panel, .console-page[data-console-page="recharge"] .recharge-plan-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
  .console-page[data-console-page="recharge"] .recharge-custom-row, .recharge-primary-actions, .console-page[data-console-page="admin"] .admin-account-stats { grid-template-columns: minmax(0px, 1fr); }
  .console-page[data-console-page="admin"] .admin-account-list { max-height: none; overflow: visible; }
  .console-page[data-console-page="admin"] .admin-account-row-actions { grid-column: auto; }
  .console-page[data-console-page="admin"] .admin-account-tools-grid, .console-page[data-console-page="admin"] .admin-account-detail-grid { grid-template-columns: minmax(0px, 1fr); }
  .model-access-toolbar { grid-template-columns: 1fr; }
  .console-page[data-console-page="admin"] .admin-recent-call-list { max-height: min(52vh, 420px); }
}
@media (max-width: 520px) {
  .console-page[data-console-page="recharge"] .recharge-balance-panel, .console-page[data-console-page="recharge"] .recharge-plan-grid { grid-template-columns: minmax(0px, 1fr); }
  .recharge-section-head, .admin-section-head { align-items: flex-start; flex-direction: column; }
  .admin-section-chip { display: none; }
  .console-page[data-console-page="admin"] .admin-recent-call-list { max-height: 360px; }
}
.announcement-toast { position: fixed; top: 18px; right: 18px; z-index: 1200; width: min(390px, -28px + 100vw); overflow: hidden; border: 1px solid rgba(74, 128, 173, 0.24); border-radius: 18px; background: rgba(250, 253, 255, 0.97); box-shadow: rgba(22, 48, 78, 0.24) 0px 22px 56px; color: rgb(23, 54, 91); }
.announcement-toast[hidden] { display: none; }
.announcement-toast-accent { height: 4px; background: linear-gradient(90deg, rgb(63, 143, 212), rgb(112, 188, 232)); }
.announcement-toast.warning .announcement-toast-accent { background: linear-gradient(90deg, rgb(216, 138, 47), rgb(240, 191, 85)); }
.announcement-toast.success .announcement-toast-accent { background: linear-gradient(90deg, rgb(45, 154, 103), rgb(102, 201, 150)); }
.announcement-toast-head, .announcement-toast-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.announcement-toast-head { padding: 15px 16px 8px; }
.announcement-toast-head > div { display: grid; gap: 3px; min-width: 0px; }
.announcement-toast-head strong { overflow: hidden; font-size: 16px; text-overflow: ellipsis; white-space: nowrap; }
.announcement-toast-kicker { color: rgb(105, 133, 164); font-size: 9px; font-weight: 950; letter-spacing: 0.14em; }
.announcement-toast-close { width: 30px; height: 30px; border: 0px; border-radius: 9px; background: rgba(64, 105, 145, 0.08); color: rgb(89, 119, 149); cursor: pointer; font-size: 20px; line-height: 1; }
.announcement-toast-content { max-height: min(36vh, 280px); overflow: auto; padding: 7px 16px 14px; color: rgb(56, 87, 116); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; white-space: pre-wrap; }
.announcement-toast-foot { padding: 11px 16px 14px; border-top: 1px solid rgba(77, 128, 170, 0.12); background: rgba(239, 247, 252, 0.66); }
.announcement-toast-foot > span { color: rgb(120, 144, 168); font-size: 10px; font-weight: 800; }
.console-page[data-console-page="admin"] { gap: 10px; }
.console-page[data-console-page="admin"] .admin-page-hero { min-height: 0px; padding: 12px 14px; }
.console-page[data-console-page="admin"] .admin-page-hero h2 { margin: 1px 0px 2px; font-size: 20px; }
.console-page[data-console-page="admin"] .admin-overview-strip { gap: 8px; }
.console-page[data-console-page="admin"] .admin-overview-strip .admin-summary-card { min-height: 58px; padding: 9px 11px; }
.admin-workspace-tabs { position: sticky; top: 0px; z-index: 8; display: flex; gap: 6px; overflow-x: auto; padding: 6px; border: 1px solid rgba(75, 128, 171, 0.14); border-radius: 13px; background: rgba(244, 249, 253, 0.94); box-shadow: rgba(38, 70, 102, 0.08) 0px 8px 20px; scrollbar-width: none; }
.admin-workspace-tabs::-webkit-scrollbar { display: none; }
.admin-workspace-tab { flex: 1 0 auto; min-height: 34px; padding: 7px 13px; border: 1px solid transparent; border-radius: 9px; background: transparent; color: rgb(88, 117, 146); cursor: pointer; font-size: 11px; font-weight: 900; white-space: nowrap; }
.admin-workspace-tab:hover { background: rgba(74, 137, 187, 0.08); color: rgb(36, 90, 134); }
.admin-workspace-tab.active { border-color: rgba(47, 122, 182, 0.2); background: linear-gradient(135deg, rgb(52, 127, 186), rgb(78, 158, 213)); box-shadow: rgba(46, 118, 173, 0.2) 0px 6px 14px; color: rgb(255, 255, 255); }
[data-admin-panel][hidden] { display: none; }
.console-page[data-console-page="admin"] .admin-account-list { min-height: 260px; max-height: clamp(360px, 55vh, 640px); overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.console-page[data-console-page="admin"] .admin-recent-table-wrap, .console-page[data-console-page="admin"] .admin-orders-section .topup-order-list { max-height: clamp(360px, 58vh, 650px); }
.admin-pricing-toolbar { display: grid; grid-template-columns: minmax(220px, 1fr) auto; align-items: center; gap: 10px; margin-bottom: 10px; }
.admin-model-disable-section .admin-pricing-toolbar { grid-template-columns: minmax(180px, 1fr) auto auto auto; }
@media (max-width: 820px) {
  .admin-model-disable-section .admin-pricing-toolbar { grid-template-columns: 1fr; }
}
.admin-pricing-status { color: rgb(100, 128, 154); font-size: 10px; font-weight: 900; white-space: nowrap; }
.admin-pricing-list { display: grid; align-content: start; gap: 7px; min-height: 280px; max-height: clamp(380px, 60vh, 680px); overflow: auto; padding-right: 5px; overscroll-behavior: contain; scrollbar-gutter: stable; }
.admin-pricing-row { display: grid; grid-template-columns: minmax(170px, 1.1fr) minmax(230px, 1.5fr) minmax(126px, 0.55fr) auto; align-items: center; gap: 10px; min-height: 62px; padding: 9px 10px; border: 1px solid rgba(71, 127, 171, 0.14); border-radius: 12px; background: rgba(250, 253, 255, 0.8); }
.admin-model-disable-section .admin-pricing-row { grid-template-columns: minmax(180px, 1.2fr) minmax(240px, 1.6fr) auto; }
.admin-pricing-row.is-disabled-model { border-color: rgba(220, 88, 88, 0.28); background: rgba(255, 244, 244, 0.92); }
.admin-pricing-model, .admin-pricing-effective { display: grid; gap: 3px; min-width: 0px; }
.admin-pricing-model strong, .admin-pricing-effective strong { overflow: hidden; color: rgb(36, 79, 117); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.admin-pricing-model span, .admin-pricing-effective span { overflow: hidden; color: rgb(117, 144, 168); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.admin-pricing-discount { display: grid; grid-template-columns: minmax(70px, 1fr) auto; align-items: center; gap: 6px; }
.admin-pricing-discount .newapi-input { min-width: 0px; text-align: center; font-variant-numeric: tabular-nums; }
.admin-pricing-discount span { color: rgb(95, 123, 150); font-size: 11px; font-weight: 900; }
.admin-pricing-actions { display: flex; gap: 6px; }
.admin-announcement-layout { display: grid; grid-template-columns: minmax(320px, 0.85fr) minmax(360px, 1.15fr); gap: 12px; min-height: 0px; }
.admin-announcement-form, .admin-announcement-list { min-width: 0px; border: 1px solid rgba(73, 129, 173, 0.14); border-radius: 13px; background: rgba(249, 252, 255, 0.72); }
.admin-announcement-form { display: grid; align-content: start; gap: 9px; padding: 11px; }
.admin-announcement-form-row { display: grid; grid-template-columns: minmax(0px, 1fr) 126px; gap: 8px; }
.admin-announcement-content { min-height: 160px; resize: vertical; line-height: 1.6; }
.admin-announcement-form-actions { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.admin-announcement-form-actions span { color: rgb(111, 136, 159); font-size: 10px; font-weight: 800; }
.admin-announcement-list { display: grid; align-content: start; gap: 8px; max-height: clamp(330px, 54vh, 590px); overflow: auto; padding: 10px; overscroll-behavior: contain; }
.admin-announcement-item { display: grid; grid-template-columns: minmax(0px, 1fr) auto; gap: 10px; padding: 10px 11px; border: 1px solid rgba(73, 129, 173, 0.14); border-radius: 11px; background: rgb(255, 255, 255); }
.admin-announcement-item.inactive { opacity: 0.62; }
.admin-announcement-main { display: grid; gap: 4px; min-width: 0px; }
.admin-announcement-main strong { color: rgb(37, 79, 116); font-size: 12px; }
.admin-announcement-main p { display: -webkit-box; overflow: hidden; margin: 0px; color: rgb(95, 120, 144); font-size: 11px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.admin-announcement-meta { color: rgb(132, 153, 173); font-size: 9px; }
.usage-log-discount { display: inline-flex; justify-content: center; min-width: 44px; padding: 3px 7px; border: 1px solid rgba(47, 126, 186, 0.16); border-radius: 999px; background: rgba(224, 242, 255, 0.72); color: rgb(46, 111, 159); font-size: 10px; font-weight: 950; font-variant-numeric: tabular-nums; }
.usage-log-discount.full { border-color: rgba(96, 122, 145, 0.12); background: rgba(235, 240, 244, 0.72); color: rgb(109, 129, 147); }
.usage-log-table { min-width: 1040px; }
@media (max-width: 920px) {
  .admin-pricing-row { grid-template-columns: minmax(150px, 1fr) minmax(180px, 1.1fr) minmax(120px, 0.55fr); }
  .admin-pricing-actions { grid-column: 1 / -1; justify-content: flex-end; }
  .admin-announcement-layout { grid-template-columns: minmax(0px, 1fr); }
}
@media (max-width: 620px) {
  .announcement-toast { top: 10px; right: 10px; width: calc(-20px + 100vw); }
  .admin-workspace-tab { flex: 0 0 auto; }
  .admin-pricing-toolbar, .admin-pricing-row, .admin-announcement-form-row { grid-template-columns: minmax(0px, 1fr); }
  .admin-pricing-actions { grid-column: auto; }
  .console-page[data-console-page="admin"] .admin-account-list, .console-page[data-console-page="admin"] .admin-pricing-list, .console-page[data-console-page="admin"] .admin-announcement-list { max-height: 58vh; overflow: auto; }
}
body.admin-workspace-open .scene { opacity: 0.16; }
body.admin-workspace-open .app { inset: 0px; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 0px; box-shadow: none; background: rgba(248, 252, 255, 0.97); grid-template-rows: minmax(0px, 1fr); }
body.admin-workspace-open .topbar { display: none; }
body.admin-workspace-open .console-stage { padding: 0px; }
body.admin-workspace-open .console-shell-panel { border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; border-radius: 0px; box-shadow: none; }
body.admin-workspace-open .console-shell-panel > .panel-head { display: none; }
body.admin-workspace-open .newapi-panel.console-shell-panel .panel-body { padding: 0px; }
body.admin-workspace-open .console-shell { gap: 0px; height: 100%; }
body.admin-workspace-open .console-sidebar { border-width: medium 1px medium medium; border-style: none solid none none; border-color: currentcolor rgba(54, 83, 122, 0.14) currentcolor currentcolor; border-image: initial; border-radius: 0px; }
body.admin-workspace-open .console-content { height: 100%; }
body.admin-workspace-open .console-page[data-console-page="admin"].active { height: 100%; padding: 12px 14px 14px; overflow: hidden; }
.console-page[data-console-page="admin"] [data-admin-panel="ops"] { flex: 1 1 auto; min-height: 0px; display: flex; flex-direction: column; overflow: hidden; background: transparent; border-width: medium; border-style: none; border-color: currentcolor; border-image: initial; box-shadow: none; }
#yelanOpsRoot { flex: 1 1 auto; min-width: 0px; min-height: 0px; height: 100%; }
.console-page[data-console-page="admin"]:has([data-admin-panel="ops"]:not([hidden])) .admin-page-hero, .console-page[data-console-page="admin"]:has([data-admin-panel="ops"]:not([hidden])) .admin-overview-strip { display: none; }
@media (max-width: 760px) {
  body.admin-workspace-open .console-page[data-console-page="admin"].active { overflow: auto; }
  body.admin-workspace-open .console-sidebar { border-right-width: medium; border-right-style: none; border-right-color: currentcolor; border-bottom: 1px solid rgba(54, 83, 122, 0.14); }
}
body.ui-v2 :is(button, input, select, textarea) { font-family: inherit; }
body.ui-v2 :is(.metric .value, .newapi-metric strong, .usage-query-card strong, .admin-summary-card strong, .admin-account-stat strong, .score, .pill, .usage-log-table, .newapi-snippet, .newapi-result, .newapi-usage-result, .console-nav-icon, .admin-account-id, .usage-log-page-info) { font-family: SFMono-Regular, "Cascadia Code", "Roboto Mono", Consolas, monospace; font-variant-numeric: tabular-nums; }
.ui-v2[data-ui-parallax="active"] .scene-image { }
.ui-v2 .topbar, .ui-v2[data-active-view="leaderboard"] .topbar, .ui-v2[data-active-view="frontier-news"] .topbar, .ui-v2[data-active-view="new-api"] .topbar { display: grid; grid-template-columns: minmax(420px, 0.78fr) minmax(480px, 1.22fr); align-items: stretch; gap: 0px; min-height: 58px; padding: 0px; border-bottom: 1px solid var(--ui-line); background: rgba(248, 249, 245, 0.98); }
.ui-v2 .title-copy, .ui-v2[data-active-view="leaderboard"] .title-copy, .ui-v2[data-active-view="frontier-news"] .title-copy, .ui-v2[data-active-view="new-api"] .title-copy { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; gap: 16px; min-width: 0px; min-height: 58px; padding: 0px 16px; border: 0px; border-radius: 0px; background: transparent; box-shadow: none; overflow: visible; }
.ui-v2 h1, .ui-v2[data-active-view="leaderboard"] h1 { display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; margin: 0px; color: var(--ui-ink); font-size: 17px; line-height: 1; white-space: nowrap; text-shadow: none; }
body.ui-v2[data-active-view="frontier-news"] .title-copy h1 { display: inline-flex; }
.ui-v2 .view-switch, .ui-v2[data-active-view="leaderboard"] .view-switch, .ui-v2[data-active-view="frontier-news"] .view-switch, .ui-v2[data-active-view="new-api"] .view-switch { display: grid; grid-template-columns: repeat(2, minmax(96px, 1fr)); align-items: center; gap: 2px; width: min(250px, 100%); min-width: 210px; padding: 3px; border: 1px solid var(--ui-line); border-radius: 6px; background: var(--ui-surface-soft); box-shadow: none; }
.ui-v2 .view-tab, .ui-v2[data-active-view="leaderboard"] .view-tab, .ui-v2[data-active-view="frontier-news"] .view-tab, .ui-v2[data-active-view="new-api"] .view-tab { width: 100%; min-width: 0px; min-height: 32px; padding: 6px 10px; border: 0px; border-radius: 4px; color: var(--ui-muted); background: transparent; font-size: 12px; font-weight: 750; transform: none; }
.ui-v2 .stats, .ui-v2[data-active-view="leaderboard"] .stats, .ui-v2[data-active-view="frontier-news"] .stats, .ui-v2[data-active-view="new-api"] .stats { display: grid; grid-template-columns: minmax(110px, 0.65fr) minmax(150px, 0.8fr) minmax(230px, 1.25fr); align-items: stretch; gap: 0px; min-width: 0px; border-left: 1px solid var(--ui-line); }
.ui-v2 .metric, .ui-v2[data-active-view="leaderboard"] .metric { display: grid; grid-template-columns: auto minmax(0px, 1fr); align-items: center; gap: 10px; min-width: 0px; min-height: 57px; padding: 8px 14px; border-top: 0px; border-bottom: 0px; border-left: 0px; border-image: initial; border-right: 1px solid var(--ui-line); border-radius: 0px; background: transparent; box-shadow: none; transform: none; }
.ui-v2 .metric .label, .ui-v2[data-active-view="leaderboard"] .metric .label { color: var(--ui-faint); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.ui-v2 .metric .value, .ui-v2[data-active-view="leaderboard"] .metric .value { display: inline-flex; align-items: center; justify-content: flex-end; min-width: 0px; margin: 0px; color: var(--ui-cyan-dark); font-size: 16px; font-weight: 800; text-align: right; }
.ui-v2 .panel-head, .ui-v2[data-active-view="leaderboard"] .console-shell-panel > .panel-head { min-height: 36px; padding: 7px 14px; border-top: 0px; border-right: 0px; border-left: 0px; border-image: initial; border-bottom: 1px solid var(--ui-line); border-radius: 0px; color: var(--ui-muted); background: var(--ui-surface); font-size: 11px; font-weight: 800; text-transform: none; }
.ui-v2 .panel-head span:last-child, .ui-v2[data-active-view="leaderboard"] .console-shell-panel > .panel-head span:last-child { min-height: 22px; padding: 3px 8px; border: 1px solid rgb(227, 201, 132); border-radius: 999px; color: rgb(138, 101, 29); background: var(--ui-amber-soft); font-size: 10px; font-weight: 800; }
.ui-v2 :is(.newapi-input, .newapi-select, .newapi-textarea, .search-input) { min-height: 38px; border: 1px solid var(--ui-line-strong); border-radius: 5px; color: var(--ui-ink); background: rgb(255, 255, 255); box-shadow: none; font-size: 12px; }
.ui-v2 :is(.newapi-input, .newapi-select, .newapi-textarea, .search-input):focus { border-color: var(--ui-cyan); outline: 0px; box-shadow: rgba(36, 127, 145, 0.13) 0px 0px 0px 3px; }
.ui-v2 :is(.view-tab, .newapi-button, .console-nav, .console-key-visibility, .admin-workspace-tab, .usage-log-page-button, .recharge-plan-card, .recharge-method-card, .news-filter-button, .agent-suggestion-chip, .refresh-button, .search-button):focus-visible { outline: rgba(36, 127, 145, 0.28) solid 3px; outline-offset: 2px; }
.ui-v2 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat) { border: 1px solid var(--ui-line); border-radius: 5px; background: var(--ui-surface); box-shadow: none; }
.ui-v2 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat) span { color: var(--ui-faint); text-transform: none; }
.ui-v2 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat) strong { color: var(--ui-cyan-dark); }
@media (max-width: 1240px) {
  .ui-v2 .topbar, .ui-v2[data-active-view="leaderboard"] .topbar, .ui-v2[data-active-view="frontier-news"] .topbar { grid-template-columns: minmax(400px, 0.9fr) minmax(420px, 1.1fr); }
}
@media (max-width: 980px) {
  .ui-v2 .topbar, .ui-v2[data-active-view="leaderboard"] .topbar, .ui-v2[data-active-view="frontier-news"] .topbar { grid-template-columns: minmax(0px, 1fr); min-height: 112px; }
  .ui-v2 .title-copy, .ui-v2[data-active-view="leaderboard"] .title-copy, .ui-v2[data-active-view="frontier-news"] .title-copy { min-height: 56px; }
  .ui-v2 .stats, .ui-v2[data-active-view="leaderboard"] .stats, .ui-v2[data-active-view="frontier-news"] .stats { min-height: 56px; border-top: 1px solid var(--ui-line); border-left: 0px; }
  .ui-v2 .metric, .ui-v2[data-active-view="leaderboard"] .metric { min-height: 55px; }
}
@media (max-width: 760px) {
  .ui-v2 .title-copy, .ui-v2[data-active-view="leaderboard"] .title-copy, .ui-v2[data-active-view="frontier-news"] .title-copy { gap: 10px; padding: 0px 10px; }
  .ui-v2 h1, .ui-v2[data-active-view="leaderboard"] h1 { font-size: 15px; }
  .ui-v2 .view-switch, .ui-v2[data-active-view="leaderboard"] .view-switch, .ui-v2[data-active-view="frontier-news"] .view-switch { min-width: 0px; width: min(280px, 100%); }
}
@media (max-width: 560px) {
  .ui-v2 .topbar, .ui-v2[data-active-view="leaderboard"] .topbar, .ui-v2[data-active-view="frontier-news"] .topbar { min-height: 145px; }
  .ui-v2 .title-copy, .ui-v2[data-active-view="leaderboard"] .title-copy, .ui-v2[data-active-view="frontier-news"] .title-copy { display: grid; grid-template-columns: minmax(0px, 1fr); gap: 8px; min-height: 88px; padding: 9px 10px; }
  .ui-v2 h1, .ui-v2[data-active-view="leaderboard"] h1 { font-size: 16px; }
  .ui-v2 .view-switch, .ui-v2[data-active-view="leaderboard"] .view-switch, .ui-v2[data-active-view="frontier-news"] .view-switch { width: 100%; }
  .ui-v2 .stats, .ui-v2[data-active-view="leaderboard"] .stats, .ui-v2[data-active-view="frontier-news"] .stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); min-height: 57px; }
  .ui-v2 .metric, .ui-v2[data-active-view="leaderboard"] .metric { grid-template-columns: minmax(0px, 1fr); align-content: center; align-items: start; gap: 2px; min-height: 56px; padding: 6px 9px; }
  .ui-v2 .metric .value, .ui-v2[data-active-view="leaderboard"] .metric .value { justify-content: flex-start; font-size: 14px; text-align: left; }
  .ui-v2[data-active-view="leaderboard"] #championName .rank-title { display: none; }
  .ui-v2 .panel-head, .ui-v2[data-active-view="leaderboard"] .console-shell-panel > .panel-head { min-height: 34px; padding: 6px 9px; }
}
@media (max-height: 700px) and (min-width: 981px) {
}
@media (prefers-reduced-motion: reduce) {
}
.ui-v3[data-ui-parallax="active"] .scene-image { transform: translate3d(var(--ui-scene-x), var(--ui-scene-y), 0) scale(1.025); }
.ui-v3 .topbar, .ui-v3[data-active-view="leaderboard"] .topbar, .ui-v3[data-active-view="frontier-news"] .topbar, .ui-v3[data-active-view="new-api"] .topbar { grid-template-columns: minmax(500px, 0.88fr) minmax(470px, 1.12fr); min-height: 64px; border-bottom: 1px solid var(--pf-line-strong); background: var(--pf-paper); }
.ui-v3 .title-copy, .ui-v3[data-active-view="leaderboard"] .title-copy, .ui-v3[data-active-view="frontier-news"] .title-copy, .ui-v3[data-active-view="new-api"] .title-copy { gap: 20px; min-height: 63px; padding: 0px 18px; }
.ui-v3 h1, .ui-v3[data-active-view="leaderboard"] h1 { position: relative; gap: 12px; color: var(--pf-ink); font-size: 18px; font-weight: 900; }
.ui-v3 .view-switch, .ui-v3[data-active-view="leaderboard"] .view-switch, .ui-v3[data-active-view="frontier-news"] .view-switch, .ui-v3[data-active-view="new-api"] .view-switch { position: relative; grid-template-columns: repeat(2, minmax(104px, 1fr)); width: min(270px, 100%); min-width: 230px; padding: 3px; border: 1px solid var(--pf-line); border-radius: 3px; background: rgb(232, 237, 230); }
.ui-v3 .view-tab, .ui-v3[data-active-view="leaderboard"] .view-tab, .ui-v3[data-active-view="frontier-news"] .view-tab, .ui-v3[data-active-view="new-api"] .view-tab { min-height: 34px; border-radius: 2px; color: var(--pf-muted); font-size: 12px; }
.ui-v3 .stats, .ui-v3[data-active-view="leaderboard"] .stats, .ui-v3[data-active-view="frontier-news"] .stats, .ui-v3[data-active-view="new-api"] .stats { grid-template-columns: minmax(110px, 0.55fr) minmax(160px, 0.78fr) minmax(230px, 1.2fr); min-height: 63px; border-left: 1px solid var(--pf-line); }
.ui-v3 .metric, .ui-v3[data-active-view="leaderboard"] .metric { position: relative; min-height: 63px; padding: 9px 15px; border-right: 1px solid var(--pf-line); background: transparent; }
.ui-v3 .metric .label, .ui-v3[data-active-view="leaderboard"] .metric .label { color: var(--pf-muted); font-size: 9px; }
.ui-v3 .metric .value, .ui-v3[data-active-view="leaderboard"] .metric .value { color: var(--pf-teal-dark); font-size: 16px; }
.ui-v3 .panel-head, .ui-v3[data-active-view="leaderboard"] .console-shell-panel > .panel-head { position: relative; z-index: 8; min-height: 36px; padding: 7px 14px; border-bottom: 1px solid var(--pf-line-strong); color: var(--pf-muted); background: rgba(247, 248, 241, 0.98); font-size: 10px; }
.ui-v3 .panel-head span:last-child, .ui-v3[data-active-view="leaderboard"] .console-shell-panel > .panel-head span:last-child { min-height: 22px; border: 1px solid rgb(216, 191, 99); border-radius: 3px; color: rgb(109, 89, 29); background: var(--pf-yellow-soft); }
body.ui-v3[data-packet-frontier-mounted="true"] .console-content { display: grid; grid-template-rows: 38px minmax(0px, 1fr); gap: 8px; }
.ui-v3 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat) { position: relative; border-color: var(--pf-line); border-radius: 3px; background: var(--pf-surface-soft); overflow: hidden; }
.ui-v3 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat)::before { content: ""; position: absolute; top: 0px; bottom: 0px; left: 0px; width: 2px; background: var(--pf-teal); }
.ui-v3 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat):nth-child(2)::before { background: var(--pf-coral); }
.ui-v3 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat):nth-child(3)::before { background: var(--pf-blue); }
.ui-v3 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat):nth-child(4)::before { background: rgb(181, 189, 57); }
.ui-v3 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat) strong { color: var(--pf-teal-dark); }
.ui-v3 :is(.newapi-input, .newapi-select, .newapi-textarea, .search-input) { border-color: var(--pf-line-strong); border-radius: 3px; color: var(--pf-ink); background: rgb(255, 255, 255); }
.ui-v3 :is(.newapi-input, .newapi-select, .newapi-textarea, .search-input):focus { border-color: var(--pf-teal); box-shadow: rgba(25, 125, 114, 0.14) 0px 0px 0px 3px; }
.ui-v3 :is(.view-tab, .newapi-button, .console-nav, .console-key-visibility, .admin-workspace-tab, .usage-log-page-button, .recharge-plan-card, .recharge-method-card, .news-filter-button, .agent-suggestion-chip, .refresh-button, .search-button, .packet-motion-toggle):focus-visible { outline: 3px solid var(--pf-teal-dark); outline-offset: 2px; }
.ui-v3 :is(.console-nav, .console-sidebar .newapi-button, .packet-motion-toggle):focus-visible { outline-color: rgb(255, 255, 255); }
@media (max-width: 1240px) {
  .ui-v3 .topbar, .ui-v3[data-active-view="leaderboard"] .topbar, .ui-v3[data-active-view="frontier-news"] .topbar { grid-template-columns: minmax(420px, 0.84fr) minmax(430px, 1.16fr); }
}
@media (max-width: 980px) {
  .ui-v3 .topbar, .ui-v3[data-active-view="leaderboard"] .topbar, .ui-v3[data-active-view="frontier-news"] .topbar { grid-template-columns: minmax(0px, 1fr); min-height: 118px; }
  .ui-v3 .title-copy, .ui-v3[data-active-view="leaderboard"] .title-copy, .ui-v3[data-active-view="frontier-news"] .title-copy { min-height: 62px; }
  .ui-v3 .stats, .ui-v3[data-active-view="leaderboard"] .stats, .ui-v3[data-active-view="frontier-news"] .stats { min-height: 56px; }
  .ui-v3 .metric, .ui-v3[data-active-view="leaderboard"] .metric { min-height: 55px; }
  body.ui-v3[data-packet-frontier-mounted="true"] .console-content { grid-template-rows: 38px auto; }
}
@media (max-width: 860px) {
}
@media (max-width: 560px) {
  .ui-v3 .topbar, .ui-v3[data-active-view="leaderboard"] .topbar, .ui-v3[data-active-view="frontier-news"] .topbar { min-height: 148px; }
  .ui-v3 .title-copy, .ui-v3[data-active-view="leaderboard"] .title-copy, .ui-v3[data-active-view="frontier-news"] .title-copy { gap: 8px; min-height: 91px; padding: 9px 10px; }
  .ui-v3 h1, .ui-v3[data-active-view="leaderboard"] h1 { font-size: 17px; }
  .ui-v3 .view-switch, .ui-v3[data-active-view="leaderboard"] .view-switch, .ui-v3[data-active-view="frontier-news"] .view-switch { width: 100%; }
  .ui-v3 .view-tab, .ui-v3[data-active-view="leaderboard"] .view-tab, .ui-v3[data-active-view="frontier-news"] .view-tab { min-height: 40px; }
  .ui-v3 .stats, .ui-v3[data-active-view="leaderboard"] .stats, .ui-v3[data-active-view="frontier-news"] .stats { grid-template-columns: repeat(3, minmax(0px, 1fr)); min-height: 57px; }
  .ui-v3 .metric, .ui-v3[data-active-view="leaderboard"] .metric { min-height: 56px; padding: 6px 9px; }
}
@media (max-width: 380px) {
}
@media (max-height: 700px) and (min-width: 981px) {
  .ui-v3 .topbar, .ui-v3[data-active-view="leaderboard"] .topbar, .ui-v3[data-active-view="frontier-news"] .topbar { min-height: 56px; }
  .ui-v3 .title-copy, .ui-v3[data-active-view="leaderboard"] .title-copy, .ui-v3[data-active-view="frontier-news"] .title-copy { min-height: 55px; }
  .ui-v3 .stats, .ui-v3 .metric, .ui-v3[data-active-view="leaderboard"] .stats, .ui-v3[data-active-view="leaderboard"] .metric { min-height: 55px; }
}
@media (prefers-reduced-motion: reduce) {
}
body.ui-v4 :is(h1, .console-gate-kicker, .console-brand strong, .console-brand span, .panel-head, .packet-route-kicker, .packet-route-state, .packet-route-track, .packet-scene-meta, .console-nav-icon, .console-page-eyebrow, .newapi-card-title, .newspaper-title) { letter-spacing: 0.035em; }
body.ui-v4[data-ui-parallax="active"] .scene-image { transform: translate3d(var(--ui-scene-x), var(--ui-scene-y), 0) scale(1.022); }
body.ui-v4 .topbar, body.ui-v4[data-active-view="leaderboard"] .topbar, body.ui-v4[data-active-view="frontier-news"] .topbar, body.ui-v4[data-active-view="new-api"] .topbar { grid-template-columns: minmax(510px, 0.9fr) minmax(470px, 1.1fr); min-height: 68px; border-bottom: 3px solid var(--pf-ink); background: rgb(255, 249, 232); }
body.ui-v4 .title-copy, body.ui-v4[data-active-view="leaderboard"] .title-copy, body.ui-v4[data-active-view="frontier-news"] .title-copy, body.ui-v4[data-active-view="new-api"] .title-copy { gap: 22px; min-height: 65px; padding: 0px 18px; background: rgb(255, 249, 232); }
body.ui-v4 h1, body.ui-v4[data-active-view="leaderboard"] h1 { gap: 14px; color: var(--pf-ink); font-size: 19px; font-weight: 950; }
body.ui-v4 .view-switch, body.ui-v4[data-active-view="leaderboard"] .view-switch, body.ui-v4[data-active-view="frontier-news"] .view-switch, body.ui-v4[data-active-view="new-api"] .view-switch { width: min(276px, 100%); min-width: 234px; padding: 4px; border: 2px solid var(--pf-ink); background: var(--pf-sky); box-shadow: rgba(23, 59, 70, 0.16) 4px 4px 0px; }
body.ui-v4 .view-tab, body.ui-v4[data-active-view="leaderboard"] .view-tab, body.ui-v4[data-active-view="frontier-news"] .view-tab, body.ui-v4[data-active-view="new-api"] .view-tab { min-height: 36px; color: var(--pf-ink); background: rgb(255, 254, 247); font-size: 12px; font-weight: 900; }
body.ui-v4 .stats, body.ui-v4[data-active-view="leaderboard"] .stats, body.ui-v4[data-active-view="frontier-news"] .stats, body.ui-v4[data-active-view="new-api"] .stats { min-height: 65px; border-left: 3px solid var(--pf-ink); background: rgb(255, 254, 247); }
body.ui-v4 .metric, body.ui-v4[data-active-view="leaderboard"] .metric { min-height: 65px; padding: 9px 15px; border-right: 2px solid var(--pf-ink); background: var(--pf-mint-soft); }
body.ui-v4 .metric .label, body.ui-v4[data-active-view="leaderboard"] .metric .label { color: rgb(69, 101, 109); font-size: 9px; font-weight: 900; }
body.ui-v4 .metric .value, body.ui-v4[data-active-view="leaderboard"] .metric .value { color: var(--pf-ink); font-size: 17px; font-weight: 950; }
body.ui-v4 .panel-head, body.ui-v4[data-active-view="leaderboard"] .console-shell-panel > .panel-head { min-height: 38px; padding: 7px 14px; border-bottom: 3px solid var(--pf-ink); color: var(--pf-ink); background: var(--pf-sky); font-size: 10px; font-weight: 950; }
body.ui-v4 .panel-head span:last-child, body.ui-v4[data-active-view="leaderboard"] .console-shell-panel > .panel-head span:last-child { min-height: 24px; padding: 3px 9px; border: 2px solid var(--pf-ink); color: var(--pf-ink); background: var(--pf-yellow-soft); box-shadow: rgba(23, 59, 70, 0.14) 3px 3px 0px; }
body.ui-v4 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat) { border: 2px solid var(--pf-ink); background: var(--pf-mint-soft); }
body.ui-v4 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat):nth-child(2) { background: var(--pf-coral-soft); }
body.ui-v4 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat):nth-child(3) { background: var(--pf-blue-soft); }
body.ui-v4 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat):nth-child(4) { background: var(--pf-yellow-soft); }
body.ui-v4 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat)::before { width: 4px; background: var(--pf-teal); }
body.ui-v4 :is(.newapi-metric, .usage-query-card, .admin-summary-card, .admin-account-stat) strong { color: var(--pf-ink); }
body.ui-v4 :is(.newapi-input, .newapi-select, .newapi-textarea, .search-input) { border: 2px solid var(--pf-ink); color: var(--pf-ink); background: rgb(255, 254, 247); box-shadow: rgba(39, 94, 168, 0.12) 2px 2px 0px; }
body.ui-v4 :is(.newapi-input, .newapi-select, .newapi-textarea, .search-input):focus { border-color: var(--pf-blue); box-shadow: 3px 3px 0 var(--pf-yellow); }
body.ui-v4 :is(.view-tab, .newapi-button, .console-nav, .console-key-visibility, .admin-workspace-tab, .usage-log-page-button, .recharge-plan-card, .recharge-method-card, .news-filter-button, .agent-suggestion-chip, .refresh-button, .search-button, .packet-motion-toggle):focus-visible { outline: 3px solid var(--pf-blue); outline-offset: 3px; }
body.ui-v4 :is(.console-nav, .console-sidebar .newapi-button, .packet-motion-toggle):focus-visible { outline-color: var(--pf-blue); }
@media (max-width: 1240px) {
}
@media (min-width: 981px) and (max-width: 1180px) {
}
@media (min-width: 981px) and (max-width: 1100px) {
  body.ui-v4 .topbar, body.ui-v4[data-active-view="leaderboard"] .topbar, body.ui-v4[data-active-view="frontier-news"] .topbar, body.ui-v4[data-active-view="new-api"] .topbar { grid-template-columns: minmax(480px, 0.92fr) minmax(390px, 1.08fr); }
  body.ui-v4 .title-copy, body.ui-v4[data-active-view="leaderboard"] .title-copy, body.ui-v4[data-active-view="frontier-news"] .title-copy, body.ui-v4[data-active-view="new-api"] .title-copy { gap: 12px; padding-inline: 12px; }
  body.ui-v4 h1, body.ui-v4[data-active-view="leaderboard"] h1 { font-size: 17px; }
  body.ui-v4 .view-switch, body.ui-v4[data-active-view="leaderboard"] .view-switch, body.ui-v4[data-active-view="frontier-news"] .view-switch, body.ui-v4[data-active-view="new-api"] .view-switch { width: min(250px, 100%); min-width: 220px; }
  body.ui-v4 .stats, body.ui-v4[data-active-view="leaderboard"] .stats, body.ui-v4[data-active-view="frontier-news"] .stats, body.ui-v4[data-active-view="new-api"] .stats { grid-template-columns: minmax(90px, 0.55fr) minmax(130px, 0.78fr) minmax(170px, 1.2fr); }
  body.ui-v4 .metric, body.ui-v4[data-active-view="leaderboard"] .metric { padding-inline: 10px; }
}
@media (max-width: 980px) {
  body.ui-v4 .topbar, body.ui-v4[data-active-view="leaderboard"] .topbar, body.ui-v4[data-active-view="frontier-news"] .topbar { grid-template-columns: minmax(0px, 1fr); min-height: 120px; }
  body.ui-v4 .stats, body.ui-v4[data-active-view="leaderboard"] .stats, body.ui-v4[data-active-view="frontier-news"] .stats { border-top: 3px solid var(--pf-ink); border-left: 0px; }
  body.ui-v4.packet-authenticated :is(.stats, .title-copy h1) { display: none; }
}
@media (min-width: 561px) and (max-width: 980px) {
}
@media (max-width: 860px) {
}
@media (max-width: 560px) {
  body.ui-v4 .topbar, body.ui-v4[data-active-view="leaderboard"] .topbar, body.ui-v4[data-active-view="frontier-news"] .topbar { min-height: 156px; }
  body.ui-v4 .title-copy, body.ui-v4[data-active-view="leaderboard"] .title-copy, body.ui-v4[data-active-view="frontier-news"] .title-copy { min-height: 96px; }
  body.ui-v4 .view-tab, body.ui-v4[data-active-view="leaderboard"] .view-tab, body.ui-v4[data-active-view="frontier-news"] .view-tab { min-height: 42px; }
  body.ui-v4 .stats, body.ui-v4[data-active-view="leaderboard"] .stats, body.ui-v4[data-active-view="frontier-news"] .stats { min-height: 60px; }
  body.ui-v4 .metric, body.ui-v4[data-active-view="leaderboard"] .metric { min-height: 58px; }
  body.ui-v4[data-active-view="frontier-news"] .topbar, body.ui-v4[data-active-view="new-api"] .topbar { min-height: 62px; }
  body.ui-v4[data-active-view="frontier-news"] :is(.stats, .title-copy h1), body.ui-v4[data-active-view="new-api"] :is(.stats, .title-copy h1) { display: none; }
  body.ui-v4[data-active-view="frontier-news"] .title-copy, body.ui-v4[data-active-view="new-api"] .title-copy { display: flex; justify-content: center; min-height: 62px; padding: 7px 10px; }
  body.ui-v4[data-active-view="frontier-news"] .view-switch, body.ui-v4[data-active-view="new-api"] .view-switch { width: 100%; max-width: none; }
  body.ui-v4 .news-intel-panel .agent-actions :is(.search-button, .refresh-button) { min-height: 42px; }
}
@media (max-width: 380px) {
}
@media (max-height: 700px) and (min-width: 981px) {
  body.ui-v4 .topbar, body.ui-v4[data-active-view="leaderboard"] .topbar, body.ui-v4[data-active-view="frontier-news"] .topbar, body.ui-v4 .title-copy, body.ui-v4[data-active-view="leaderboard"] .title-copy, body.ui-v4[data-active-view="frontier-news"] .title-copy, body.ui-v4 .stats, body.ui-v4 .metric { min-height: 56px; }
}
@media (prefers-reduced-motion: reduce) {
}
:root { --v5-motion-fast: 120ms; --v5-motion-base: 220ms; --v5-motion-view: 420ms; --v5-ease-enter: cubic-bezier(.16, 1, .3, 1); --v5-grid-line: rgba(39, 94, 168, .055); }
body.ui-v5 :is(.hourly-svg-bar, .hourly-svg-peak-mark) { filter: none; }
body.ui-v5 :is(.newapi-input, .newapi-select, .newapi-textarea, .search-input, .console-key-input-wrap .newapi-input):focus-visible { outline: 3px solid var(--pf-blue); outline-offset: 2px; }
body.ui-v5 :is(.view-tab, .newapi-button, .console-nav, .console-key-visibility, .admin-workspace-tab, .usage-log-page-button, .recharge-plan-card, .recharge-method-card, .news-filter-button, .agent-suggestion-chip, .refresh-button, .search-button, .packet-motion-toggle):hover:not(:disabled) { transform: translateY(-1px); }
body.ui-v5 :is(.view-tab, .newapi-button, .console-nav, .console-key-visibility, .admin-workspace-tab, .usage-log-page-button, .recharge-plan-card, .recharge-method-card, .news-filter-button, .agent-suggestion-chip, .refresh-button, .search-button, .packet-motion-toggle):active:not(:disabled) { transform: translateY(1px); }
body.ui-v5 :is(.newapi-card, .mini-leaderboard-panel, .usage-log-panel, .dashboard-hourly-card, .admin-account-detail-page, .admin-account-tool-card, .news-intel-panel, .news-group-card, .recharge-page-hero, .admin-page-hero, .console-page-title) { position: relative; }
body.ui-v5 :is(.newapi-card-head, .dashboard-overview .newapi-card-head, .console-page-title, .recharge-page-hero, .admin-page-hero, .newspaper-header) { background-image: linear-gradient(
    90deg,
    var(--pf-blue) 0 44px,
    var(--pf-coral) 44px 70px,
    var(--pf-yellow) 70px 96px,
    transparent 96px
  ); background-position: left top; background-repeat: no-repeat; background-size: 100% 3px; }
@media (max-width: 980px) {
  html { height: auto; min-height: 100%; overflow: hidden auto; }
}
@media (min-width: 640px) and (max-width: 980px) {
}
@media (max-width: 639px) {
}
@media (max-width: 980px) and (max-height: 620px) {
}
@media (prefers-reduced-motion: reduce) {
}
:root { --v6-blue: #2f6f92; --v6-blue-hi: #4fa7de; --v6-mint: #2ab992; --v6-mint-hi: #7ecfba; --v6-ink: #17243a; --v6-muted: #637792; --v6-line: rgba(38, 67, 101, .18); --v6-mono: "SFMono-Regular", "Cascadia Mono", "IBM Plex Mono", "Courier New", monospace; }
@media (prefers-reduced-motion: no-preference) {
}
:root { --v7-ease: cubic-bezier(.16, 1, .3, 1); --v7-line: rgba(38, 67, 101, .16); --v7-blue: #2f6f92; }
body.ui-v7[data-packet-frontier-mounted="true"] .console-content { grid-template-rows: minmax(0px, 1fr); gap: 0px; }
@media (prefers-reduced-motion: no-preference) {
}
@media (max-width: 1180px) {
}
@media (max-width: 760px) {
}
@media (prefers-reduced-motion: no-preference) {
}
}