  .level-hero {
    background: var(--ui-accent-soft);
    border-bottom: 1px solid var(--ui-accent-border);
    padding: 2rem 1.5rem;
  }
  .level-hero h1 { font-size: 1.35rem; font-weight: 750; color: var(--ui-text); margin-bottom: 0.5rem; display: flex; align-items: center; gap: 0.5rem; }
  .level-hero p  { font-size: 0.88rem; color: var(--ui-muted); font-weight: 500; }

  .stats-grid {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 1rem; margin-bottom: 1.5rem;
  }
  .stat-card {
    background: var(--ui-panel); border-radius: var(--radius-card); padding: 0.65rem 1rem;
    border: 1.5px solid var(--ui-line); box-shadow: none;
    position: relative; overflow: hidden; transition: all 0.3s;
    display: flex; align-items: center; gap: 0.75rem;
  }
  .stat-card::before {
    content: ''; position: absolute; inset: 0;
    background: color-mix(in srgb, var(--ui-good) 8%, transparent);
    pointer-events: none;
  }
  .stat-card:hover { transform: translateY(-1px); box-shadow: var(--ui-shadow); border-color: var(--ui-accent-border); }

  .stat-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 38px; height: 38px; border-radius: 0.6rem;
    font-size: 1.2rem; flex-shrink: 0;
  }
  .stat-info { flex: 1; min-width: 0; }
  .stat-card:nth-child(1) .stat-icon { background: var(--ui-good-soft); }
  .stat-card:nth-child(2) .stat-icon { background: var(--ui-special-soft); }
  .stat-card:nth-child(3) .stat-icon { background: var(--ui-info-soft); }

  .stat-label { font-size: 0.65rem; color: var(--ui-muted); font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 0.2rem; }
  .stat-value { font-size: 1.15rem; font-weight: 900; color: var(--ui-good); letter-spacing: -0.02em; }
  .stat-desc { font-size: 0.7rem; color: var(--ui-muted); margin-top: 0.2rem; font-weight: 500; }

  .search-panel {
    background: linear-gradient(135deg, var(--ui-panel) 0%, var(--ui-panel-2) 100%);
    border-radius: var(--radius-card); padding: 1.5rem;
    border: 1.5px solid var(--ui-line); box-shadow: none;
    position: relative;
  }
  .search-wrapper { position: relative; }
  .search-wrapper::before {
    content: '🔍'; position: absolute; left: 1rem; top: 50%;
    transform: translateY(-50%); font-size: 1.1rem; pointer-events: none;
  }
  .search-input {
    width: 100%; padding: 0.65rem 1rem 0.65rem 2.8rem;
    border: 1.5px solid var(--ui-line);
    border-radius: 0.75rem; font-size: 0.95rem; background: var(--ui-panel);
    transition: all 0.25s; outline: none; font-weight: 500;
  }
  .search-input:focus {
    border-color: var(--ui-good); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-good) 18%, transparent);
  }

  .table-wrap {
    overflow-x: auto; border-radius: var(--radius-card);
    background: var(--ui-panel); border: 1.5px solid var(--ui-line);
    box-shadow: 0 2px 12px rgba(0,0,0,.06);
  }
  .exp-table-wrap { max-height: 700px; overflow-y: auto; }

  .rank-table { width: 100%; border-collapse: separate; border-spacing: 0; }
  .rank-table th {
    font-size: 0.75rem; font-weight: 800; color: var(--ui-muted); text-transform: uppercase; letter-spacing: 0.05em;
    padding: 0.9rem 1.2rem; text-align: left; border-bottom: 2.5px solid var(--ui-bg-1);
    position: sticky; top: 0; background: linear-gradient(135deg, var(--ui-panel-2), var(--ui-bg-1)); z-index: 1;
  }
  .rank-table td {
    padding: 0.75rem 1.2rem; font-size: 0.9rem; color: var(--ui-text);
    border-bottom: 1px solid var(--ui-bg-1); font-family: 'Courier New', monospace;
  }
  .rank-table tr:hover td { background: var(--ui-panel-2); }

  .level-cell {
    font-weight: 800; min-width: 70px; display: flex; align-items: center; gap: 0.5rem;
  }
  .level-badge {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 32px; height: 32px; border-radius: 0.6rem;
    font-weight: 700; font-size: 0.85rem;
  }
  
  /* 等级段位样式 */
  .level-badge.novice { background: var(--ui-info-soft); color: var(--ui-info); }
  .level-badge.junior { background: var(--ui-good-soft); color: var(--ui-good); }
  .level-badge.senior { background: var(--ui-warn-soft); color: var(--ui-warn); }
  .level-badge.elite { background: var(--ui-special-soft); color: var(--ui-special); }
  .level-badge.master { background: var(--ui-danger-soft); color: var(--ui-danger); }

  .exp-cell { color: var(--ui-muted); }
  .level-up-badge {
    display: inline-block; padding: 0.3rem 0.6rem; border-radius: 0.5rem;
    background: var(--ui-good-soft);
    color: var(--ui-good); font-weight: 700; font-size: 0.85rem;
  }

  .no-results {
    text-align: center; padding: 3rem 1.5rem;
    color: var(--ui-muted);
  }

  ::-webkit-scrollbar { width: 7px; height: 7px; }
  ::-webkit-scrollbar-track { background: var(--ui-bg-1); border-radius: 3px; }
  ::-webkit-scrollbar-thumb { background: linear-gradient(180deg, var(--ui-line-strong), var(--ui-muted)); border-radius: 4px; }
  ::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, var(--ui-muted), var(--ui-muted)); }

  @keyframes levelPulse {
    0%, 100% { background-color: transparent; }
    50% { background-color: var(--ui-good-soft); }
  }

  /* ========== 氪金计算器 ========== */
  .calc-card {
    background: linear-gradient(135deg, var(--ui-panel) 0%, var(--ui-panel-2) 100%);
    border-radius: var(--radius-card); padding: 1.5rem;
    border: 1.5px solid var(--ui-line); box-shadow: none;
  }
  .calc-card h2 {
    font-size: 1.05rem; font-weight: 800; color: var(--ui-good);
    display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.2rem;
  }
  .calc-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
    gap: 1rem; margin-bottom: 1rem; align-items: flex-end;
  }
  .calc-grid .calc-btn { min-width: 8.5rem; }
  @media (max-width: 480px) {
    .calc-grid { grid-template-columns: repeat(2, 1fr); }
  }
  .calc-field label {
    display: block; font-size: 0.72rem; font-weight: 700; color: var(--ui-muted);
    text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 0.3rem;
  }
  .calc-input {
    width: 100%; padding: 0.5rem 0.75rem;
    border: 1.5px solid var(--ui-line); border-radius: 0.65rem;
    font-size: 0.95rem; font-weight: 600; color: var(--ui-text);
    background: var(--ui-panel); outline: none; transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box; height: 36px;
  }
  .calc-input:focus {
    border-color: var(--ui-good); box-shadow: 0 0 0 3px color-mix(in srgb, var(--ui-good) 18%, transparent);
  }
  /* 首充开关 */
  .recharge-section { margin-bottom: 1rem; }
  .toggle-row {
    display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.6rem;
  }
  .toggle-switch {
    position: relative; display: inline-block; width: 44px; height: 24px; flex-shrink: 0;
  }
  .toggle-switch input { opacity: 0; width: 0; height: 0; }
  .toggle-slider {
    position: absolute; cursor: pointer; inset: 0;
    background: var(--ui-line-strong); border-radius: 24px; transition: 0.25s;
  }
  .toggle-slider::before {
    content: ''; position: absolute; width: 18px; height: 18px;
    left: 3px; bottom: 3px; background: var(--ui-panel); border-radius: 50%; transition: 0.25s;
  }
  .toggle-switch input:checked + .toggle-slider { background: var(--ui-good); }
  .toggle-switch input:checked + .toggle-slider::before { transform: translateX(20px); }
  .recharge-row {
    display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.55rem;
    flex-wrap: wrap; transition: opacity 0.2s;
  }
  .recharge-row.disabled { opacity: 0.35; pointer-events: none; }
  .recharge-row-label {
    font-size: 0.75rem; font-weight: 700; color: var(--ui-text);
    min-width: 72px; flex-shrink: 0;
  }
  .tier-btn {
    padding: 0.32rem 0.6rem; border-radius: 0.5rem;
    border: 1.5px solid var(--ui-line); background: var(--ui-panel-2);
    font-size: 0.82rem; font-weight: 700; color: var(--ui-muted);
    cursor: pointer; transition: all 0.15s; user-select: none;
  }
  .tier-btn:hover { border-color: var(--ui-good); background: var(--ui-good-soft); }
  .tier-btn.selected-first {
    background: var(--ui-warn-soft);
    border-color: var(--ui-warn); color: var(--ui-warn);
  }
  .calc-btn {
    padding: 0.6rem 1.6rem; border: none; border-radius: 0.75rem;
    background: var(--ui-accent);
    color: var(--ui-on-accent); font-size: 1rem; font-weight: 800; cursor: pointer;
    transition: all 0.2s; box-shadow: none;
    grid-column: auto; align-self: flex-end; white-space: nowrap;
    height: 36px; display: flex; align-items: center; justify-content: center;
  }
  @media (max-width: 480px) {
    .calc-btn { grid-column: 1 / -1; width: 100%; }
  }
  .calc-btn:hover { transform: translateY(-1px); box-shadow: var(--ui-shadow); }
  .calc-btn:active { transform: none; }
  .calc-btn:disabled { opacity: 0.6; cursor: default; transform: none; }

  /* 结果区 */
  .calc-result { margin-top: 1.5rem; }
  .result-summary {
    display: grid; grid-template-columns: repeat(6, 1fr);
    gap: 0.75rem; margin-bottom: 1rem;
  }
  @media (max-width: 1200px) {
    .result-summary { grid-template-columns: repeat(4, 1fr); }
  }
  @media (max-width: 768px) {
    .result-summary { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 480px) {
    .result-summary { grid-template-columns: 1fr; }
  }
  .result-card {
    background: var(--ui-panel); border: 1.5px solid var(--ui-line); border-radius: var(--radius-card);
    padding: 0.9rem 1rem; text-align: center;
  }
  .result-card .rc-icon { font-size: 1.3rem; margin-bottom: 0.3rem; }
  .result-card .rc-label { font-size: 0.68rem; color: var(--ui-muted); font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
  .result-card .rc-value { font-size: 1.25rem; font-weight: 900; color: var(--ui-good); letter-spacing: -0.02em; margin-top: 0.15rem; }
  .result-card .rc-sub   { font-size: 0.72rem; color: var(--ui-muted); margin-top: 0.1rem; }
  .result-card.highlight-red .rc-value { color: var(--ui-danger); }
  .result-card.highlight-yellow .rc-value { color: var(--ui-warn); }

  .crop-box {
    background: var(--ui-good-soft); border: 1.5px solid color-mix(in srgb, var(--ui-good) 35%, transparent); border-radius: var(--radius-card);
    padding: 0.85rem 1rem; margin-bottom: 1rem;
    display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap;
  }
  .crop-thumb { width: 48px; height: 48px; object-fit: contain; border-radius: 0.5rem; background: var(--ui-panel); flex-shrink: 0; }
  .crop-thumb-placeholder { width: 48px; height: 48px; border-radius: 0.5rem; background: var(--ui-good-soft); display: flex; align-items: center; justify-content: center; font-size: 1.5rem; flex-shrink: 0; }

  .steps-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 0.88rem; }
  .steps-table-compact td { vertical-align: top; padding: 0.55rem 0.65rem; }
  .seg-crop { display: inline-block; font-weight: 700; color: var(--ui-text); }
  .seg-sub { display: block; font-size: 0.72rem; color: var(--ui-muted); font-weight: 500; margin-top: 0.15rem; }
  .seg-chip {
    display: inline-block; margin-left: 0.3rem; padding: 0.05rem 0.4rem;
    border-radius: 999px; font-size: 0.65rem; font-weight: 700;
    background: var(--ui-special-soft); color: var(--ui-special);
  }
  .seg-note {
    display: inline-block; margin: 0.12rem 0.35rem 0.12rem 0;
    padding: 0.12rem 0.45rem; border-radius: 0.45rem;
    font-size: 0.72rem; color: var(--ui-muted);
    background: var(--ui-panel-2);
    max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  }
  .seg-note.main {
    color: var(--ui-special); font-weight: 700;
    background: color-mix(in srgb, var(--ui-special) 12%, var(--ui-panel-2));
  }
  .steps-table th {
    padding: 0.6rem 0.9rem; font-size: 0.7rem; font-weight: 800; color: var(--ui-muted);
    text-transform: uppercase; letter-spacing: 0.04em;
    border-bottom: 2px solid var(--ui-bg-1); text-align: left;
    background: var(--ui-panel-2); position: sticky; top: 0; z-index: 1;
  }
  .steps-table td {
    padding: 0.6rem 0.9rem; border-bottom: 1px solid var(--ui-bg-1);
    color: var(--ui-text); vertical-align: middle;
  }
  .steps-table tr:last-child td { border-bottom: none; }
  .steps-table tr:hover td { background: var(--ui-panel-2); }
  .purchase-items { font-size: 0.75rem; color: var(--ui-muted); margin-top: 0.25rem; }
  .purchase-items span { display: inline-block; background: var(--ui-bg-1); border-radius: 0.3rem; padding: 0.1rem 0.35rem; margin: 0.1rem 0.1rem 0 0; }
  .calc-error {
    background: var(--ui-danger-soft); border: 1.5px solid color-mix(in srgb, var(--ui-danger) 40%, transparent); border-radius: 0.75rem;
    padding: 0.85rem 1rem; color: var(--ui-danger); font-weight: 700; font-size: 0.9rem;
    display: flex; align-items: center; gap: 0.5rem;
    margin-bottom: 0.6rem;
  }
  .no-purchase-note {
    background: var(--ui-good-soft); border: 1.5px solid color-mix(in srgb, var(--ui-good) 35%, transparent); border-radius: 0.75rem;
    padding: 0.85rem 1rem; color: var(--ui-good); font-weight: 700; font-size: 0.9rem;
    display: flex; align-items: center; gap: 0.5rem;
  }
  .fert-summary-grid {
    display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-bottom: 1rem;
  }
  @media (max-width: 640px) {
    .stats-grid { grid-template-columns: 1fr; gap: 0.6rem; }
    .result-summary { grid-template-columns: repeat(2, 1fr); }
    .fert-summary-grid { grid-template-columns: 1fr; }
  }
  .fert-box {
    background: var(--ui-panel); border: 1.5px solid var(--ui-line); border-radius: var(--radius-card); padding: 0.85rem 1rem;
  }
  .fert-box h4 { font-size: 0.8rem; font-weight: 800; margin-bottom: 0.4rem; }
  .fert-box .row { display: flex; justify-content: space-between; font-size: 0.82rem; padding: 0.15rem 0; flex-wrap: wrap; gap: 0 0.5rem; }
  .fert-box .row .lbl { color: var(--ui-muted); }
  .fert-box .row .val { font-weight: 700; color: var(--ui-text); }
  /* 土地加成行：手机端等级+土地上行、加成效果下行 */
  .fert-box .land-row { display: flex; flex-direction: column; gap: 0.1rem; padding: 0.25rem 0; border-bottom: 1px solid var(--ui-bg-1); }
  .fert-box .land-row:last-child { border-bottom: none; }
  .fert-box .land-row .land-top { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
  .fert-box .land-row .land-range { font-weight: 700; color: var(--ui-text); font-size: 0.82rem; white-space: nowrap; }
  .fert-box .land-row .land-plots { font-size: 0.78rem; color: var(--ui-muted); }
  .fert-box .land-row .land-bonus-val { font-size: 0.78rem; font-weight: 600; }
  .recharge-plan { margin-top: 0.5rem; }
  .recharge-plan .rp-item {
    display: inline-block; background: var(--ui-good-soft); border: 1px solid color-mix(in srgb, var(--ui-good) 35%, transparent);
    border-radius: 0.4rem; padding: 0.2rem 0.5rem; margin: 0.15rem 0.15rem 0 0;
    font-size: 0.78rem; font-weight: 700; color: var(--ui-good);
  }
  .recharge-plan .rp-item.normal { background: var(--ui-bg-1); border-color: var(--ui-line-strong); color: var(--ui-text); }

  /* 推荐充值交互区 */
  .recharge-recommend {
    background: var(--ui-panel); border: 1.5px solid var(--ui-line); border-radius: var(--radius-card);
    padding: 0.85rem 1rem; margin-bottom: 1rem;
  }
  .recharge-recommend h4 { font-size: 0.85rem; font-weight: 800; color: var(--ui-warn); margin-bottom: 0.4rem; }
  .recharge-recommend .rec-hint {
    font-size: 0.72rem; color: var(--ui-muted); margin-bottom: 0.6rem; line-height: 1.5;
  }
  .rec-tier-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-bottom: 0.5rem; }
  .rec-tier {
    padding: 0.4rem 0.7rem; border-radius: 0.5rem;
    border: 1.5px solid var(--ui-line); background: var(--ui-panel-2);
    font-size: 0.82rem; font-weight: 700; color: var(--ui-muted);
    cursor: pointer; transition: all 0.15s; user-select: none;
    display: inline-flex; align-items: center; gap: 0.3rem;
  }
  .rec-tier.rec-selected {
    background: var(--ui-good-soft);
    border-color: var(--ui-good);
  }
  .rec-tier.rec-first.rec-selected {
    background: var(--ui-warn-soft);
    border-color: var(--ui-warn); color: var(--ui-warn);
  }
  .rec-tier .rec-tag {
    font-size: 0.6rem; padding: 0.05rem 0.25rem; border-radius: 0.25rem;
    background: var(--ui-warn-soft); color: var(--ui-warn); font-weight: 800;
  }
  .rec-tier .rec-diamonds { font-size: 0.7rem; color: var(--ui-muted); font-weight: 500; }
  .rec-summary {
    background: var(--ui-panel-2); border-radius: 0.65rem; padding: 0.6rem 0.8rem;
    font-size: 0.82rem; color: var(--ui-text); margin-top: 0.5rem;
    border: 1px solid var(--ui-line);
  }
  .rec-summary .rec-total { font-weight: 800; color: var(--ui-danger); font-size: 0.95rem; }
  .rec-summary .rec-diamonds-total { font-weight: 800; color: var(--ui-warn); }
  .rec-summary .rec-remaining { font-weight: 700; color: var(--ui-good); }

  /* ⓘ 信息按钮 & 弹窗 */
  .info-btn {
    display: inline-flex; align-items: center; justify-content: center;
    width: 20px; height: 20px; border-radius: 50%;
    background: var(--ui-line); color: var(--ui-muted); font-size: 0.72rem;
    cursor: pointer; border: none; flex-shrink: 0;
    transition: all 0.2s; line-height: 1; font-weight: 700;
  }
  .info-btn:hover { background: var(--ui-good); color: var(--ui-on-accent); }
  .info-btn.info-btn-warning {
    background: var(--ui-warn); color: var(--ui-on-accent);
    box-shadow: none; animation: none;
  }
  .info-btn.info-btn-warning:hover { background: var(--ui-warn); color: var(--ui-on-accent); }
  .info-btn-inline {
    display: inline-flex; align-items: center; justify-content: center;
    margin-left: 0.22rem; padding: 0;
    background: transparent; color: var(--ui-special);
    border: none; box-shadow: none; cursor: pointer;
    font-size: 0.78rem; line-height: 1; font-weight: 700;
    vertical-align: middle;
  }
  .info-btn-inline:hover { color: var(--ui-special); background: transparent; }
  @keyframes infoBtnPulse {
    0%, 100% { box-shadow: none; }
    50% { box-shadow: none; }
  }
  .info-modal-overlay {
    display: none; position: fixed; inset: 0; z-index: 9999;
    background: rgba(0,0,0,0.35); align-items: center; justify-content: center;
    backdrop-filter: blur(2px);
  }
  .info-modal {
    background: var(--ui-panel); border-radius: var(--radius-card); padding: 1.5rem;
    max-width: 420px; width: 90%; max-height: 80vh; overflow-y: auto;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
    animation: infoModalIn 0.2s ease-out;
  }
  @keyframes infoModalIn {
    from { opacity: 0; transform: scale(0.92) translateY(10px); }
    to   { opacity: 1; transform: none; }
  }
  .info-modal-header {
    display: flex; align-items: center; justify-content: space-between;
    margin-bottom: 1rem; padding-bottom: 0.75rem; border-bottom: 1.5px solid var(--ui-bg-1);
  }
  .info-modal-header .title { font-size: 1.05rem; font-weight: 800; color: var(--ui-good); }
  .info-modal-header .close-btn {
    width: 28px; height: 28px; border-radius: 50%; border: none;
    background: var(--ui-bg-1); color: var(--ui-muted); font-size: 1rem; cursor: pointer;
    display: flex; align-items: center; justify-content: center;
    transition: all 0.15s;
  }
  .info-modal-header .close-btn:hover { background: var(--ui-danger-soft); color: var(--ui-danger); }
  .info-modal-body { font-size: 0.88rem; color: var(--ui-text); line-height: 1.7; }
  .info-modal-body b { color: var(--ui-good); }

  /* 福利奖励卡片 */
  .bonus-summary-grid {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 0.75rem; margin-bottom: 1rem;
  }
  @media (max-width: 640px) {
    .bonus-summary-grid { grid-template-columns: 1fr; }
  }

  /* ========== 等级查询卡片 ========== */
  .level-query-panel {
    background: var(--ui-warn-soft);
    border-radius: var(--radius-card); padding: 1.5rem;
    border: 1.5px solid color-mix(in srgb, var(--ui-warn) 40%, transparent); box-shadow: 0 2px 10px rgba(0,0,0,.06);
  }
  .level-query-head {
    display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  }
  .level-query-head h2 { font-size: 1.05rem; font-weight: 800; color: var(--ui-warn); display: flex; align-items: center; gap: 0.5rem; }
  .level-query-hint {
    font-size: 0.78rem; color: var(--ui-warn); background: var(--ui-warn-soft); border: 1px solid color-mix(in srgb, var(--ui-warn) 40%, transparent);
    padding: 0.3rem 0.6rem; border-radius: 0.6rem; font-weight: 600;
  }
  .level-query-grid {
    display: grid; grid-template-columns: 1.05fr 1fr; gap: 1rem; margin-top: 1rem;
  }
  @media (max-width: 1024px) {
    .level-query-grid { grid-template-columns: 1fr; }
  }
  .lq-card {
    background: var(--ui-panel); border: 1.5px solid var(--ui-line); border-radius: var(--radius-card); padding: 1rem;
  }
  .lq-title {
    font-size: 0.78rem; color: var(--ui-muted); font-weight: 800; text-transform: uppercase; letter-spacing: 0.04em;
    margin-bottom: 0.6rem;
  }
  .lq-fields {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 0.75rem;
  }
  @media (max-width: 900px) {
    .lq-fields { grid-template-columns: 1fr; }
  }
  .lq-btn {
    padding: 0.55rem 1rem; border: none; border-radius: 0.75rem;
    background: var(--ui-warn);
    color: var(--ui-on-accent); font-size: 0.9rem; font-weight: 800; cursor: pointer;
    transition: all 0.2s; box-shadow: none;
    height: 36px; display: flex; align-items: center; justify-content: center;
  }
  .lq-btn:hover { transform: translateY(-1px); box-shadow: var(--ui-shadow); }
  .lq-summary {
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.6rem; margin-top: 0.8rem;
  }
  @media (max-width: 1200px) {
    .lq-summary { grid-template-columns: repeat(2, 1fr); }
  }
  @media (max-width: 640px) {
    .lq-summary { grid-template-columns: 1fr; }
  }
  .lq-summary-card {
    background: var(--ui-panel-2); border: 1px solid var(--ui-line); border-radius: 0.75rem; padding: 0.6rem 0.75rem;
  }
  .lq-summary-label { font-size: 0.68rem; color: var(--ui-muted); font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
  .lq-summary-value { font-size: 1rem; font-weight: 900; color: var(--ui-text); margin-top: 0.2rem; }
  .lq-summary-sub { font-size: 0.7rem; color: var(--ui-muted); margin-top: 0.15rem; }
  .lq-range-chip {
    display: inline-flex; align-items: center; gap: 0.4rem; padding: 0.3rem 0.7rem; border-radius: 999px;
    background: var(--ui-warn-soft); border: 1px solid color-mix(in srgb, var(--ui-warn) 40%, transparent); color: var(--ui-warn); font-size: 0.75rem; font-weight: 800;
  }
  .lq-table {
    display: flex; flex-direction: column; gap: 0.4rem; max-height: 300px; overflow: auto;
  }
  .lq-row {
    display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 0.5rem; align-items: center;
    background: var(--ui-panel-2); border: 1px solid var(--ui-line); border-radius: 0.6rem; padding: 0.45rem 0.6rem;
    font-size: 0.82rem;
  }
  .lq-row.head {
    background: var(--ui-panel); border-color: var(--ui-line); font-size: 0.7rem; text-transform: uppercase;
    color: var(--ui-muted); font-weight: 800; letter-spacing: 0.04em;
  }
  .lq-cell-strong { font-weight: 800; color: var(--ui-text); }
  .lq-cell-exp { font-weight: 900; color: var(--ui-good); text-align: right; }
  .lq-cell-total { font-weight: 700; color: var(--ui-text); text-align: right; }
  .lq-tag {
    display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.15rem 0.45rem; border-radius: 999px;
    background: var(--ui-good-soft); border: 1px solid color-mix(in srgb, var(--ui-good) 35%, transparent); color: var(--ui-good); font-size: 0.68rem; font-weight: 800;
  }
  .lq-tag.upgrade { background: var(--ui-bg-1); border-color: var(--ui-line); color: var(--ui-text); }
  .lq-list { display: flex; flex-direction: column; gap: 0.5rem; max-height: 300px; overflow: auto; }
  .lq-item {
    display: flex; align-items: center; justify-content: space-between; gap: 0.6rem;
    background: var(--ui-panel-2); border: 1px solid var(--ui-line); border-radius: 0.7rem; padding: 0.55rem 0.7rem;
  }
  .lq-item-title { font-size: 0.85rem; font-weight: 800; color: var(--ui-text); }
  .lq-item-sub { font-size: 0.72rem; color: var(--ui-muted); margin-top: 0.15rem; }
  .lq-item-val { font-size: 0.92rem; font-weight: 900; color: var(--ui-good); text-align: right; white-space: nowrap; }
  .lq-item-wan { font-size: 0.7rem; color: var(--ui-muted); margin-top: 0.1rem; display: block; }
  .lq-subtitle { font-size: 0.78rem; color: var(--ui-text); font-weight: 800; margin: 0.75rem 0 0.4rem; }
  .lq-empty { text-align: center; color: var(--ui-muted); font-size: 0.85rem; padding: 0.8rem 0; }
  .lq-pill {
    display: inline-flex; align-items: center; gap: 0.35rem; padding: 0.2rem 0.55rem; border-radius: 999px;
    background: var(--ui-warn-soft); border: 1px solid color-mix(in srgb, var(--ui-warn) 40%, transparent); color: var(--ui-warn); font-size: 0.7rem; font-weight: 700;
  }
  .lq-tip { font-size: 0.72rem; color: var(--ui-muted); margin-bottom: 0.4rem; }

  /* ========== 选项卡布局 ========== */
  .level-tabs {
    display: flex; gap: 0.6rem; flex-wrap: wrap; margin-bottom: 1rem;
  }
  .level-tab {
    padding: 0.45rem 1.1rem; border-radius: 999px; font-size: 0.85rem; font-weight: 700;
    border: 1.5px solid var(--ui-line); background: var(--ui-panel); color: var(--ui-muted); cursor: pointer;
    transition: all 0.2s;
  }
  .level-tab:hover { border-color: var(--ui-good); }
  .level-tab.active {
    background: var(--ui-accent);
    color: var(--ui-on-accent); border-color: var(--ui-good); box-shadow: none;
  }
  .level-tab-panel { display: none; }
  .level-tab-panel.active { display: block; }

  /* ========== 天工计算器专用 ========== */
  .tg-summary-grid {
    display: grid; grid-template-columns: repeat(6, 1fr);
    gap: 0.75rem; margin-bottom: 1rem;
  }
  @media (max-width: 1200px) {
    .tg-summary-grid { grid-template-columns: repeat(3, 1fr); }
  }
  @media (max-width: 768px) {
    .tg-summary-grid { grid-template-columns: repeat(2, 1fr); }
  }
  /* 手机端始终两列 */
  @media (max-width: 480px) {
    .tg-summary-grid { grid-template-columns: repeat(2, 1fr); }
  }

  /* 逐级详情：桌面端表格，手机端卡片 */
  .tg-detail-list { display: none; }
  @media (max-width: 768px) {
    .tg-detail-table { display: none; }
    .tg-detail-list { display: flex; flex-direction: column; gap: 0.6rem; }
  }
  .tg-lv-card {
    background: var(--ui-panel); border: 1.5px solid var(--ui-line); border-radius: var(--radius-card); padding: 0.75rem 1rem;
    display: grid; grid-template-columns: 1fr 1fr; gap: 0.35rem 1rem;
  }
  .tg-lv-card-head {
    grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between;
    padding-bottom: 0.4rem; border-bottom: 1px solid var(--ui-bg-1); margin-bottom: 0.2rem;
  }
  .tg-lv-card-head .lv-badge { font-weight: 800; font-size: 0.95rem; color: var(--ui-good); }
  .tg-lv-card-head .lv-exp-gain { font-weight: 800; font-size: 0.92rem; color: var(--ui-good); }
  .tg-lv-cell { display: flex; justify-content: space-between; align-items: center; font-size: 0.82rem; padding: 0.1rem 0; }
  .tg-lv-cell .cell-label { color: var(--ui-muted); font-weight: 600; font-size: 0.72rem; }
  .tg-lv-cell .cell-value { font-weight: 700; color: var(--ui-text); }

  /* ========== 氪金计算器手机端卡片 ========== */
  .ci-detail-table { display: block; }
  .ci-detail-list { display: none; }
  @media (max-width: 768px) {
    .ci-detail-table { display: none; }
    .ci-detail-list { display: flex; flex-direction: column; gap: 0.6rem; margin-top: 1rem; }
  }
  .ci-seg-card {
    background: var(--ui-panel); border: 1.5px solid var(--ui-line); border-radius: var(--radius-card); padding: 0.75rem 1rem;
    display: grid; grid-template-columns: 1fr 1fr; gap: 0.35rem 1rem;
  }
  .ci-seg-card-head {
    grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between;
    padding-bottom: 0.4rem; border-bottom: 1px solid var(--ui-bg-1); margin-bottom: 0.3rem;
    flex-wrap: wrap; gap: 0.4rem;
  }
  .ci-seg-head-left { display: flex; align-items: center; gap: 0.4rem; flex-wrap: wrap; }
  .ci-seg-head-right { display: flex; align-items: center; gap: 0.25rem; flex-wrap: wrap; }
  .ci-seg-card-head .seg-badge { font-weight: 800; font-size: 0.95rem; color: var(--ui-good); white-space: nowrap; }
  .ci-seg-card-head .crop-label { font-size: 0.7rem; color: var(--ui-muted); font-weight: 700; text-transform: uppercase; letter-spacing: 0.02em; white-space: nowrap; }
  .ci-seg-card-head .crop-info { display: flex; align-items: center; gap: 0.25rem; }
  .ci-seg-card-head .crop-name { font-weight: 700; font-size: 0.85rem; color: var(--ui-good); white-space: nowrap; }
  .ci-seg-card-head .crop-level { color: var(--ui-muted); font-weight: 500; font-size: 0.78rem; white-space: nowrap; }
  .ci-seg-card-head .reward-tag { color: var(--ui-special); font-size: 0.7rem; font-weight: 600; white-space: nowrap; background: var(--ui-special-soft); border: 1px solid color-mix(in srgb, var(--ui-special) 35%, transparent); padding: 0.15rem 0.4rem; border-radius: 0.4rem; }
  .ci-seg-cell { display: flex; justify-content: space-between; align-items: center; font-size: 0.82rem; padding: 0.1rem 0; }
  .ci-seg-cell .cell-label { color: var(--ui-muted); font-weight: 600; font-size: 0.72rem; }
  .ci-seg-cell .cell-value { font-weight: 700; color: var(--ui-text); }
