/* 新版舰桥 · 页面样式（abyss）：只在对应页面加载，排在 bridge.css 之后。令牌和通用组件在 bridge.css。 */

/* ==========================================================================
 * 深渊与虫洞（/abyss，设计图 11）：大标题 + 数字、五个分页、最高报价合同卡片、虫洞代码目录表
 * ========================================================================== */
#bridge .abyss-lab-page { max-width: 1480px; margin: 0 auto; padding: 0 24px 40px; }
#bridge .aw-hero {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 28px; align-items: end;
  padding: 26px 0 24px; border-bottom: 1px solid rgba(var(--am-rgb), 0.28);
  background: radial-gradient(60% 120% at 50% 100%, rgba(var(--am-rgb), 0.10), transparent 70%);
}
#bridge .aw-hero h1 { margin: 10px 0 8px; font-family: var(--font-serif); font-size: clamp(34px, 4.4vw, 56px); font-weight: 800; letter-spacing: 0.04em; color: var(--t1); }
#bridge .aw-hero p { margin: 0; color: var(--t2); font-size: 15px; max-width: 760px; }
#bridge .aw-hero-side { display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
#bridge .aw-hero-stats { margin: 0; display: grid; gap: 6px; font: 12.5px var(--font-mono); color: var(--t3); }
#bridge .aw-hero-stats div { display: flex; justify-content: flex-end; gap: 8px; align-items: center; }
#bridge .aw-hero-stats dt::before { content: ""; display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--gr); box-shadow: 0 0 8px var(--gr); vertical-align: 1px; }
#bridge .aw-hero-stats dd { margin: 0; color: var(--t2); }
#bridge .aw-subtabs { display: flex; gap: 4px; margin: 18px 0 18px; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
#bridge .aw-subtabs button { flex: none; border: 0; border-bottom: 2px solid transparent; background: none; color: var(--t3); padding: 10px 16px 12px; font-size: 15px; cursor: pointer; border-radius: 0; }
#bridge .aw-subtabs button.is-active { background: none; color: var(--t3); }
#bridge .aw-subtabs button.is-current { color: var(--am-hi); border-bottom-color: var(--am); }
#bridge .aw-subtabs button:hover { color: var(--t1); }
#bridge .aw-chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
#bridge .aw-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 13px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255, 255, 255, 0.025); color: var(--t2); font-size: 13px; cursor: pointer; }
#bridge .aw-chip em { font: normal 11.5px var(--font-mono); color: var(--t4); }
#bridge .aw-chip.is-active { border-color: var(--am); color: var(--am-hi); background: rgba(var(--am-rgb), 0.12); }
#bridge .aw-chip.is-active em { color: var(--am); }
#bridge .aw-top-contracts { display: grid; gap: 14px; margin-bottom: 18px; }
#bridge .aw-price-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
#bridge .aw-price-card { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; min-width: 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--hud-panel-bg, rgba(10, 16, 26, 0.7)); color: var(--t1); text-align: left; cursor: pointer; font: inherit; }
#bridge .aw-price-card:hover { border-color: rgba(var(--am-rgb), 0.55); }
#bridge .aw-price-card.is-top { border-color: rgba(var(--am-rgb), 0.7); box-shadow: 0 0 0 1px rgba(var(--am-rgb), 0.18) inset; }
#bridge .aw-price-group { font: 11px var(--font-mono); letter-spacing: 0.12em; color: var(--am); }
#bridge .aw-price-card b { font-size: 16px; font-weight: 700; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#bridge .aw-price-card strong { font: 600 24px var(--font-mono); color: var(--t1); letter-spacing: 0.02em; }
#bridge .aw-price-card small { font-size: 12px; color: var(--t4); }
#bridge .aw-price-note { margin: 0; font-size: 12px; color: var(--t4); }
#bridge .aw-empty { grid-column: 1 / -1; margin: 0; padding: 24px 16px; text-align: center; color: var(--t3); border: 1px dashed var(--line); border-radius: 10px; }
#bridge .aw-directory { margin-bottom: 18px; }
#bridge .aw-directory .intel-panel-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 12px; }
#bridge .bridge-kicker.is-cyan { color: var(--cy); }
#bridge .aw-directory-wrap { max-height: 520px; overflow: auto; margin: 6px 0 10px; }
#bridge .aw-directory-table { width: 100%; border-collapse: collapse; font-size: 14px; }
#bridge .aw-directory-table th { position: sticky; top: 0; z-index: 1; padding: 10px 12px; text-align: left; font-weight: 500; font-size: 12.5px; color: var(--t4); background: var(--panel-solid, #0d131c); border-bottom: 1px solid var(--line); }
#bridge .aw-directory-table td { padding: 11px 12px; border-bottom: 1px solid rgba(255, 255, 255, 0.05); color: var(--t2); }
#bridge .aw-directory-table .num { text-align: right; font-family: var(--font-mono); white-space: nowrap; }
#bridge .aw-directory-table td.code { font-family: var(--font-mono); color: var(--am); font-weight: 600; }
#bridge .aw-directory-table tbody tr { cursor: pointer; }
#bridge .aw-directory-table tbody tr:hover td, #bridge .aw-directory-table tbody tr:focus-visible td { background: rgba(var(--am-rgb), 0.06); }
:root[data-theme="light"] #bridge .aw-price-card { background: var(--panel-solid); }
:root[data-theme="light"] #bridge .aw-directory-table td { border-bottom-color: rgba(0, 0, 0, 0.06); }
@media (max-width: 1100px) { #bridge .aw-price-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) {
  #bridge .abyss-lab-page { padding: 0 14px 32px; }
  #bridge .aw-hero { grid-template-columns: 1fr; padding: 18px 0; }
  #bridge .aw-hero-side { align-items: flex-start; }
  #bridge .aw-hero-stats div { justify-content: flex-start; }
  #bridge .aw-price-card strong { font-size: 20px; }
  #bridge .aw-subtabs button { padding: 10px 12px; font-size: 14px; }
  #bridge .aw-directory-table th:nth-child(4), #bridge .aw-directory-table td:nth-child(4) { display: none; }
  #bridge .aw-directory-table td, #bridge .aw-directory-table th { padding: 9px 8px; }
}
#bridge #abyss-score, #bridge #abyss-contracts, #bridge #wormhole-directory, #bridge #wormhole-codes, #bridge #wormhole-j-directory, #bridge #wormhole-bounties { scroll-margin-top: 96px; }
@media (max-width: 720px) {
  #bridge .aw-top-contracts .aw-chip-row { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin: 0 -14px; padding: 0 14px; }
  #bridge .aw-chip { flex: none; }
}

/* 虫洞入口悬赏默认收起（与 wormholes.css 同一套样式） */
#bridge .wh-collapsible { padding: 0; margin: 0 0 18px; }
#bridge .wh-collapsible > summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 14px 18px; cursor: pointer; list-style: none; }
#bridge .wh-collapsible > summary::-webkit-details-marker { display: none; }
#bridge .wh-collapsible > summary::after { content: "展开"; margin-left: auto; font-size: 12.5px; color: var(--am); border: 1px solid rgba(var(--am-rgb), 0.4); border-radius: 999px; padding: 2px 10px; }
#bridge .wh-collapsible[open] > summary::after { content: "收起"; }
#bridge .wh-collapsible > summary strong { font-size: 16px; color: var(--t1); }
#bridge .wh-collapsible > summary em { font-style: normal; font: 12px var(--font-mono); color: var(--cy); }
#bridge .wh-collapsible > summary small { color: var(--t4); font-size: 12.5px; }
#bridge .wh-collapsible[open] > summary { border-bottom: 1px solid var(--line); }
#bridge .wh-collapsible > :not(summary) { margin-left: 18px; margin-right: 18px; }
#bridge .wh-collapsible > :last-child { margin-bottom: 16px; }

/* Static light-theme ink; neon tones remain available in the dark theme. */
:root[data-theme="light"] #bridge .abyss-card-attribute-copy b { color: var(--t1); }
:root[data-theme="light"] #bridge :is(.abyss-card-attribute-copy small, .abyss-module-pending) { color: var(--t3); }
:root[data-theme="light"] #bridge .abyss-card-attribute.is-good :is(em, strong) { color: var(--gr); }
:root[data-theme="light"] #bridge .abyss-card-attribute.is-bad :is(em, strong) { color: var(--rd); }
:root[data-theme="light"] #bridge .abyss-card-attribute.is-neutral :is(em, strong),
:root[data-theme="light"] #bridge .abyss-module-card-head em { color: #805000; }
