* { box-sizing: border-box; }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      margin: 0; padding: 8px 24px 24px; background: #f8fafc;
    }
		    .filters {
		      display: flex;
		      gap: 10px;
		      margin-bottom: 12px;
		      flex-wrap: nowrap;
		      align-items: center;
		      padding: 12px;
		      background: rgba(255, 255, 255, 0.9);
		      border: 1px solid #e5e7eb;
		      border-radius: 16px;
		      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
		    }
	    .filters-left {
	      display: flex;
	      gap: 10px;
	      flex-wrap: nowrap;
	      align-items: center;
	      flex: 1 1 auto;
	      min-width: 0;
	    }
		    .filters-right {
		      margin-left: auto;
		      display: inline-flex;
		      gap: 8px;
		      align-items: center;
		      flex: 0 0 auto;
		    }
	    .search-wrap {
	      position: relative;
	      display: inline-flex;
	      align-items: stretch;
	      flex: 0 0 320px;
	      width: 320px;
	      min-width: 320px;
	      max-width: 320px;
	    }
			    .search-wrap input[type="text"] {
			      width: 100%;
			      padding-right: 36px;
			      transition: width 0.16s ease;
			    }
		    /* Let the search box fill its flex parent; no fixed width needed. */
		    .search-wrap:focus-within input[type="text"] { width: 100%; }
	    .search-wrap.has-applied input[type="text"] {
	      border-color: #bfdbfe;
	      background: #f8fbff;
	    }
	    .search-wrap.is-dirty input[type="text"] {
	      border-color: #f59e0b;
	      box-shadow: 0 0 0 2px rgba(245, 158, 11, 0.12);
	    }
	    .search-clear-btn {
	      position: absolute;
	      top: 50%;
	      right: 8px;
	      transform: translateY(-50%);
	      width: 22px;
	      height: 22px;
	      border: none;
	      border-radius: 999px;
	      background: #e2e8f0;
	      color: #475569;
	      font-size: 14px;
	      line-height: 1;
	      display: none;
	      align-items: center;
	      justify-content: center;
	      cursor: pointer;
	      z-index: 2;
	    }
	    .search-clear-btn:hover {
	      background: #fecaca;
	      color: #b91c1c;
	    }
	    .suggest {
	      position: absolute;
	      top: 44px;
	      left: 0;
	      z-index: 60;
	      width: 460px;
	      max-width: min(460px, 92vw);
	      max-height: 340px;
	      overflow: auto;
	      background: #fff;
	      border: 1px solid #e5e7eb;
	      border-radius: 14px;
	      box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
	      padding: 8px;
	      display: none;
	    }
	    .suggest .group {
	      font-size: 11px;
	      font-weight: 700;
	      letter-spacing: 0.2px;
	      color: #64748b;
	      padding: 6px 8px 4px;
	      text-transform: uppercase;
	    }
	    .suggest .item {
	      display: flex;
	      gap: 10px;
	      align-items: flex-start;
	      padding: 8px 10px;
	      border-radius: 10px;
	      cursor: pointer;
	      transition: background 0.12s;
	    }
	    .suggest .item:hover,
	    .suggest .item.active { background: #f1f5f9; }
	    .suggest .item.quick {
	      border: 1px solid #e2e8f0;
	      background: linear-gradient(180deg, #ffffff, #f8fafc);
	      margin-bottom: 4px;
	    }
	    .suggest .item.quick:hover,
	    .suggest .item.quick.active {
	      background: linear-gradient(180deg, #eff6ff, #eef2ff);
	      border-color: #bfdbfe;
	    }
	    .suggest .main { flex: 1; min-width: 0; }
	    .suggest .title {
	      font-size: 13px;
	      font-weight: 650;
	      color: #0f172a;
	      line-height: 1.25;
	      white-space: nowrap;
	      overflow: hidden;
	      text-overflow: ellipsis;
	    }
	    .suggest .sub {
	      font-size: 12px;
	      color: #64748b;
	      margin-top: 2px;
	      white-space: nowrap;
	      overflow: hidden;
	      text-overflow: ellipsis;
	    }
	    .suggest .tag {
	      flex: 0 0 auto;
	      height: 20px;
	      padding: 0 8px;
	      border-radius: 999px;
	      border: 1px solid #e5e7eb;
	      font-size: 11px;
	      color: #334155;
	      background: #fff;
	      display: inline-flex;
	      align-items: center;
	    }
	    .suggest .tag.action {
	      border-color: #bfdbfe;
	      background: #eff6ff;
	      color: #1d4ed8;
	    }
	    .suggest .tag.city {
	      border-color: #bbf7d0;
	      background: #f0fdf4;
	      color: #166534;
	    }
	    .suggest .tag.market {
	      border-color: #99f6e4;
	      background: #f0fdfa;
	      color: #0f766e;
	    }
	    .suggest .tag.sub {
	      border-color: #fde68a;
	      background: #fffbeb;
	      color: #92400e;
	    }
	    .suggest .hint {
	      padding: 8px 10px 4px;
	      font-size: 12px;
	      color: #64748b;
	    }
	    .suggest .empty {
	      padding: 10px 10px;
	      font-size: 12px;
	      color: #64748b;
	    }
	    .mini-action {
	      height: 28px;
	      padding: 0 10px;
	      border-radius: 999px;
	      border: 1px solid #e5e7eb;
	      background: #fff;
	      color: #334155;
	      font-size: 12px;
	      cursor: pointer;
	      transition: all 0.12s;
	    }
	    .mini-action:hover { background: #f1f5f9; border-color: #cbd5e1; }
	    .empty-inline-note {
	      margin-top: 8px;
	      color: #64748b;
	      font-size: 12px;
	    }
	    .empty-inline-link {
	      margin-left: 6px;
	      border: none;
	      background: transparent;
	      color: #2563eb;
	      font-size: 12px;
	      font-weight: 600;
	      cursor: pointer;
	      padding: 0;
	    }
	    .empty-inline-link:hover { color: #1d4ed8; text-decoration: underline; }
	    select, input[type="text"] {
	      height: 40px;
	      padding: 8px 12px;
	      border: 1px solid #e5e7eb;
	      border-radius: 12px;
	      font-size: 13px;
	      background: #fff;
	      color: #374151;
	    }
	    /* Country 选择器 */
	    .country-wrap {
	      position: relative;
	      display: inline-flex;
	      align-items: stretch;
	      flex: 1 1 0;
	      min-width: 0;
	      height: 40px;
	    }
	    #country {
	      flex: 1 1 0;
	      min-width: 0;
	      font-size: 12px;
	      color: #6b7280;
	      border-color: #f0f0f0;
	      padding-right: 42px;
	      -webkit-appearance: none;
	      appearance: none;
	    }
	    .country-wrap::after {
	      content: '▾'; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
	      color: #9ca3af; font-size: 16px; pointer-events: none;
	      width: 16px; height: 16px; display: flex; align-items: center; justify-content: center;
	    }
	    .country-clear {
	      position: absolute; right: 24px; top: 50%; transform: translateY(-50%);
	      background: none; border: none; cursor: pointer;
	      color: #9ca3af; font-size: 16px; line-height: 1; font-family: inherit;
	      width: 16px; height: 16px;
	      display: flex; align-items: center; justify-content: center;
	      border-radius: 50%; padding: 0; z-index: 1;
	    }
	    .country-clear:hover { color: #ef4444; background: #fef2f2; }
    select:focus, input[type="text"]:focus {
      outline: none; border-color: #3b82f6;
      box-shadow: 0 0 0 2px rgba(59,130,246,0.1);
    }
	    /* 数据筛选 toggle 组（Points / FNC） */
	    .data-filter-wrapper {
	      position: relative;
	    }
	    .data-filter-group {
	      display: inline-flex;
	      align-items: stretch;
	      height: 42px;
	      border: 1px solid #e2e8f0;
	      border-radius: 12px;
	      overflow: hidden;
	      background: #fff;
	    }
	    .data-filter-btn {
	      height: 42px;
	      padding: 0 12px;
	      border: none;
	      border-radius: 0;
	      background: #fff;
	      font-size: 14px;
	      font-weight: 700;
	      color: #6b7280;
	      cursor: pointer;
	      transition: all 0.15s;
	      display: inline-flex;
	      align-items: center;
	      justify-content: center;
	      gap: 4px;
	      white-space: nowrap;
	    }
	    .data-filter-btn + .data-filter-btn { border-left: 1px solid #e2e8f0; }
	    .data-filter-btn:hover { background: #f3f4f6; }
	    .data-filter-btn.active { background: #3b82f6; color: #fff; }
	    .data-filter-btn .df-icon { font-size: 18px; line-height: 1; }
	    /* ── City Combobox ── */
	    .city-combo { position: relative; flex: 1 1 0; min-width: 0; }
	    .city-combo-trigger {
	      height: 40px;
	      width: 100%;
	      padding: 0 32px 0 12px;
	      border: 1px solid #e5e7eb;
	      border-radius: 12px;
	      background: #fff;
	      font-size: 13px;
	      color: #374151;
	      cursor: pointer;
	      display: flex;
	      align-items: center;
	      gap: 6px;
	      transition: border-color 0.15s;
	      position: relative;
	      user-select: none;
	    }
	    .city-combo-trigger:hover { border-color: #cbd5e1; }
	    .city-combo-trigger.open {
	      border-color: #3b82f6;
	      box-shadow: 0 0 0 2px rgba(59,130,246,0.1);
	      border-bottom-left-radius: 0;
	      border-bottom-right-radius: 0;
	    }
	    .city-combo-trigger .placeholder { color: #9ca3af; }
	    .city-combo-trigger .selected-city { font-weight: 500; }
	    .city-combo-trigger .clear-x {
	      position: absolute; right: 24px; top: 50%; transform: translateY(-50%);
	      color: #9ca3af; font-size: 16px; line-height: 1; cursor: pointer;
	      width: 16px; height: 16px;
	      display: flex; align-items: center; justify-content: center;
	      border-radius: 50%;
	    }
	    .city-combo-trigger .clear-x:hover { color: #ef4444; background: #fef2f2; }
	    .city-combo-trigger::after {
	      content: '▾'; position: absolute; right: 10px; top: 50%; transform: translateY(-50%);
	      color: #9ca3af; font-size: 16px; pointer-events: none;
	      width: 16px; height: 16px; display: flex; align-items: center; justify-content: center;
	    }
	    .city-combo-trigger .pin-icon { font-size: 14px; flex-shrink: 0; }

	    /* Popular chip */
	    .popular-row { display: flex; align-items: center; gap: 5px; padding: 3px 12px; flex-wrap: wrap; }
	    .popular-region-flag { font-size: 13px; flex-shrink: 0; width: 20px; text-align: center; }
	    .popular-chip {
	      padding: 3px 10px; border-radius: 99px; background: #f1f5f9;
	      color: #475569; font-size: 12px; cursor: pointer; border: none;
	      font-family: inherit; transition: background 0.1s; white-space: nowrap;
	    }
	    .popular-chip:hover { background: #e2e8f0; }
	    .popular-chip.active { background: #3b82f6; color: #fff; }

	    /* 下拉面板 */
	    .city-combo-panel {
	      position: absolute; top: 39px; left: 0;
	      width: 340px; max-height: 420px;
	      background: #fff; border: 1px solid #3b82f6; border-top: none;
	      border-radius: 0 0 12px 12px;
	      box-shadow: 0 8px 24px rgba(0,0,0,0.12);
	      z-index: 100; display: none; flex-direction: column; overflow: hidden;
	    }
	    .city-combo-panel.open { display: flex; }

	    /* 搜索框 */
	    .city-search-wrap { padding: 8px 10px; border-bottom: 1px solid #f1f5f9; flex-shrink: 0; }
	    .city-search-input {
	      width: 100%; height: 32px; padding: 0 8px 0 28px;
	      border: 1px solid #e5e7eb; border-radius: 8px;
	      font-size: 13px; font-family: inherit; color: #374151;
	      background: #f9fafb url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%239ca3af' width='14' height='14'%3E%3Cpath fill-rule='evenodd' d='M8 4a4 4 0 1 0 0 8 4 4 0 0 0 0-8ZM2 8a6 6 0 1 1 10.89 3.476l4.817 4.817a1 1 0 0 1-1.414 1.414l-4.816-4.816A6 6 0 0 1 2 8Z'/%3E%3C/svg%3E") 8px center no-repeat;
	      outline: none; transition: border-color 0.15s;
	    }
	    .city-search-input:focus { border-color: #3b82f6; }
	    .city-search-input::placeholder { color: #9ca3af; }

	    /* 列表区域 */
	    .city-list { overflow-y: auto; flex: 1; }
	    .city-group-label {
	      padding: 6px 12px 4px; font-size: 11px; font-weight: 600;
	      color: #94a3b8;
	      background: #f8fafc; position: sticky; top: 0;
	    }
	    .city-item {
	      padding: 8px 12px; font-size: 13px; color: #374151;
	      cursor: pointer; display: flex; align-items: center; gap: 8px;
	      transition: background 0.1s;
	    }
	    .city-item:hover { background: #f1f5f9; }
	    .city-item.active { background: #eff6ff; color: #2563eb; font-weight: 500; }
	    .city-item .country-tag { font-size: 11px; color: #94a3b8; margin-left: auto; flex-shrink: 0; }
	    .city-item .flag { font-size: 14px; flex-shrink: 0; }
	    .city-item .city-name { flex: 1; }
	    .city-item .city-name b { font-weight: 700; color: #1e293b; }
	    .city-empty { padding: 24px 12px; text-align: center; color: #94a3b8; font-size: 13px; }
	    .city-hint {
	      padding: 6px 12px 8px; font-size: 11px; color: #b0b8c4;
	      text-align: center; border-top: 1px solid #f1f5f9;
	    }

	    /* A-Z 折叠展开 */
	    .az-toggle {
	      padding: 7px 12px; font-size: 12px; color: #3b82f6;
	      cursor: pointer; display: flex; align-items: center; gap: 4px;
	      background: #f8fafc; border: none; border-top: 1px solid #f1f5f9;
	      width: 100%; font-family: inherit; text-align: left;
	    }
	    .az-toggle:hover { background: #eff6ff; }
	    .az-toggle .az-arrow { font-size: 10px; transition: transform 0.15s; }
	    .az-toggle.expanded .az-arrow { transform: rotate(90deg); }
	    .az-letter {
	      padding: 4px 12px 2px; font-size: 11px; font-weight: 700;
	      color: #3b82f6; background: #f8fafc; position: sticky; top: 0;
	    }

	    /* Recent 区域 */
	    .recent-bar {
	      padding: 6px 34px 6px 12px; display: flex; align-items: center;
	      gap: 5px 6px; border-bottom: 1px solid #f1f5f9;
	      position: relative; max-height: 58px; overflow: hidden;
	    }
	    .recent-label { font-size: 11px; color: #94a3b8; font-weight: 600; flex-shrink: 0; }
	    .recent-chip-list {
	      display: flex; align-items: center; gap: 5px 6px;
	      flex: 1 1 auto; flex-wrap: wrap; max-height: 48px; overflow: hidden; min-width: 0;
	    }
	    .recent-chip {
	      padding: 3px 10px; border-radius: 99px; background: #f1f5f9;
	      color: #475569; font-size: 12px; cursor: pointer; border: none;
	      font-family: inherit; transition: background 0.1s; white-space: nowrap;
	    }
	    .recent-chip:hover { background: #e2e8f0; }
	    .recent-chip.active { background: #3b82f6; color: #fff; }
	    .recent-clear {
	      color: #c0c7d0; cursor: pointer; border: none; background: none;
	      padding: 2px; line-height: 0; position: absolute; right: 12px; top: 50%;
	      transform: translateY(-50%);
	    }
	    .recent-clear:hover { color: #ef4444; }
	    .recent-clear svg { width: 14px; height: 14px; }
	    .cpp-rank-btn {
	      height: 42px;
	      min-width: 110px;
	      padding: 0 14px;
	      border: 1px solid #e2e8f0;
	      background: #f8fafc;
	      border-radius: 12px;
	      font-size: 14px;
	      font-weight: 700;
	      color: #334155;
	      cursor: pointer;
	      transition: all 0.15s;
	      display: inline-flex;
	      align-items: center;
	      justify-content: center;
	      gap: 4px;
	    }
	    .cpp-rank-label { white-space: nowrap; }
    .cpp-rank-btn:hover { background: #f1f5f9; border-color: #cbd5e1; }
    .cpp-rank-btn.active { background: linear-gradient(135deg, #fef3c7, #fde68a); color: #92400e; border-color: #f59e0b; }
	    .map-btn {
	      width: 44px; height: 40px; padding: 0;
	      border: 1px solid #bbf7d0; background: #fff;
	      border-radius: 10px; font-size: 13px; font-weight: 600; color: #16a34a;
	      cursor: pointer; transition: all 0.15s;
	      display: inline-flex; align-items: center; justify-content: center;
	    }
	    .map-btn:hover { background: #f0fdf4; border-color: #86efac; }
		    .map-btn.active { background: #16a34a; border-color: #16a34a; color: #fff; }
	    .cal-btn {
	      width: 44px; height: 40px; padding: 0;
	      border: 1px solid #fecaca; background: #fff;
	      border-radius: 10px; font-size: 13px; font-weight: 600; color: #ef4444;
	      cursor: pointer; transition: all 0.15s;
	      display: inline-flex; align-items: center; justify-content: center;
	    }
	    .cal-btn:hover { background: #fff1f2; border-color: #fca5a5; }
		    .view-btn {
		      width: 44px; height: 40px; padding: 0;
		      border: 1px solid #e5e7eb; background: #fff;
		      border-radius: 10px; font-size: 13px; font-weight: 600; color: #111827;
		      cursor: pointer; transition: all 0.15s;
		      display: inline-flex; align-items: center; justify-content: center;
		    }
		    .view-btn:hover { background: #f3f4f6; }
		    .view-btn.active { background: #2563eb; border-color: #2563eb; color: #fff; }
		    .view-toggle {
		      display: inline-flex;
		      align-items: center;
		      justify-content: center;
		      height: 40px;
		      border: 1px solid #e5e7eb;
		      border-radius: 12px;
		      overflow: hidden;
		      background: #fff;
		      flex: 0 0 auto;
		    }
		    .view-toggle .view-btn,
		    .view-toggle .cal-btn,
		    .view-toggle .map-btn {
		      border: none;
		      border-radius: 0;
		      box-shadow: none;
		    }
		    .view-toggle .view-btn { width: 44px; height: 40px; }
		    .view-toggle .cal-btn { width: 44px; height: 40px; }
		    .view-toggle .map-btn { width: 44px; height: 40px; }
		    .view-toggle .view-btn + .cal-btn { border-left: 1px solid #e5e7eb; }
		    .view-toggle .cal-btn + .map-btn { border-left: 1px solid #e5e7eb; }
		    .alerts-btn {
		      height: 42px; min-width: 110px; padding: 0 14px 0 10px;
		      border: 1px solid #e2e8f0; background: #fff;
		      border-radius: 12px; color: #f59e0b;
		      cursor: pointer; transition: all 0.15s;
		      display: inline-flex; align-items: center; justify-content: center; gap: 6px;
		      position: relative;
		    }
		    .alerts-btn:hover { background: #f8fafc; border-color: #cbd5e1; }
		    .alerts-btn-icon { flex: 0 0 auto; }
		    .alerts-btn-label {
		      font-size: 14px;
		      font-weight: 700;
		      color: #334155;
		      white-space: nowrap;
		    }
		    .alerts-badge {
		      position: absolute;
		      top: -4px;
		      right: -4px;
		      min-width: 16px;
		      height: 16px;
		      padding: 0 4px;
		      border-radius: 999px;
		      background: #ef4444;
		      color: #fff;
		      font-size: 10px;
		      font-weight: 750;
		      display: none;
		      align-items: center;
		      justify-content: center;
		      box-shadow: 0 6px 16px rgba(15, 23, 42, 0.18);
		    }
		    .alerts-usage-chip {
		      height: 28px;
		      min-width: 58px;
		      padding: 0 10px;
		      border-radius: 999px;
		      border: 1px solid #e5e7eb;
		      background: #fff;
		      color: #475569;
		      font-size: 12px;
		      font-weight: 700;
		      display: none;
		      align-items: center;
		      justify-content: center;
		      white-space: nowrap;
		    }
		    .alerts-usage-chip.free {
		      background: #f8fafc;
		      border-color: #e5e7eb;
		      color: #475569;
		    }
		    .alerts-usage-chip.pro {
		      background: #f0fdf4;
		      border-color: #86efac;
		      color: #166534;
		    }
		    .auth-btn {
		      height: 40px;
		      padding: 0 12px;
		      border: 1px solid #e5e7eb;
		      background: #fff;
		      border-radius: 12px;
		      cursor: pointer;
		      font-size: 12px;
		      font-weight: 700;
		      color: #111827;
		      transition: all 0.15s;
		    }
		    .auth-btn:hover { background: #f3f4f6; }
		    .auth-btn.signed {
		      border-color: #c7d2fe;
		      background: #eef2ff;
		      color: #3730a3;
		    }
	    .results-panel { margin-top: 10px; }
		    body.view-map .fnc-summary-bar,
		    body.view-map .featured-hint,
		    body.view-map .summary-bar,
		    body.view-map .stats,
		    body.view-map .empty-state {
		      display: none !important;
		    }
		    body.view-map .results-panel {
		      margin-top: 8px;
		    }
	    #mapPanel {
	      display: none;
	      position: relative;
	      height: calc(100vh - 360px);
	      min-height: 520px;
	    }
	    body.view-map #mapPanel {
	      height: calc(100vh - 170px);
	      min-height: 640px;
	    }
	    #mapFrame {
	      width: 100%;
	      height: 100%;
	      border: 0;
	      border-radius: 14px;
	      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.12);
	      background: #fff;
	    }
	    .map-frame-loading {
	      position: absolute;
	      inset: 0;
	      z-index: 3;
	      display: flex;
	      align-items: center;
	      justify-content: center;
	      border-radius: 14px;
	      background: rgba(248, 250, 252, 0.52);
	      backdrop-filter: blur(2px);
	      pointer-events: none;
	    }
	    .map-frame-loading.hidden {
	      display: none !important;
	    }
	    .map-frame-loading-card {
	      min-width: 260px;
	      max-width: min(360px, calc(100vw - 48px));
	      border: 1px solid rgba(226, 232, 240, 0.95);
	      background: rgba(255, 255, 255, 0.96);
	      box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16);
	      border-radius: 12px;
	      padding: 16px 18px 14px;
	      display: grid;
	      grid-template-columns: 32px 1fr;
	      gap: 10px 12px;
	      align-items: center;
	    }
	    .map-frame-spinner {
	      width: 28px;
	      height: 28px;
	      border-radius: 999px;
	      border: 3px solid #dbeafe;
	      border-top-color: #2563eb;
	      animation: mapFrameSpin 0.85s linear infinite;
	    }
	    .map-frame-loading-title {
	      color: #111827;
	      font-weight: 800;
	      line-height: 1.2;
	    }
	    .map-frame-loading-stage {
	      margin-top: 3px;
	      color: #64748b;
	      font-size: 12px;
	      font-weight: 600;
	    }
	    .map-frame-loading-bar {
	      grid-column: 1 / -1;
	      height: 3px;
	      overflow: hidden;
	      border-radius: 999px;
	      background: #e2e8f0;
	    }
	    .map-frame-loading-bar span {
	      display: block;
	      width: 38%;
	      height: 100%;
	      border-radius: inherit;
	      background: linear-gradient(90deg, #16a34a, #2563eb);
	      animation: mapFrameLoadingBar 1.15s ease-in-out infinite;
	    }
	    @keyframes mapFrameSpin {
	      to { transform: rotate(360deg); }
	    }
	    @keyframes mapFrameLoadingBar {
	      0% { transform: translateX(-110%); }
	      100% { transform: translateX(280%); }
	    }
    /* Table row click (opens drawer) */
    #tbody tr { cursor: pointer; }

    /* Drawer (right side) */
    .drawer-backdrop {
      position: fixed;
      inset: 0;
      background: rgba(15, 23, 42, 0.35);
      display: none;
      align-items: stretch;
      justify-content: flex-end;
      z-index: 9000;
      padding: 0;
    }
    .drawer-backdrop.show { display: flex; }
    .drawer {
      width: 420px;
      max-width: 92vw;
      background: #fff;
      border-left: 1px solid #e5e7eb;
      box-shadow: -20px 0 60px rgba(15, 23, 42, 0.25);
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      transform: translateX(12px);
      opacity: 0;
      transition: transform 0.18s ease, opacity 0.18s ease;
      /* P2.6 fix: 内容超过屏高时可滚(原 inset:0 的 backdrop align-items:stretch 让 drawer 高 = 屏高,
         但没设 overflow-y 导致超出内容被裁。Triggered 行多时直接看不到底部。) */
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior: contain;
    }
    .drawer-backdrop.show .drawer { transform: translateX(0); opacity: 1; }
    .drawer-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
      padding-bottom: 10px;
      border-bottom: 1px solid #f1f5f9;
    }
    .drawer-title {
      font-size: 15px;
      font-weight: 700;
      color: #0f172a;
      line-height: 1.25;
    }
    .drawer-close {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      border: 1px solid #e5e7eb;
      background: #fff;
      cursor: pointer;
      color: #334155;
      font-size: 18px;
      line-height: 1;
    }
    .drawer-close:hover { background: #f3f4f6; }
    .drawer-meta {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      align-items: center;
      color: #475569;
      font-size: 12px;
    }
    .drawer-pill {
      height: 28px;
      padding: 0 10px;
      border: 1px solid #e5e7eb;
      border-radius: 999px;
      background: #fff;
      display: inline-flex;
      align-items: center;
      gap: 6px;
      white-space: nowrap;
    }
    .drawer-actions {
      display: flex;
      gap: 10px;
      align-items: center;
      flex-wrap: wrap;
    }
    .drawer-action {
      height: 38px;
      padding: 0 12px;
      border: 1px solid #e5e7eb;
      border-radius: 12px;
      background: #fff;
      cursor: pointer;
      font-size: 12px;
      font-weight: 600;
      color: #111827;
    }
	    .drawer-action:hover { background: #f3f4f6; }
	    .drawer-action.primary {
	      background: #111827;
	      color: #fff;
	      border-color: #111827;
	    }
	    .drawer-action.primary:hover { background: #0b1220; }

	    /* Alerts panel + modal */
	    .panel-section-title {
	      font-size: 12px;
	      font-weight: 750;
	      color: #0f172a;
	      margin-top: 6px;
	    }
	    .panel-muted {
	      font-size: 12px;
	      color: #64748b;
	    }
	    /* v2.1-P2.6 抽屉信息升级:卡片改竖排,name 允许 wrap 2 行,actions 图标化释放空间 */
	    /* ================================================================
	       Alerts v2 重设计（2026-04-29）
	       视觉对齐 wallet v2.3：Pro 黑底+金 / Free 白底；alert card 状态色 token
	       Mockup: docs/mockups/alerts-redesign-2026-04-29-wallet-aligned.html
	       ================================================================ */
	    /* === Alerts header === */
	    /* 注:.alerts-drawer 自身的 max-height/max-width 规则放在文件后面 .wallet-drawer 旁边,
	       必须在 .drawer @media (max-width:720px) 之后才能覆盖 mobile 的 max-width:100%。
	       PR #150/#151 教训:加在这里(@media 之前)mobile 不生效。 */
	    .alerts-drawer .alerts-header {
	      padding: 12px 14px;
	      border-bottom: 1px solid #e5e7eb;
	      display: flex; align-items: center; gap: 8px;
	      flex: 0 0 auto;
	      transition: background 0.2s, box-shadow 0.2s;
	      margin: -14px -14px 0;  /* 抵消 .drawer padding 让 header 撑满 */
	    }
	    .alerts-drawer .alerts-header.alerts-header-pro {
	      background: linear-gradient(135deg, #1e2026, #2a2520, #3a2e1a);
	      border-bottom-color: #4a3f2a;
	      box-shadow: 0 2px 12px rgba(212, 175, 55, 0.08);
	    }
	    .alerts-drawer .alerts-header.alerts-header-free { background: #fff; }
	    .alerts-drawer .alerts-icon {
	      width: 28px; height: 28px;
	      border-radius: 8px;
	      display: inline-flex; align-items: center; justify-content: center;
	      font-size: 16px;
	      flex: 0 0 auto;
	    }
	    .alerts-drawer .alerts-header-pro .alerts-icon {
	      background: rgba(212, 175, 55, 0.2); color: #f5d060;
	    }
	    .alerts-drawer .alerts-header-free .alerts-icon {
	      background: #f1f5f9; color: #64748b;
	    }
	    .alerts-drawer .alerts-title { font-weight: 700; font-size: 15px; }
	    .alerts-drawer .alerts-header-pro .alerts-title { color: #fef3c7; }
	    .alerts-drawer .alerts-header-free .alerts-title { color: #0f172a; }
	    .alerts-drawer .alerts-plan-badge {
	      font-size: 10px; font-weight: 800;
	      padding: 2px 8px; border-radius: 4px;
	      text-transform: uppercase; letter-spacing: 0.04em;
	      margin-left: 4px;
	    }
	    .alerts-drawer .alerts-header-pro .alerts-plan-badge {
	      background: linear-gradient(135deg, #d4af37, #f5d060);
	      color: #fff; text-shadow: 0 1px 2px rgba(0,0,0,0.15);
	    }
	    .alerts-drawer .alerts-header-free .alerts-plan-badge {
	      background: #f1f5f9; color: #64748b;
	    }
	    .alerts-drawer .alerts-count {
	      margin-left: auto; font-size: 12px; font-weight: 500;
	      font-variant-numeric: tabular-nums;
	    }
	    .alerts-drawer .alerts-header-pro .alerts-count { color: #d6d3d1; }
	    .alerts-drawer .alerts-header-free .alerts-count { color: #475569; }
	    .alerts-drawer .alerts-upgrade-btn {
	      background: linear-gradient(135deg, #fef3c7, #fde68a);
	      color: #92400e;
	      border: 1px solid #fcd34d;
	      border-radius: 20px;
	      padding: 4px 12px;
	      font-size: 11px; font-weight: 700;
	      cursor: pointer;
	      display: inline-flex; align-items: center; gap: 4px;
	      text-decoration: none;
	      white-space: nowrap;
	    }
	    .alerts-drawer .alerts-upgrade-btn:hover { box-shadow: 0 2px 8px rgba(252, 211, 77, 0.4); }
	    .alerts-drawer .alerts-close-btn {
	      width: 28px; height: 28px;
	      border: 1px solid #e5e7eb;
	      border-radius: 8px;
	      background: #fff;
	      cursor: pointer; font-size: 14px;
	      color: #64748b;
	      display: inline-flex; align-items: center; justify-content: center;
	      padding: 0;
	    }
	    .alerts-drawer .alerts-header-pro .alerts-close-btn {
	      background: rgba(255,255,255,0.1);
	      border-color: rgba(255,255,255,0.2);
	      color: #fef3c7;
	    }
	    .alerts-drawer .alerts-close-btn:hover { background: #f3f4f6; }

	    /* === Alerts content === */
	    .alerts-drawer .alerts-content {
	      flex: 1 1 auto;
	      overflow-y: auto;
	      padding-top: 12px;
	      margin: 0 -14px;
	      padding-left: 14px;
	      padding-right: 14px;
	      padding-bottom: 8px;
	    }
	    .alerts-drawer .alerts-section-title {
	      font-size: 12px; font-weight: 700;
	      color: #475569;
	      margin: 4px 0 8px;
	      letter-spacing: 0;
	      text-transform: none;
	    }
	    .alerts-drawer .alerts-section-title .count {
	      color: #94a3b8; font-weight: 500;
	      font-size: 11px; margin-left: 4px;
	    }
	    .alerts-drawer .alerts-section-divider {
	      border: none; border-top: 1px solid #e5e7eb;
	      margin: 18px 0 10px;
	    }
	    .alerts-drawer .alerts-list-container {
	      display: flex; flex-direction: column; gap: 0;
	    }
	    .alerts-drawer .alerts-hint {
	      font-size: 11px; color: #94a3b8;
	      margin-top: 6px;
	    }

	    /* === Free upsell strip === */
	    .alerts-drawer .alerts-upsell-strip {
	      background: #fffbeb;
	      border: 1px solid #fde68a;
	      border-radius: 8px;
	      padding: 10px 12px;
	      margin-bottom: 12px;
	      font-size: 12px; color: #78350f;
	      line-height: 1.4;
	      display: flex; align-items: center; gap: 8px;
	    }
	    .alerts-drawer .alerts-upsell-strip .star {
	      color: #d97706; font-size: 14px; flex: 0 0 auto;
	    }
	    .alerts-drawer .alerts-upsell-strip b { color: #78350f; }

	    /* === Alert card (重设计核心) === */
	    /* 保留 .alert-item 兼容，新加 .alert-card 同义 */
	    .alert-item, .alert-card {
	      position: relative;
	      padding: 10px 12px 10px 10px;
	      margin-bottom: 8px;
	      border: 1px solid #f1f5f9;
	      border-radius: 8px;
	      border-left: 3px solid transparent;
	      background: #fff;
	      display: flex;
	      flex-direction: column;
	      gap: 4px;
	      transition: background 0.15s, border-color 0.15s;
	    }
	    .alert-item:last-child, .alert-card:last-child { margin-bottom: 0; }
	    /* Active alert: 金色左条 + 暖背景（与 wallet my card 视觉一致） */
	    .alert-item.active, .alert-card.active {
	      background: linear-gradient(to right, #fffbeb, #fefce8);
	      border-color: #fde68a;
	      border-left-color: #d4af37;
	    }
	    /* Disabled alert: 灰条 + 灰底 */
	    .alert-item.disabled, .alert-card.disabled {
	      background: #f8fafc;
	      border-color: #e5e7eb;
	      border-left-color: #cbd5e1;
	      opacity: 0.85;
	    }
	    .alert-item.disabled .name, .alert-card.disabled .name { color: #64748b; }
	    /* Expired alert: 暗灰 + 暖灰底 */
	    .alert-item.expired, .alert-card.expired {
	      background: #fafaf9;
	      border-color: #e7e5e4;
	      border-left-color: #94a3b8;
	    }
	    .alert-item.expired .name, .alert-card.expired .name { color: #57534e; }
	    /* Triggered card: 橙红条 + 暖黄背景（紧迫感） */
	    .alert-item.triggered, .alert-card.triggered {
	      background: linear-gradient(to right, #fff7ed, #fef3c7);
	      border-color: #fed7aa;
	      border-left-color: #ea580c;
	    }
	    .alert-item .row-1, .alert-card .row-1 {
	      display: flex; align-items: flex-start; justify-content: space-between;
	      gap: 8px;
	    }
	    .alert-item .name-block, .alert-card .name-block { flex: 1; min-width: 0; }
	    .alert-item .name, .alert-card .name {
	      font-weight: 700; color: #0f172a;
	      font-size: 13px; line-height: 1.35;
	      display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
	      overflow: hidden; word-break: break-word;
	    }
	    .alert-item .badges, .alert-card .badges {
	      margin-top: 4px;
	      display: flex; flex-wrap: wrap; gap: 4px;
	    }
	    .alert-item .desc, .alert-card .desc {
	      font-size: 12px; color: #475569;
	      line-height: 1.5;
	      word-break: break-word;
	    }
	    /* desc 内 threshold（用户设定的价格 / 积分）加深突出 */
	    .alert-item .desc .threshold, .alert-card .desc .threshold {
	      color: #0f172a; font-weight: 700;
	      font-variant-numeric: tabular-nums;
	    }
	    .alert-item .desc .date-range, .alert-card .desc .date-range {
	      color: #475569;
	      font-variant-numeric: tabular-nums;
	    }
	    .alert-item .desc .sep, .alert-card .desc .sep {
	      color: #cbd5e1; margin: 0 4px;
	    }
	    .alert-item .status, .alert-card .status {
	      font-size: 11px; color: #64748b;
	      line-height: 1.5;
	      word-break: break-word;
	    }
	    .alert-item .status .strong, .alert-card .status .strong {
	      color: #0f172a; font-weight: 600;
	    }
	    .alert-item .status .sep, .alert-card .status .sep {
	      color: #cbd5e1; margin: 0 2px;
	    }
	    .alert-item .actions, .alert-card .actions {
	      display: inline-flex; gap: 4px; align-items: center;
	      flex: 0 0 auto;
	    }
	    .alert-item .icon-btn, .alert-card .icon-btn {
	      width: 28px; height: 28px;
	      border: 1px solid transparent;
	      border-radius: 6px;
	      background: transparent;
	      cursor: pointer;
	      display: inline-flex; align-items: center; justify-content: center;
	      padding: 0;
	      color: #64748b;
	    }
	    .alert-item .icon-btn:hover, .alert-card .icon-btn:hover {
	      background: rgba(15, 23, 42, 0.06); color: #0f172a;
	    }
	    .alert-item .icon-btn.danger, .alert-card .icon-btn.danger { color: #b91c1c; }
	    .alert-item .icon-btn.danger:hover, .alert-card .icon-btn.danger:hover {
	      background: rgba(220, 38, 38, 0.08); color: #991b1b;
	    }
	    .alert-item .icon-btn svg, .alert-card .icon-btn svg {
	      width: 14px; height: 14px; display: block;
	    }
	    /* Toggle switch */
	    .alert-item .toggle, .alert-card .toggle {
	      width: 32px; height: 18px;
	      border-radius: 999px;
	      background: #cbd5e1;
	      position: relative; cursor: pointer;
	      flex: 0 0 auto; border: none; padding: 0;
	      transition: background 0.18s;
	    }
	    .alert-item .toggle::after, .alert-card .toggle::after {
	      content: ''; position: absolute;
	      top: 2px; left: 2px;
	      width: 14px; height: 14px;
	      background: #fff;
	      border-radius: 50%;
	      transition: transform 0.18s;
	      box-shadow: 0 1px 3px rgba(0,0,0,0.2);
	    }
	    .alert-item .toggle.on, .alert-card .toggle.on { background: #16a34a; }
	    .alert-item .toggle.on::after, .alert-card .toggle.on::after { transform: translateX(14px); }
	    .alert-item .toggle:disabled, .alert-card .toggle:disabled { opacity: 0.6; cursor: not-allowed; }

	    /* === State badges 7 色 token (重新设计:每个状态独立色彩,语义信号清晰) === */
	    .alert-state-badge {
	      display: inline-flex; align-items: center;
	      font-size: 9.5px; font-weight: 600;
	      padding: 2px 7px;
	      border-radius: 4px;
	      letter-spacing: 0.02em;
	      gap: 3px;
	    }
	    .alert-state-badge .dot {
	      width: 5px; height: 5px;
	      border-radius: 50%;
	      display: inline-block;
	      flex: 0 0 auto;
	    }
	    /* fresh: 绿色（数据新鲜） */
	    .alert-state-badge.fresh { background: #d1fae5; color: #047857; }
	    .alert-state-badge.fresh .dot { background: #059669; box-shadow: 0 0 4px rgba(5, 150, 105, 0.5); }
	    /* refreshing: 蓝色（正在重抓，脉动动画） */
	    .alert-state-badge.refreshing { background: #dbeafe; color: #1e40af; }
	    .alert-state-badge.refreshing .dot {
	      background: #2563eb;
	      box-shadow: 0 0 4px rgba(37, 99, 235, 0.5);
	      animation: alert-pulse 1.4s ease-in-out infinite;
	    }
	    /* pending-first: 紫色（首次入队） */
	    .alert-state-badge.pending { background: #ede9fe; color: #5b21b6; }
	    .alert-state-badge.pending .dot { background: #7c3aed; }
	    /* stale: 橙色（数据偏旧但仍可用） */
	    .alert-state-badge.stale { background: #fed7aa; color: #9a3412; }
	    .alert-state-badge.stale .dot { background: #ea580c; }
	    /* expired: 灰色（已失效） */
	    .alert-state-badge.expired { background: #e7e5e4; color: #57534e; }
	    .alert-state-badge.expired .dot { background: #78716c; }
	    /* no-availability: 黄色（暂无房） */
	    .alert-state-badge.no-availability { background: #fef3c7; color: #92400e; }
	    .alert-state-badge.no-availability .dot { background: #d97706; }
	    /* no-metric-match: 红色（数据有但 metric 不符） */
	    .alert-state-badge.no-metric-match { background: #fee2e2; color: #991b1b; }
	    .alert-state-badge.no-metric-match .dot { background: #dc2626; }
	    @keyframes alert-pulse {
	      0%, 100% { opacity: 1; }
	      50%      { opacity: 0.35; }
	    }

	    /* === Triggered card variant === */
	    .alert-item.triggered .triggered-action,
	    .alert-card.triggered .triggered-action {
	      display: flex; align-items: flex-start; gap: 6px;
	      margin-top: 4px;
	    }
	    .alert-item.triggered .triggered-price,
	    .alert-card.triggered .triggered-price {
	      font-size: 22px; font-weight: 800;
	      color: #c2410c;
	      font-variant-numeric: tabular-nums;
	      line-height: 1;
	    }
	    .alert-item.triggered .triggered-meta,
	    .alert-card.triggered .triggered-meta {
	      font-size: 11px; color: #9a3412;
	      margin-top: 4px;
	    }
	    .alert-item.triggered .dismiss-btn,
	    .alert-card.triggered .dismiss-btn {
	      font-family: inherit;
	      font-size: 11px; font-weight: 600;
	      padding: 4px 10px;
	      border: 1px solid #e5e7eb;
	      border-radius: 6px;
	      background: #fff;
	      color: #64748b;
	      cursor: pointer;
	    }
	    .alert-item.triggered .dismiss-btn:hover,
	    .alert-card.triggered .dismiss-btn:hover {
	      background: #f3f4f6; color: #0f172a;
	    }

	    /* === Empty state === */
	    .alerts-empty {
	      text-align: center;
	      padding: 32px 16px 24px;
	      color: #94a3b8;
	      background: #f8fafc;
	      border: 1px dashed #cbd5e1;
	      border-radius: 10px;
	      margin-bottom: 8px;
	    }
	    .alerts-empty.compact {
	      padding: 16px 16px 14px;
	    }
	    .alerts-empty-icon {
	      font-size: 32px; margin-bottom: 8px;
	      color: #cbd5e1;
	    }
	    .alerts-empty-title {
	      font-size: 14px; font-weight: 700;
	      color: #475569; margin-bottom: 4px;
	    }
	    .alerts-empty-desc {
	      font-size: 12px; color: #94a3b8;
	      line-height: 1.5;
	      max-width: 280px;
	      margin: 0 auto 12px;
	    }
	    .alerts-empty-cta {
	      display: inline-flex; align-items: center; gap: 4px;
	      font-size: 12px; font-weight: 700;
	      padding: 6px 14px;
	      background: #0f172a; color: #fff;
	      border-radius: 8px; border: none;
	      cursor: pointer;
	      font-family: inherit;
	    }
	    .alerts-empty-cta:hover { background: #1e293b; }

	    /* mode badge (any_night / 降级提示):跟 state badge 同 base 样式保证垂直居中
	       v2.1-P2.5 原 inline-style 不带 align-items 在 flex container 里 baseline 对齐错位 */
	    .alert-mode-badge {
	      display: inline-flex;
	      align-items: center;
	      font-size: 10px;
	      font-weight: 600;
	      padding: 1px 6px;
	      border-radius: 4px;
	      line-height: 1.6;
	      background: #2563eb;
	      color: #fff;
	    }
	    .alert-mode-badge.downgraded {
	      background: #d97706;
	    }

	    /* mini-btn 全局样式: P2.6 改造前 alerts list 用,改造后 alerts list 已迁 icon-btn + toggle,
	       events dismiss 在 v2 redesign 已改为 .dismiss-btn,
	       仅剩 alert-modal.html 的 #alertAutofillSeven 仍用 .mini-btn,
	       必须保持全局 .mini-btn 样式可用(P2.6 第一版误把它收窄到 #alertsEvents 破坏了 modal autofill 按钮) */
	    .mini-btn {
	      height: 30px;
	      padding: 0 10px;
	      border: 1px solid #e5e7eb;
	      border-radius: 10px;
	      background: #fff;
	      cursor: pointer;
	      font-size: 12px;
	      color: #111827;
	    }
	    .mini-btn:hover { background: #f3f4f6; }
	    .mini-btn.danger { border-color: #fecaca; color: #b91c1c; }
	    .mini-btn.danger:hover { background: #fef2f2; }
	    .mini-btn.on { background: #dcfce7; border-color: #86efac; color: #166534; }
	    .mini-btn.off { background: #f3f4f6; border-color: #e5e7eb; color: #334155; }

	    .drawer-kv {
	      display: flex;
	      flex-direction: column;
	      gap: 8px;
      padding-top: 8px;
    }
    .kv-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 10px 10px;
      border: 1px solid #f1f5f9;
      background: #fafafa;
      border-radius: 12px;
      font-size: 13px;
    }
    .kv-row .k { color: #64748b; font-weight: 600; }
    .kv-row .v { color: #0f172a; font-weight: 700; }
    .kv-row .v .na { font-weight: 500; }
    .equiv-via { font-size: 11px; font-weight: 500; color: #64748b; }
    .equiv-ok { color: #16a34a; font-weight: 700; }
    .equiv-short { font-size: 11px; font-weight: 600; color: #dc2626; }
    /* 预订建议 */
    .drawer-suggestion {
      margin-top: 4px;
      padding: 10px 12px;
      border-radius: 12px;
      background: linear-gradient(135deg, #f0fdf4, #ecfdf5);
      border: 1px solid #bbf7d0;
      font-size: 13px;
      font-weight: 600;
      color: #166534;
    }
    .suggestion-icon { margin-right: 4px; }
	    @media (max-width: 720px) {
	      .drawer-backdrop { justify-content: stretch; }
	      .drawer {
	        width: 100%;
        max-width: 100%;
        border-left: none;
        border-top: 1px solid #e5e7eb;
        border-radius: 16px 16px 0 0;
        margin-top: auto;
        box-shadow: 0 -20px 60px rgba(15, 23, 42, 0.18);
      }
    }
    /* ========== Flatpickr Theme System ========== */
    /* CSS Variables for theming - change these to switch themes */
    :root {
      /* Default: Sunset theme */
      --fp-bg-start: #fffbf5;
      --fp-bg-end: #fef7f0;
      --fp-border: #fed7aa;
      --fp-shadow: rgba(251, 146, 60, 0.15);
      --fp-month: #c2410c;
      --fp-nav: #ea580c;
      --fp-weekday: #d97706;
      --fp-day-current: #be123c;
      --fp-day-other: #fb923c;
      --fp-day-disabled: #fdba74;
      --fp-hover-start: #f43f5e;
      --fp-hover-end: #ec4899;
      --fp-selected-start: #e11d48;
      --fp-selected-end: #db2777;
      --fp-today: #f43f5e;
    }
    .flatpickr-calendar {
      background: linear-gradient(180deg, var(--fp-bg-start) 0%, var(--fp-bg-end) 100%);
      border: 1px solid var(--fp-border);
      box-shadow: 0 8px 32px var(--fp-shadow);
      border-radius: 12px;
    }
    .flatpickr-months .flatpickr-month {
      background: transparent;
      color: var(--fp-month);
      font-weight: 700;
    }
    .flatpickr-current-month .flatpickr-monthDropdown-months,
    .flatpickr-current-month input.cur-year {
      color: var(--fp-month);
      font-weight: 700;
    }
    .flatpickr-months .flatpickr-prev-month,
    .flatpickr-months .flatpickr-next-month {
      color: var(--fp-nav);
      fill: var(--fp-nav);
    }
    .flatpickr-months .flatpickr-prev-month:hover,
    .flatpickr-months .flatpickr-next-month:hover {
      color: var(--fp-month);
      fill: var(--fp-month);
    }
    .flatpickr-months .flatpickr-prev-month svg,
    .flatpickr-months .flatpickr-next-month svg {
      fill: inherit;
    }
    .flatpickr-weekdays { background: transparent; }
    span.flatpickr-weekday {
      color: var(--fp-weekday);
      font-weight: 600;
      font-size: 12px;
    }
    .flatpickr-day {
      border-radius: 8px;
      font-weight: 500;
    }
    .flatpickr-day:not(.prevMonthDay):not(.nextMonthDay):not(.flatpickr-disabled) {
      color: var(--fp-day-current);
    }
    .flatpickr-day.prevMonthDay:not(.flatpickr-disabled),
    .flatpickr-day.nextMonthDay:not(.flatpickr-disabled) {
      color: var(--fp-day-other);
    }
    .flatpickr-day.flatpickr-disabled {
      color: var(--fp-day-disabled) !important;
      text-decoration: line-through;
      opacity: 0.6;
    }
    .flatpickr-day:not(.flatpickr-disabled):hover {
      background: linear-gradient(135deg, var(--fp-hover-start), var(--fp-hover-end));
      color: #fff;
      border-color: transparent;
    }
    .flatpickr-day.selected,
    .flatpickr-day.selected:hover {
      background: linear-gradient(135deg, var(--fp-selected-start), var(--fp-selected-end)) !important;
      border-color: transparent !important;
      color: #fff !important;
    }
    .flatpickr-day.today:not(.selected) {
      border-color: var(--fp-today);
    }

    #date {
      cursor: pointer;
      background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' fill='%236b7280' viewBox='0 0 448 512'%3E%3Cpath d='M152 24c0-13.3-10.7-24-24-24s-24 10.7-24 24V64H64C28.7 64 0 92.7 0 128v16 48V448c0 35.3 28.7 64 64 64H384c35.3 0 64-28.7 64-64V192 144 128c0-35.3-28.7-64-64-64H344V24c0-13.3-10.7-24-24-24s-24 10.7-24 24V64H152V24zM48 192H400V448c0 8.8-7.2 16-16 16H64c-8.8 0-16-7.2-16-16V192z'/%3E%3C/svg%3E") no-repeat 10px center;
      padding-left: 30px;
    }
	    /* Brand Tabs - Multi-select */
	    .brand-row {
	      display: flex;
	      align-items: center;
	      gap: 10px;
	      margin-bottom: 12px;
	    }
	    .brand-tabs {
	      display: flex; gap: 6px;
	      flex-wrap: wrap; align-items: center;
	      flex: 1 1 auto;
	      min-width: 0;
	    }
	    .brand-tab {
	      padding: 6px 12px; border: 1px solid #e5e7eb; background: #fff;
	      cursor: pointer; font-size: 12px; font-weight: 500;
	      border-radius: 6px; color: #6b7280; transition: all 0.15s;
    }
    .brand-tab:hover { border-color: #d1d5db; background: #f9fafb; }
    .brand-tab.active { background: #3b82f6; color: #fff; border-color: #3b82f6; }
	    .brand-tab.all-tab { background: #f3f4f6; border-color: #e5e7eb; }
	    .brand-tab.all-tab.active { background: #111; color: #fff; border-color: #111; }
	    .brand-tab .count { font-weight: 400; opacity: 0.7; margin-left: 3px; font-size: 11px; }
	    .overview-scope-ctl {
	      display: none;
	      align-items: center;
	      flex: 0 0 auto;
	      margin-left: auto;
	      height: 34px;
	      border: 1px solid #e5e7eb;
	      border-radius: 10px;
	      overflow: hidden;
	      background: #fff;
	      box-shadow: 0 1px 4px rgba(15, 23, 42, 0.05);
	    }
	    body.view-map .overview-scope-ctl { display: inline-flex; }
	    .overview-scope-ctl.hidden { display: none !important; }
	    .overview-scope-btn {
	      height: 34px;
	      padding: 0 11px;
	      border: 0;
	      border-radius: 0;
	      background: #fff;
	      color: #475569;
	      font-size: 12px;
	      font-weight: 700;
	      cursor: pointer;
	      white-space: nowrap;
	    }
	    .overview-scope-btn + .overview-scope-btn { border-left: 1px solid #e5e7eb; }
	    .overview-scope-btn:hover { background: #f8fafc; }
	    .overview-scope-btn.active {
	      background: #111827;
	      color: #fff;
	    }
	    .scope-label-short { display: none; }
	    .scope-label-full { display: inline; }
		    /* Sub-brand filter */
		    .sub-brand-filter {
		      display: flex; gap: 4px; flex-wrap: wrap; align-items: center;
		      margin-bottom: 12px;
		    }
		    .sub-brand-collapse-btn {
		      margin-left: 6px;
		      height: 32px;
		      padding: 0 10px;
		      border: 1px solid #e5e7eb;
		      border-radius: 999px;
		      background: linear-gradient(135deg, #fff, #f8fafc);
		      cursor: pointer;
		      display: inline-flex;
		      align-items: center;
		      justify-content: center;
		      gap: 8px;
		      color: #64748b;
		      transition: all 0.15s;
		      font-size: 12px;
		      font-weight: 700;
		      white-space: nowrap;
		    }
		    .sub-brand-collapse-btn:hover { background: #f3f4f6; color: #0f172a; border-color: #d1d5db; }
		    .sub-brand-collapse-btn.collapsed { border-color: #fed7aa; color: #b45309; background: linear-gradient(135deg, #fffbeb, #fff7ed); }
		    .sub-brand-collapse-btn:disabled { opacity: 0.35; cursor: not-allowed; }
		    /* When rendering tiered sub-brands (selectedBrands.length > 0), we wrap rows in this container. */
		    .tier-list {
		      display: flex;
		      flex-direction: column;
	      gap: 10px;
	      align-items: stretch;
	      width: 100%;
	    }
		    .sub-brand-tag {
		      padding: 4px 10px; border: 1px solid #e5e7eb; background: #fff;
		      cursor: pointer; font-size: 11px; border-radius: 4px;
		      color: #6b7280; transition: all 0.15s;
          /* Prevent flex containers (tier-row) from shrinking tags into vertical text. */
          flex: 0 0 auto;
          white-space: nowrap;
		    }
    .sub-brand-tag:hover { border-color: #d1d5db; }
    .sub-brand-tag.active { background: #dbeafe; color: #1d4ed8; border-color: #93c5fd; }
    .sub-brand-tag.disabled,
    .sub-brand-tag:disabled {
      cursor: not-allowed;
    }
    .sub-brand-tag.disabled:hover,
    .sub-brand-tag:disabled:hover {
      border-color: #e5e7eb;
      background: #fff;
    }
	    /* 档次分行显示 */
		    .tier-row {
		      display: flex; align-items: center; gap: 6px;
		      width: 100%;
		      flex-wrap: nowrap;
		      overflow-x: auto;
	      overflow-y: hidden;
	      padding-bottom: 4px;
	      border-bottom: 1px dashed #eef2f7;
    }
    .tier-label {
      font-size: 11px; font-weight: 500; padding: 3px 8px;
      border-radius: 4px; min-width: 48px; text-align: center;
      flex: 0 0 auto;
    }
    .tier-label.tier-1 { background: linear-gradient(135deg, #fef3c7, #fde68a); color: #92400e; }
    .tier-label.tier-2 { background: linear-gradient(135deg, #ede9fe, #ddd6fe); color: #6d28d9; }
    .tier-label.tier-3 { background: linear-gradient(135deg, #dbeafe, #bfdbfe); color: #1d4ed8; }
    .tier-label.tier-4 { background: linear-gradient(135deg, #d1fae5, #a7f3d0); color: #047857; }
    .tier-label.tier-5 { background: linear-gradient(135deg, #f3f4f6, #e5e7eb); color: #4b5563; }
    .tier-label.tier-99 { background: linear-gradient(135deg, #f3f4f6, #e5e7eb); color: #111827; }
    .sub-brand-tag { display: inline-flex; align-items: center; gap: 4px; }
    .brand-badge {
      display: inline-flex; align-items: center; justify-content: center;
      min-width: 18px; height: 14px; padding: 0 3px;
      font-size: 9px; font-weight: 600; border-radius: 2px;
      color: #fff; letter-spacing: -0.3px;
    }
    /* 按集团设置徽章颜色 */
    .brand-badge.hyatt { background: #1a1a1a; }
    .brand-badge.ihg { background: #1a5336; }
    .brand-badge.marriott { background: #8c1c13; }
    .brand-badge.hilton { background: #1e3a8a; }
    /* Summary Bar */
    .featured-hint {
      padding: 10px 14px; margin-bottom: 12px;
      background: linear-gradient(135deg, #fdfaf2 0%, #fefdfb 100%);
      border: 1px solid rgba(212, 175, 55, 0.35);
      border-radius: 8px; font-size: 12px; color: #78550a;
    }
    .featured-hint b { color: #5a3f06; font-weight: 700; }

    .summary-bar {
      display: flex; gap: 20px; padding: 10px 14px;
      background: #fafbfc; border: 1px solid #e5e7eb; border-radius: 8px;
      margin-bottom: 12px; font-size: 12px;
    }
    .summary-item { display: flex; align-items: center; gap: 5px; }
    .summary-clickable { cursor: pointer; border-radius: 4px; padding: 2px 4px; margin: -2px -4px; transition: background 0.15s; }
    .summary-clickable:hover { background: #f0f4ff; }
    .summary-label { color: #9ca3af; }
    .summary-value { font-weight: 600; color: #111; }
    .summary-hotel { color: #6b7280; font-weight: 400; font-size: 11px; }
    .stats {
      background: #fff; padding: 10px 14px; border-radius: 8px;
      margin-bottom: 12px; box-shadow: 0 1px 2px rgba(0,0,0,0.04);
      border: 1px solid #e5e7eb; font-size: 12px; color: #6b7280;
    }
    .stats span { margin-right: 14px; }
    .stats b { color: #111; font-weight: 600; }
    .stats-row { display: inline; }
    table {
      width: 100%; border-collapse: collapse;
      background: #fff; border-radius: 8px; overflow: hidden;
      box-shadow: 0 1px 2px rgba(0,0,0,0.04);
      border: 1px solid #e5e7eb;
    }
    th, td { padding: 10px 12px; text-align: left; border-bottom: 1px solid #f3f4f6; }
    th { background: #f9fafb; color: #374151; font-weight: 500; font-size: 12px; }
    th.sortable { cursor: pointer; user-select: none; }
    th.sortable:hover { background: #f3f4f6; }
    th .sort-arrow { margin-left: 4px; font-size: 10px; color: #9ca3af; }
    th.sorted .sort-arrow { color: #3b82f6; }
    tr:hover { background: #fafbfc; }
    td { font-size: 13px; }
    .price { font-weight: 600; color: #e74c3c; }
    .cash-usd-ref { color: #64748b; font-weight: 500; font-size: 11px; margin-left: 4px; }
    .points { color: #3498db; }
    .cpp {
      font-weight: 600; padding: 2px 6px; border-radius: 4px;
    }
    .cpp.excellent { background: #27ae60; color: #fff; }
    .cpp.good { background: #f39c12; color: #fff; }
    .cpp.normal { background: #95a5a6; color: #fff; }
    .brand {
      display: inline-block; padding: 2px 8px; border-radius: 4px;
      font-size: 12px; font-weight: 500;
    }
    .brand.IHG { background: #1a5336; color: #fff; }
    .brand.Marriott { background: #8c1c13; color: #fff; }
    .brand.Hilton { background: #1e3a8a; color: #fff; }
    .brand.Hyatt { background: #000; color: #fff; }
    .na { color: #999; }
    /* 分页控件 */
    .pagination {
      display: flex; align-items: center; justify-content: center;
      gap: 12px; margin-top: 16px; padding: 12px;
      background: #fff; border-radius: 8px; border: 1px solid #e5e7eb;
    }
    .page-btn {
      padding: 8px 16px; border: 1px solid #e5e7eb; background: #fff;
      border-radius: 6px; font-size: 13px; cursor: pointer;
      color: #374151; transition: all 0.15s;
    }
    .page-btn:hover:not(:disabled) { background: #f3f4f6; border-color: #d1d5db; }
    .page-btn:disabled { opacity: 0.4; cursor: not-allowed; }
    .page-info { font-size: 13px; color: #6b7280; }
	    /* 日期选择器组合 */
	    .date-wrapper {
	      display: inline-flex; align-items: stretch;
	      flex: 1 1 0; min-width: 0;
	    }
    .date-wrapper #date {
      border-radius: 6px 0 0 6px; flex: 1 1 0; min-width: 0;
      padding-right: 12px;
    }
    .clear-btn {
      padding: 8px 10px; border: 1px solid #e5e7eb; background: #f9fafb;
      font-size: 13px; cursor: pointer; color: #9ca3af;
      border-left: none; border-radius: 0 6px 6px 0;
    }
	    .clear-btn:hover { background: #fee2e2; color: #dc2626; }

		    /* Account menu (soft sign-in + locale) */
		    /* Wallet 按钮（图标 + 文字长方形） */
		    .wallet-btn {
		      height: 42px;
		      min-width: 110px;
		      padding: 0 14px 0 10px;
		      border: 1px solid #e2e8f0;
		      background: #fff;
		      border-radius: 12px;
		      display: inline-flex;
		      align-items: center;
		      justify-content: center;
		      gap: 7px;
		      cursor: pointer;
		      transition: all 0.15s;
		    }
		    .wallet-btn:hover { background: #f8fafc; border-color: #d1d5db; }
		    .wallet-btn-icon { display: block; flex: 0 0 auto; }
		    .wallet-btn-label {
		      font-size: 14px;
		      font-weight: 700;
		      color: #334155;
		      white-space: nowrap;
		    }
		    /* IHG top-off toggle */
		    .fnc-topoff-bar {
		      position: absolute;
		      top: 100%;
		      right: 0;
		      margin-top: 16px;
		      white-space: nowrap;
		      display: none;
		    }
		    .fnc-topoff-bar.show {
		      display: flex;
		      animation: topoff-in 0.2s ease-out;
		    }
		    @keyframes topoff-in {
		      from { opacity: 0; transform: translateY(-4px); }
		      to { opacity: 1; transform: translateY(0); }
		    }
		    .fnc-topoff-bar { z-index: 10; }
		    /* FNC filter summary bar（Phase 1a：列出 active user FNC 来自哪几张证书） */
		    .fnc-summary-bar {
		      display: flex;
		      align-items: center;
		      gap: 8px;
		      margin-bottom: 10px;
		      padding: 7px 14px;
		      background: linear-gradient(to right, #fefce8, #fffbeb);
		      border: 1px solid #fde68a;
		      border-radius: 10px;
		      font-size: 12px;
		      color: #78350f;
		      font-variant-numeric: tabular-nums;
		      flex-wrap: wrap;
		    }
		    .fnc-summary-bar[hidden] { display: none; }
		    .fnc-summary-icon { font-size: 14px; line-height: 1; }
		    .fnc-summary-text strong { color: #92400e; font-weight: 700; }
		    .fnc-summary-items {
		      display: flex;
		      gap: 4px;
		      flex-wrap: wrap;
		      flex: 1 1 auto;
		      min-width: 0;
		    }
		    .fnc-summary-chip {
		      display: inline-flex;
		      align-items: center;
		      gap: 4px;
		      padding: 2px 8px;
		      background: rgba(255, 255, 255, 0.6);
		      border: 1px solid #fde68a;
		      border-radius: 11px;
		      font-size: 11px;
		      font-weight: 600;
		      color: #92400e;
		      white-space: nowrap;
		    }
		    .fnc-summary-chip.urgent {
		      background: #fee2e2;
		      border-color: #fecaca;
		      color: #b91c1c;
		    }
		    .fnc-summary-chip.warning {
		      background: #ffedd5;
		      border-color: #fed7aa;
		      color: #9a3412;
		    }
		    .fnc-summary-chip .fnc-summary-days { opacity: 0.7; font-weight: 500; }
		    .fnc-summary-more {
		      font-size: 11px;
		      color: #a16207;
		      font-weight: 600;
		      padding: 2px 4px;
		    }
		    .fnc-summary-link {
		      flex: 0 0 auto;
		      background: transparent;
		      border: none;
		      cursor: pointer;
		      font-size: 11px;
		      font-weight: 600;
		      color: #92400e;
		      padding: 3px 8px;
		      border-radius: 4px;
		      font-family: inherit;
		      text-decoration: underline;
		      text-underline-offset: 2px;
		    }
		    .fnc-summary-link:hover { color: #78350f; background: rgba(255, 255, 255, 0.6); }
		    /* FNC finder Free 预览上限 → 列表末尾 upsell row（PRD §4.3） */
		    .fnc-finder-upsell-row td {
		      padding: 0 !important;
		      border: none !important;
		      background: transparent;
		    }
		    .fnc-finder-upsell {
		      display: flex;
		      align-items: center;
		      justify-content: space-between;
		      gap: 12px;
		      margin: 12px 0 4px;
		      padding: 14px 18px;
		      background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
		      border: 1px solid #fde68a;
		      border-radius: 12px;
		      box-shadow: 0 2px 12px rgba(212, 175, 55, 0.08);
		    }
		    .fnc-finder-upsell-msg {
		      font-size: 13px;
		      color: #78350f;
		      line-height: 1.4;
		    }
		    .fnc-finder-upsell-btn {
		      flex: 0 0 auto;
		      padding: 7px 14px;
		      background: linear-gradient(135deg, #d4af37, #f5d060);
		      color: #ffffff;
		      border: none;
		      border-radius: 8px;
		      font-size: 12px;
		      font-weight: 700;
		      cursor: pointer;
		      font-family: inherit;
		      letter-spacing: 0.02em;
		      transition: transform 0.15s, box-shadow 0.15s;
		    }
		    .fnc-finder-upsell-btn:hover {
		      transform: translateY(-1px);
		      box-shadow: 0 4px 12px rgba(212, 175, 55, 0.3);
		    }
		    .fnc-topoff-toggle {
		      display: inline-flex;
		      align-items: center;
		      gap: 6px;
		      font-size: 12px;
		      font-weight: 600;
		      color: #64748b;
		      cursor: pointer;
		      user-select: none;
		    }
		    .fnc-topoff-toggle input[type="checkbox"] { margin: 0; }
		    /* FNC badge（表格行内标记） */
		    .fnc-badge {
		      display: inline-block;
		      padding: 1px 5px;
		      margin-left: 4px;
		      border-radius: 4px;
		      font-size: 10px;
		      font-weight: 700;
		      background: #dbeafe;
		      color: #1e40af;
		      vertical-align: middle;
		      line-height: 1.4;
		    }
		    /* IHG lifecycle badge. OPEN 不显示。 */
		    .lifecycle-badge {
		      display: inline-block;
		      padding: 1px 5px;
		      margin-left: 4px;
		      border-radius: 4px;
		      font-size: 10px;
		      font-weight: 600;
		      vertical-align: middle;
		      line-height: 1.4;
		      white-space: nowrap;
		    }
		    .lifecycle-badge.lifecycle-closed { background: #fee2e2; color: #991b1b; }
		    .lifecycle-badge.lifecycle-opening-soon { background: #fef3c7; color: #92400e; }
		    .lifecycle-badge.lifecycle-unavailable { background: #f3e8ff; color: #6b21a8; }
		    .lifecycle-badge.lifecycle-delisted { background: #f3f4f6; color: #6b7280; }
		    .fnc-badge.topoff {
		      background: #fef3c7;
		      color: #92400e;
		    }
		    /* Alerts 抽屉面板 — 跟 wallet-drawer 同手法,必须放 .drawer @media 之后才能覆盖 mobile max-width:100% */
		    .alerts-drawer {
		      max-width: 92vw;
		      display: flex;
		      flex-direction: column;
		      max-height: 100vh;
		    }
		    /* Wallet 抽屉面板 */
		    .wallet-drawer {
		      max-width: 92vw;
		      display: flex;
		      flex-direction: column;
		      max-height: 100vh;
		    }
		    .wallet-content {
		      flex: 1 1 auto;
		      overflow-y: auto;
		      padding: 0 0 12px;
		    }
		    .wallet-footer {
		      flex: 0 0 auto;
		      padding: 12px 0 0;
		      border-top: 1px solid #e5e7eb;
		    }
		    .wallet-save-btn { width: 100%; transition: background 0.2s, color 0.2s, opacity 0.2s, box-shadow 0.2s; }
		    /* Dirty Save 5 状态：保留 .btn-primary 黑底基调，仅通过 opacity / 文字 / 强调 / 色彩反馈区分。
		       用 button[disabled].class 选择器（特异性 0,2,1 > 浏览器默认 button:disabled 0,1,1）
		       否则浏览器 disabled 样式会把按钮渲染成系统灰色。 */
		    .wallet-save-btn.wallet-save-clean,
		    .wallet-save-btn.wallet-save-clean[disabled] {
		      background: #111827;
		      color: #6b7280;
		      border-color: #111827;
		      opacity: 1;
		      cursor: default;
		    }
		    .wallet-save-btn.wallet-save-dirty {
		      /* 保留默认 .btn-primary 黑底白字，加金色描边 + 微 glow 提示有未保存修改 */
		      box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.35);
		    }
		    .wallet-save-btn.wallet-save-saving,
		    .wallet-save-btn.wallet-save-saving[disabled] {
		      background: #1e293b;
		      color: #cbd5e1;
		      border-color: #1e293b;
		      cursor: progress;
		      opacity: 1;
		    }
		    .wallet-save-btn.wallet-save-success,
		    .wallet-save-btn.wallet-save-success[disabled] {
		      background: #14532d;
		      color: #d1fae5;
		      border-color: #14532d;
		      opacity: 1;
		    }
		    .wallet-save-btn.wallet-save-error {
		      background: #7f1d1d;
		      color: #fecaca;
		      border-color: #7f1d1d;
		    }
		    /* Wallet header（覆盖 drawer-header 的默认样式） */
		    .wallet-header {
		      align-items: center;
		      justify-content: flex-start;
		      gap: 8px;
		      margin: -14px -14px 0;
		      padding: 12px 14px;
		      border-bottom: 1px solid #e5e7eb;
		      transition: background 0.2s, box-shadow 0.2s;
		    }
		    .wallet-header-svg { flex: 0 0 auto; }
		    .wallet-header .drawer-title {
		      font-size: 15px;
		      font-weight: 700;
		      color: #0f172a;
		    }
		    .wallet-header-spacer { flex: 1 1 auto; }
		    /* Free header：白色底 */
		    .wallet-header-free {
		      background: #fff;
		    }
		    .wallet-header-free .drawer-title { color: #0f172a; }
		    .wallet-header-free .wallet-close-btn {
		      background: #fff;
		      border-color: #e5e7eb;
		      color: #334155;
		    }
		    /* Pro header：深色底 + 金色辉光 */
		    .wallet-header-pro {
		      background: linear-gradient(135deg, #1e2026, #2a2520, #3a2e1a);
		      border-bottom-color: #4a3f2a;
		      box-shadow: 0 2px 12px rgba(212, 175, 55, 0.08);
		    }
		    .wallet-header-pro .drawer-title { color: #fef3c7; }
		    .wallet-header-pro .wallet-close-btn {
		      background: rgba(255,255,255,0.08);
		      border-color: rgba(255,255,255,0.15);
		      color: #e5e7eb;
		    }
		    .wallet-header-pro .wallet-close-btn:hover {
		      background: rgba(255,255,255,0.15);
		    }
		    .wallet-header-pro .wallet-card-count { color: #d6d3d1; }
		    /* 关闭按钮样式 */
		    .wallet-close-btn {
		      width: 32px;
		      height: 32px;
		      border-radius: 8px;
		      border: 1px solid #e5e7eb;
		      background: #fff;
		      cursor: pointer;
		      color: #334155;
		      font-size: 16px;
		      line-height: 1;
		      flex: 0 0 auto;
		    }
		    .wallet-close-btn:hover { background: #f3f4f6; }
		    /* Plan badge */
		    .wallet-badge {
		      font-size: 10px;
		      font-weight: 800;
		      padding: 2px 8px;
		      border-radius: 4px;
		      text-transform: uppercase;
		      letter-spacing: 0.04em;
		    }
		    .wallet-badge-free { background: #f1f5f9; color: #64748b; }
		    .wallet-badge-pro {
		      background: linear-gradient(135deg, #d4af37, #f5d060);
		      color: #fff;
		      text-shadow: 0 1px 2px rgba(0,0,0,0.15);
		    }
		    /* 卡片计数 */
		    .wallet-card-count {
		      font-size: 12px;
		      font-weight: 600;
		      color: #374151;
		    }
		    /* Upgrade 按钮（金色药丸 + sparkle） */
		    .wallet-upgrade-btn {
		      display: inline-flex;
		      align-items: center;
		      gap: 4px;
		      padding: 4px 12px;
		      border-radius: 20px;
		      background: linear-gradient(135deg, #fef3c7, #fde68a);
		      border: 1px solid #fcd34d;
		      color: #92400e;
		      font-size: 11px;
		      font-weight: 700;
		      cursor: pointer;
		      white-space: nowrap;
		      text-decoration: none;
		      transition: box-shadow 0.15s;
		    }
		    .wallet-upgrade-btn:hover {
		      box-shadow: 0 2px 8px rgba(252, 211, 77, 0.4);
		    }
		    /* Wallet 面板内的分组 */
		    .wallet-brand-group {
		      margin-bottom: 16px;
		    }
		    .wallet-brand-group-title {
		      font-size: 12px;
		      font-weight: 800;
		      text-transform: uppercase;
		      letter-spacing: 0.04em;
		      color: #64748b;
		      margin-bottom: 6px;
		    }
		    .wallet-card-item {
		      display: flex;
		      align-items: flex-start;
		      gap: 6px;
		      padding: 8px 2px;
		      border-bottom: 1px solid #f1f5f9;
		      border-radius: 8px;
		      border-left: 3px solid transparent;
		      transition: background 0.15s, border-color 0.15s;
		    }
		    .wallet-card-item:last-child { border-bottom: none; }
		    .wallet-card-item input[type="checkbox"] {
		      margin-top: 3px;
		      flex: 0 0 auto;
		    }
		    /* 选中卡片：暖色背景 */
		    .wallet-card-item:has(input:checked) {
		      background: linear-gradient(to right, #fffbeb, #fefce8);
		    }
		    /* Pro 选中卡片：左侧金色条 */
		    .wallet-pro-mode .wallet-card-item:has(input:checked) {
		      border-left-color: #d4af37;
		    }
		    .wallet-card-info { flex: 1 1 auto; min-width: 0; }
		    .wallet-card-name {
		      font-size: 13px;
		      font-weight: 600;
		      color: #0f172a;
		      line-height: 1.5;
		    }
		    .wallet-card-issuer {
		      display: inline-block;
		      font-size: 10px;
		      font-weight: 700;
		      text-transform: uppercase;
		      letter-spacing: 0.03em;
		      background: #f1f5f9;
		      color: #64748b;
		      padding: 1px 5px;
		      border-radius: 4px;
		      margin-left: 4px;
		      vertical-align: middle;
		    }
		    /* FNC 内联样式（Free: 灰色文本；Pro: 金色 badge） */
		    .wallet-card-fnc {
		      display: inline;
		      font-size: 10px;
		      color: #64748b;
		      margin-left: 4px;
		      vertical-align: middle;
		    }
		    .wallet-fnc-gold {
		      background: linear-gradient(135deg, #fef3c7, #fde68a);
		      color: #92400e;
		      font-weight: 700;
		      padding: 1px 5px;
		      border-radius: 4px;
		    }
		    /* Wallet v2：结构化 FNC chips（详见 PRD-wallet-v2 §3.3） */
		    .wallet-card-fnc-chips {
		      display: flex;
		      flex-wrap: wrap;
		      gap: 4px;
		      margin-top: 4px;
		    }
		    .wallet-fnc-chip {
		      display: inline-block;
		      font-size: 10px;
		      font-weight: 600;
		      padding: 2px 6px;
		      border-radius: 4px;
		      line-height: 1.4;
		      white-space: nowrap;
		    }
		    /* anniversary：蓝色，表示默认可用 */
		    .wallet-fnc-chip-anniversary {
		      background: #dbeafe;
		      color: #1e40af;
		    }
		    /* spend-triggered：绿色，表示条件达成后可用（v2.0 默认不 eligible） */
		    .wallet-fnc-chip-spend {
		      background: #d1fae5;
		      color: #047857;
		    }
		    /* choice award：紫色，表示选择性权益 */
		    .wallet-fnc-chip-choice {
		      background: #ede9fe;
		      color: #5b21b6;
		    }
		    /* Pro 模式下 chips 加微金色边框强调 */
		    .wallet-fnc-chips-pro .wallet-fnc-chip-anniversary {
		      box-shadow: 0 0 0 1px rgba(212, 175, 55, 0.3) inset;
		    }
		    /* 全局数据核对日期（信用卡列表顶部一行，PRD §5.3 简化版） */
		    .wallet-cards-verified {
		      font-size: 10px;
		      color: #94a3b8;
		      margin: -4px 0 8px;
		      font-variant-numeric: tabular-nums;
		    }
		    /* Legacy 卡：整体灰调 + 右侧标签 */
		    .wallet-card-legacy .wallet-card-name { color: #64748b; }
		    .wallet-card-legacy-badge {
		      display: inline-block;
		      font-size: 9px;
		      font-weight: 700;
		      text-transform: uppercase;
		      letter-spacing: 0.03em;
		      background: #f1f5f9;
		      color: #94a3b8;
		      padding: 1px 5px;
		      border-radius: 4px;
		      margin-left: 4px;
		      vertical-align: middle;
		    }
		    .wallet-section-title {
		      font-size: 13px;
		      font-weight: 700;
		      color: #334155;
		      margin: 16px 0 8px;
		      padding-bottom: 4px;
		      border-bottom: 1px solid #e5e7eb;
		    }
		    .wallet-program-item {
		      display: flex;
		      align-items: flex-start;
		      gap: 8px;
		      padding: 8px 0;
		      border-bottom: 1px solid #f1f5f9;
		    }
		    .wallet-program-item:last-child { border-bottom: none; }
		    .wallet-program-item input[type="checkbox"] {
		      margin-top: 3px;
		      flex: 0 0 auto;
		    }
		    .wallet-program-info { flex: 1 1 auto; min-width: 0; }
		    .wallet-program-name {
		      font-size: 13px;
		      font-weight: 600;
		      color: #0f172a;
		    }
		    .wallet-program-transfers {
		      font-size: 11px;
		      color: #64748b;
		      margin-top: 2px;
		    }
		    .wallet-balance-input {
		      width: 160px;
		      height: 28px;
		      padding: 0 8px;
		      font-size: 12px;
		      border: 1px solid #e5e7eb;
		      border-radius: 8px;
		      margin-top: 4px;
		    }
		    .wallet-balance-input:focus {
		      outline: none;
		      border-color: #6366f1;
		      box-shadow: 0 0 0 2px rgba(99,102,241,0.15);
		    }
		    .wallet-card-disabled {
		      opacity: 0.45;
		      cursor: not-allowed;
		      /* Issue #96: 不用 pointer-events: none，让 click 能触发 addCard 内部的 limit check 弹 Pro modal */
		    }
		    /* ──────────────────────────────────────────
		       Wallet v2.1 — Tabs + My FNC tab（详见 PRD-wallet-v2 §3.4）
		    ────────────────────────────────────────── */
		    .wallet-tabs {
		      display: flex;
		      padding: 0 4px;
		      margin: 0 0 10px;
		      border-bottom: 1px solid #f1f5f9;
		    }
		    .wallet-tab {
		      padding: 10px 12px;
		      font-size: 13px;
		      font-weight: 600;
		      color: #94a3b8;
		      cursor: pointer;
		      border-bottom: 2px solid transparent;
		      margin-bottom: -1px;
		      transition: color 0.15s, border-color 0.15s;
		      user-select: none;
		    }
		    .wallet-tab:hover { color: #475569; }
		    .wallet-tab.active { color: #92400e; border-bottom-color: #d4af37; }
		    .wallet-tab-count {
		      margin-left: 5px;
		      font-size: 11px;
		      font-weight: 600;
		      color: #cbd5e1;
		      font-variant-numeric: tabular-nums;
		    }
		    .wallet-tab.active .wallet-tab-count { color: #b45309; }
		    .wallet-tab-body[hidden] { display: none !important; }
		    /* Cards tab：已选卡 "N 条 FNC →" 跳转链接（仅 fncN ≥ 1 时渲染）
		       - 有 spend row → 嵌入 spend meta 行右侧（与 "% · $X to go" 用 · 拼接）
		       - 无 spend row 有 chips → 嵌入 chips 行右侧
		       - 兜底 footer（无 chips 无 spend）→ wallet-myfnc-footer 独立行 */
		    .wallet-card-myfnc-link {
		      display: inline-block;
		      font-size: inherit;
		      font-weight: 600;
		      color: inherit;
		      background: transparent;
		      border: none;
		      cursor: pointer;
		      padding: 0;
		      font-family: inherit;
		      font-variant-numeric: tabular-nums;
		      white-space: nowrap;
		      transition: color 0.15s;
		    }
		    .wallet-card-myfnc-link:hover { color: #0f172a; text-decoration: underline; }
		    /* chips 行嵌 FNC link：左 chips 右 link */
		    .wallet-chips-row {
		      display: flex;
		      align-items: flex-end;
		      justify-content: space-between;
		      gap: 8px;
		      margin-top: 4px;
		    }
		    .wallet-chips-row .wallet-card-fnc-chips {
		      margin-top: 0; /* 已用 wrapper margin */
		      flex: 1 1 auto;
		      min-width: 0;
		    }
		    .wallet-chips-row .wallet-card-myfnc-link {
		      flex: 0 0 auto;
		      align-self: center;
		      font-size: 10.5px;
		      color: #475569;
		      padding: 2px 4px;
		      border-radius: 4px;
		    }
		    .wallet-chips-row .wallet-card-myfnc-link:hover {
		      color: #0f172a;
		      background: rgba(15, 23, 42, 0.06);
		      text-decoration: none;
		    }
		    /* spend meta 行右侧容器（包 percent + FNC link） */
		    .wallet-spend-meta .wallet-spend-meta-right {
		      display: inline;
		    }
		    /* 兜底独立 footer 行（极少触发：无 chips 无 spend 但 fncN > 0） */
		    .wallet-myfnc-footer {
		      margin-top: 6px;
		      text-align: right;
		    }
		    .wallet-myfnc-footer .wallet-card-myfnc-link {
		      font-size: 10.5px;
		      color: #475569;
		      padding: 2px 6px;
		      border-radius: 4px;
		    }
		    .wallet-myfnc-footer .wallet-card-myfnc-link:hover {
		      color: #0f172a;
		      background: rgba(15, 23, 42, 0.06);
		      text-decoration: none;
		    }
		    /* My FNC tab：empty state（极简 + 抽象卡片 art） */
		    .wallet-myfnc-empty { text-align: center; padding: 48px 16px 40px; }
		    .wallet-myfnc-empty-art {
		      width: 56px; height: 36px;
		      margin: 0 auto 16px;
		      position: relative; perspective: 200px;
		    }
		    .wallet-myfnc-empty-art::before,
		    .wallet-myfnc-empty-art::after {
		      content: ''; position: absolute;
		      width: 48px; height: 30px;
		      border-radius: 5px;
		      border: 1.5px dashed #e2e8f0;
		    }
		    .wallet-myfnc-empty-art::before {
		      transform: rotate(-8deg) translateX(-4px);
		      background: #fafbfc;
		    }
		    .wallet-myfnc-empty-art::after {
		      transform: rotate(6deg) translateX(8px);
		      background: #ffffff;
		      border-color: #cbd5e1;
		    }
		    .wallet-myfnc-empty-title {
		      font-size: 14px; font-weight: 600;
		      color: #0f172a;
		      margin-bottom: 6px;
		      letter-spacing: -0.01em;
		    }
		    .wallet-myfnc-empty-desc {
		      font-size: 12px; line-height: 1.5;
		      max-width: 280px; margin: 0 auto 18px;
		      color: #94a3b8;
		    }
		    .wallet-myfnc-empty-btn,
		    .wallet-myfnc-add-btn {
		      padding: 7px 14px;
		      background: #0f172a; color: #fefce8;
		      font-size: 12px; font-weight: 600;
		      border: none; border-radius: 6px; cursor: pointer;
		      font-family: inherit;
		      letter-spacing: -0.005em;
		    }
		    .wallet-myfnc-empty-btn:hover,
		    .wallet-myfnc-add-btn:hover { background: #1e293b; }
		    /* My FNC：add bar (stats + add button) */
		    .wallet-myfnc-bar {
		      display: flex; justify-content: space-between; align-items: center;
		      margin-bottom: 12px;
		    }
		    .wallet-myfnc-stats {
		      font-size: 11px; color: #94a3b8;
		      font-variant-numeric: tabular-nums;
		    }
		    .wallet-myfnc-stats strong { color: #475569; font-weight: 600; }
		    .wallet-myfnc-stats .dot { color: #cbd5e1; margin: 0 4px; }
		    /* Issue #96: Free quota 显示（n/max），达上限变红。my-fnc 和 cards section 共用 */
		    .wallet-myfnc-quota,
		    .wallet-cards-quota {
		      margin-left: 4px;
		      padding: 1px 6px;
		      border-radius: 4px;
		      background: #f1f5f9;
		      color: #64748b;
		      font-weight: 600;
		      font-size: 10px;
		    }
		    .wallet-myfnc-quota.limit-reached,
		    .wallet-cards-quota.limit-reached {
		      background: #fef2f2;
		      color: #b91c1c;
		    }
		    /* Section header（Active/Used/Expired 折叠） */
		    .wallet-myfnc-section {
		      display: flex; align-items: center; gap: 6px;
		      margin: 18px 0 8px; padding: 0 4px;
		      font-size: 11px;
		      cursor: pointer; user-select: none;
		      color: #475569;
		    }
		    .wallet-myfnc-section:hover { color: #0f172a; }
		    .wallet-myfnc-section .chevron {
		      transform: rotate(0deg);
		      transition: transform 0.15s;
		    }
		    .wallet-myfnc-section.open .chevron { transform: rotate(90deg); }
		    .wallet-myfnc-section-label { font-weight: 700; color: inherit; }
		    .wallet-myfnc-section-count {
		      color: #94a3b8; font-weight: 500;
		      font-variant-numeric: tabular-nums;
		    }
		    .wallet-myfnc-list { display: flex; flex-direction: column; gap: 8px; }
		    /* My FNC card（benefit-card 风格：4px 品牌色边 + type icon） */
		    .wallet-myfnc-card {
		      position: relative;
		      display: flex; gap: 10px; align-items: stretch;
		      background: #ffffff;
		      border: 1px solid #e8ecf1;
		      border-left: 4px solid var(--wf-brand, #cbd5e1);
		      border-radius: 8px;
		      padding: 11px 14px 10px 14px;
		      transition: border-color 0.15s, box-shadow 0.15s;
		    }
		    .wallet-myfnc-card.IHG      { --wf-brand: #d97706; --wf-brand-soft: #fef3c7; }
		    .wallet-myfnc-card.Marriott { --wf-brand: #be123c; --wf-brand-soft: #fee2e2; }
		    .wallet-myfnc-card.Hilton   { --wf-brand: #2563eb; --wf-brand-soft: #dbeafe; }
		    .wallet-myfnc-card.Hyatt    { --wf-brand: #059669; --wf-brand-soft: #d1fae5; }
		    .wallet-myfnc-card.urgent  { --wf-brand: #dc2626; }
		    .wallet-myfnc-card.warning { --wf-brand: #f59e0b; }
		    .wallet-myfnc-card:hover {
		      border-color: #cbd5e1;
		      box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
		    }
		    .wallet-myfnc-card.status-used,
		    .wallet-myfnc-card.status-expired {
		      background: #f8fafc;
		      --wf-brand: #cbd5e1;
		      --wf-brand-soft: #f1f5f9;
		    }
		    .wallet-myfnc-card.status-used .wallet-myfnc-name,
		    .wallet-myfnc-card.status-expired .wallet-myfnc-name { color: #64748b; }
		    .wallet-myfnc-card.status-expired { opacity: 0.7; }
		    .wallet-myfnc-card.highlighted {
		      box-shadow: 0 0 0 2px #d4af37, 0 4px 14px rgba(212, 175, 55, 0.18);
		      transition: box-shadow 0.4s;
		    }
		    /* Type icon（anniversary=日历 / spend=$ / choice=多选打勾） */
		    .wallet-myfnc-type-icon {
		      flex: 0 0 auto;
		      width: 28px; height: 28px;
		      border-radius: 7px;
		      display: flex; align-items: center; justify-content: center;
		      background: var(--wf-brand-soft, #f1f5f9);
		      color: var(--wf-brand, #475569);
		      margin-top: 1px;
		    }
		    .wallet-myfnc-type-icon svg { width: 15px; height: 15px; display: block; }
		    .wallet-myfnc-body { flex: 1 1 auto; min-width: 0; }
		    .wallet-myfnc-name {
		      font-size: 13px; font-weight: 600;
		      color: #0f172a;
		      line-height: 1.3;
		      letter-spacing: -0.005em;
		      margin-bottom: 2px;
		      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
		      padding-right: 4px;
		    }
		    .wallet-myfnc-meta {
		      font-size: 11px; color: #94a3b8;
		      font-variant-numeric: tabular-nums;
		      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
		    }
		    .wallet-myfnc-meta .brand-tag { color: #475569; font-weight: 600; }
		    .wallet-myfnc-meta .sep { color: #e2e8f0; margin: 0 5px; }
		    .wallet-myfnc-bottom {
		      display: flex; justify-content: space-between; align-items: center;
		      margin-top: 7px;
		    }
		    .wallet-myfnc-expires {
		      font-size: 11px; color: #64748b;
		      font-variant-numeric: tabular-nums;
		    }
		    .wallet-myfnc-expires.urgent { color: #dc2626; font-weight: 700; }
		    .wallet-myfnc-expires.warning { color: #d97706; font-weight: 600; }
		    /* Actions: Use/Restore 胶囊 + Edit/More 图标按钮（默认半透，hover 1） */
		    .wallet-myfnc-actions { display: flex; gap: 6px; align-items: center; }
		    .wallet-myfnc-use-pill,
		    .wallet-myfnc-restore-pill {
		      padding: 3px 10px;
		      font-size: 11px; font-weight: 600;
		      border: none; border-radius: 12px; cursor: pointer;
		      font-family: inherit;
		      letter-spacing: 0.01em;
		      transition: background 0.15s, color 0.15s, border-color 0.15s;
		    }
		    .wallet-myfnc-use-pill { background: #064e3b; color: #d1fae5; }
		    .wallet-myfnc-use-pill:hover { background: #065f46; color: #ffffff; }
		    /* Find hotels pill：outline 风格，次要 action，PRD §4.3 核心 milestone */
		    .wallet-myfnc-find-pill {
		      padding: 3px 10px;
		      font-size: 11px; font-weight: 600;
		      background: transparent; color: #92400e;
		      border: 1px solid #fde68a; border-radius: 12px; cursor: pointer;
		      font-family: inherit;
		      letter-spacing: 0.01em;
		      transition: background 0.15s, color 0.15s, border-color 0.15s;
		    }
		    .wallet-myfnc-find-pill:hover { background: #fefce8; color: #78350f; border-color: #fcd34d; }
		    .wallet-myfnc-restore-pill {
		      background: transparent; color: #475569;
		      border: 1px solid #e2e8f0;
		    }
		    .wallet-myfnc-restore-pill:hover { background: #f1f5f9; color: #0f172a; border-color: #cbd5e1; }
		    .wallet-myfnc-edit-btn,
		    .wallet-myfnc-more-btn {
		      width: 24px; height: 24px;
		      background: transparent; border: none;
		      border-radius: 4px; cursor: pointer;
		      color: #94a3b8;
		      display: flex; align-items: center; justify-content: center;
		      opacity: 0.7;
		      transition: opacity 0.15s, color 0.15s, background 0.15s;
		      font-family: inherit;
		    }
		    .wallet-myfnc-edit-btn:hover,
		    .wallet-myfnc-more-btn:hover { opacity: 1; color: #0f172a; background: #f1f5f9; }
		    .wallet-myfnc-edit-btn svg,
		    .wallet-myfnc-more-btn svg { width: 14px; height: 14px; }
		    /* Popover（⋯ 菜单，只放 Delete） */
		    .wallet-myfnc-popover {
		      position: absolute;
		      right: 6px; top: 36px;
		      background: #ffffff;
		      border: 1px solid #e2e8f0;
		      border-radius: 7px;
		      box-shadow: 0 6px 24px rgba(15, 23, 42, 0.14);
		      padding: 4px;
		      z-index: 5;
		      min-width: 110px;
		    }
		    .wallet-myfnc-popover-item {
		      display: block; width: 100%;
		      padding: 6px 10px;
		      background: transparent; border: none;
		      font-size: 12px; font-weight: 500;
		      color: #475569;
		      text-align: left; cursor: pointer;
		      border-radius: 4px;
		      font-family: inherit;
		    }
		    .wallet-myfnc-popover-item:hover { background: #f1f5f9; color: #0f172a; }
		    .wallet-myfnc-popover-item.danger { color: #dc2626; }
		    .wallet-myfnc-popover-item.danger:hover { background: #fef2f2; color: #dc2626; }
		    /* Form（inline 6 列 grid：Brand col-2 + Card col-4 避免长卡名撑爆） */
		    .wallet-myfnc-form {
		      background: #fafbfc;
		      border: 1px solid #e2e8f0;
		      border-radius: 10px;
		      padding: 14px 14px 12px;
		      margin-bottom: 12px;
		    }
		    .wallet-myfnc-form-title {
		      font-size: 12px; font-weight: 700; color: #0f172a;
		      margin-bottom: 12px;
		      text-transform: uppercase; letter-spacing: 0.05em;
		    }
		    .wallet-myfnc-form-grid {
		      display: grid;
		      grid-template-columns: repeat(6, 1fr);
		      gap: 10px 12px;
		    }
		    .wallet-myfnc-form-row {
		      display: flex; flex-direction: column; gap: 3px;
		      min-width: 0;
		      grid-column: 1 / -1;
		    }
		    .wallet-myfnc-form-row.col-2 { grid-column: span 2; }
		    .wallet-myfnc-form-row.col-3 { grid-column: span 3; }
		    .wallet-myfnc-form-row.col-4 { grid-column: span 4; }
		    .wallet-myfnc-form-row.full { grid-column: 1 / -1; }
		    .wallet-myfnc-form-label {
		      font-size: 10px; font-weight: 600; color: #64748b;
		      letter-spacing: 0.02em;
		    }
		    .wallet-myfnc-form-label .req { color: #dc2626; margin-left: 2px; }
		    .wallet-myfnc-form-input,
		    .wallet-myfnc-form-select {
		      font-family: inherit;
		      padding: 6px 8px;
		      border: 1px solid #e2e8f0;
		      border-radius: 5px;
		      font-size: 12px;
		      background: #ffffff;
		      color: #0f172a;
		      line-height: 1.4;
		      min-width: 0;
		      width: 100%;
		    }
		    .wallet-myfnc-form-input:focus,
		    .wallet-myfnc-form-select:focus {
		      outline: none;
		      border-color: #d4af37;
		      box-shadow: 0 0 0 2px rgba(212, 175, 55, 0.15);
		    }
		    .wallet-myfnc-form-error {
		      font-size: 11px; color: #dc2626;
		      margin-top: 10px;
		      padding: 7px 10px;
		      background: #fef2f2;
		      border-radius: 5px;
		      border: 1px solid #fecaca;
		    }
		    .wallet-myfnc-form-actions {
		      display: flex; justify-content: space-between; align-items: center;
		      margin-top: 12px; padding-top: 10px;
		      border-top: 1px solid #e5e7eb;
		    }
		    .wallet-myfnc-form-advanced {
		      font-size: 11px; color: #64748b;
		      background: none; border: none; cursor: pointer;
		      font-family: inherit; padding: 0;
		    }
		    .wallet-myfnc-form-advanced:hover { color: #0f172a; text-decoration: underline; }
		    .wallet-myfnc-form-actions-right { display: flex; gap: 6px; }
		    /* Confirm overlay（删除确认） */
		    .wallet-myfnc-confirm-overlay {
		      position: absolute; inset: 0;
		      background: rgba(15, 23, 42, 0.45);
		      display: flex; align-items: center; justify-content: center;
		      z-index: 100;
		      backdrop-filter: blur(2px);
		    }
		    .wallet-myfnc-confirm-box {
		      background: #ffffff;
		      border-radius: 10px;
		      padding: 16px 18px;
		      width: 280px;
		      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
		    }
		    .wallet-myfnc-confirm-title {
		      font-size: 13px; font-weight: 700; color: #0f172a;
		      margin-bottom: 6px; letter-spacing: -0.01em;
		    }
		    .wallet-myfnc-confirm-msg {
		      font-size: 12px; color: #64748b;
		      margin-bottom: 14px; line-height: 1.5;
		    }
		    .wallet-myfnc-confirm-actions {
		      display: flex; justify-content: flex-end; gap: 6px;
		    }
		    /* Settings 中的 wallet 摘要行 */
		    .wallet-summary-row {
		      display: flex;
		      align-items: center;
		      justify-content: space-between;
		      gap: 8px;
		    }
		    .wallet-summary-value {
		      font-size: 12px;
		      color: #64748b;
		    }
		    .wallet-summary-edit {
		      font-size: 12px;
		      font-weight: 600;
		      color: #6366f1;
		      cursor: pointer;
		      background: none;
		      border: none;
		      padding: 0;
		    }
		    .wallet-summary-edit:hover { text-decoration: underline; }

		    .empty-state {
		      display: none;
		      margin: 10px 0 6px;
		      padding: 12px 14px;
		      border: 1px solid #e5e7eb;
		      border-radius: 14px;
		      background: #fff;
		      color: #334155;
		      font-size: 13px;
		      line-height: 1.35;
		      box-shadow: 0 10px 30px rgba(15, 23, 42, 0.06);
		    }
		    .empty-state strong { color: #0f172a; }

		    /* 窄屏：右侧按钮隐藏文字标签，只保留图标 */
		    @media (max-width: 1440px) {
		      .cpp-rank-label,
		      .alerts-btn-label,
		      .wallet-btn-label { display: none; }
		      .cpp-rank-btn,
		      .alerts-btn,
		      .wallet-btn { min-width: auto; }
		    }

		    /* ================================================================
		       Wallet v2.3 内联 spend progress + 整卡点击交互
		       (PRD-wallet-v2 §4.4 final design 2026-04-29)
		       ================================================================ */
		    /* Section 标题行（My Cards / All Cards） */
		    .wallet-section-row {
		      display: flex; align-items: center; gap: 8px;
		      margin: 4px 0 6px;
		    }
		    .wallet-section-row .wallet-section-title {
		      flex: 1 1 auto;
		      margin: 0; padding: 0; border: none;
		      font-size: 12px; font-weight: 700;
		      color: #475569; text-transform: none; letter-spacing: 0;
		      display: flex; align-items: baseline; gap: 6px;
		    }
		    .wallet-section-row-divider {
		      margin-top: 14px;
		      padding-top: 10px;
		      border-top: 1px solid #e5e7eb;
		    }
		    .wallet-section-count { color: #94a3b8; font-weight: 500; font-size: 11px; }
		    .wallet-collapse-toggle {
		      flex: 0 0 auto;
		      font-size: 11px; font-weight: 500;
		      color: #64748b; background: #fff;
		      border: 1px solid #e5e7eb;
		      padding: 3px 10px; border-radius: 6px;
		      cursor: pointer;
		      font-family: inherit;
		      transition: background 0.15s, border-color 0.15s;
		    }
		    .wallet-collapse-toggle:hover { background: #f3f4f6; border-color: #cbd5e1; }
		    /* My Cards 空状态 */
		    .wallet-cards-empty {
		      text-align: center;
		      padding: 14px 12px;
		      color: #94a3b8;
		      font-size: 12px;
		      background: #f8fafc;
		      border: 1px dashed #cbd5e1;
		      border-radius: 10px;
		      margin-bottom: 4px;
		    }
		    /* Programs 段顶部稍多间距，与 All Cards 视觉分开 */
		    .wallet-section-title-programs { margin-top: 18px; }

		    /* 隐藏 wallet-card-item 内的原 checkbox（仅作为状态容器，UI 由整卡 + status pill 表达） */
		    .wallet-card-item input[type="checkbox"][data-card-id] {
		      position: absolute;
		      opacity: 0;
		      pointer-events: none;
		      width: 0; height: 0;
		      margin: 0;
		    }
		    /* My Card：背景 + 金色左条 + 完整柔金边框（与 alerts redesign 对齐，独立卡片视觉） */
		    /* Pro 模式 border-left 3px gold (#d4af37) 强调；Free 模式 border-left 仍 transparent（保留 Pro/Free 区分） */
		    /* 其他 3 边 1px #fde68a 柔金边作为完整 card 边界（无论 Pro/Free 都显示） */
		    .wallet-card-item.wallet-card-mine {
		      position: relative;
		      padding: 8px 10px 8px 8px;
		      margin-bottom: 8px;
		      cursor: default;
		      background: linear-gradient(to right, #fffbeb, #fefce8);
		      border-top: 1px solid #fde68a;
		      border-right: 1px solid #fde68a;
		      border-bottom: 1px solid #fde68a;
		      /* border-left 来自 base: 3px solid transparent；wallet-pro-mode 覆盖颜色 */
		    }
		    .wallet-card-item.wallet-card-mine:last-child { margin-bottom: 0; }
		    .wallet-pro-mode .wallet-card-item.wallet-card-mine {
		      border-left-color: #d4af37;
		    }
		    /* Lean Card：整卡可点击 ADD */
		    .wallet-card-item.wallet-card-lean {
		      position: relative;
		      padding: 8px 10px 8px 8px;
		      cursor: pointer;
		      transition: background 0.15s, border-color 0.15s;
		    }
		    .wallet-card-item.wallet-card-lean:hover { background: #f8fafc; }
		    .wallet-card-item.wallet-card-lean:focus-visible {
		      outline: 2px solid #d4af37;
		      outline-offset: -2px;
		    }
		    .wallet-card-item.wallet-card-disabled { opacity: 0.45; cursor: not-allowed; }

		    /* Status pill — 右上角，My Card 上为 "已添加 / 移除"；Lean Card 上为 "添加" */
		    .wallet-status-pill {
		      position: absolute;
		      top: 9px; right: 10px;
		      display: inline-flex; align-items: center;
		      white-space: nowrap;
		      line-height: 1.5;
		      font-size: 9.5px; font-weight: 600;
		      letter-spacing: 0.02em;
		      padding: 2px 9px;
		      border-radius: 999px;
		      transition: background 0.18s, color 0.18s;
		      user-select: none;
		    }
		    /* My pill：金色背景，hover 整 pill 转红 + 文字切到 "Remove" */
		    .wallet-status-pill-mine {
		      background: rgba(245, 158, 11, 0.10);
		      color: #b45309;
		      cursor: pointer;
		    }
		    .wallet-status-pill-mine:hover {
		      background: rgba(220, 38, 38, 0.10);
		      color: #b91c1c;
		    }
		    .wallet-status-pill-mine .pill-default { display: inline; }
		    .wallet-status-pill-mine .pill-hover { display: none; }
		    .wallet-status-pill-mine:hover .pill-default { display: none; }
		    .wallet-status-pill-mine:hover .pill-hover { display: inline; }
		    /* Lean pill：透明，hover 整卡时浅金色背景 */
		    .wallet-status-pill-add {
		      background: transparent;
		      color: #94a3b8;
		      pointer-events: none;
		    }
		    .wallet-card-item.wallet-card-lean:hover .wallet-status-pill-add {
		      background: rgba(245, 158, 11, 0.08);
		      color: #b45309;
		    }
		    /* 给 .card-name 留 pill 位置（仅 name，spend row 保持满宽） */
		    .wallet-card-item.wallet-card-mine .wallet-card-name { padding-right: 70px; }
		    .wallet-card-item.wallet-card-lean .wallet-card-name { padding-right: 50px; }

		    /* My FNC 跳转 link 上推一点，避免与 status-pill 视觉冲突 */
		    .wallet-card-item.wallet-card-mine .wallet-card-myfnc-link {
		      align-self: flex-end;
		      margin-bottom: 4px;
		    }

		    /* ===== 内联 spend progress row ===== */
		    .wallet-spend-row {
		      margin-top: 8px;
		      padding-top: 8px;
		      border-top: 1px dashed #e5e7eb;
		      font-size: 11px;
		      color: #475569;
		      line-height: 1.5;
		    }
		    .wallet-spend-label {
		      display: flex; align-items: center; gap: 6px;
		      margin-bottom: 4px;
		      flex-wrap: wrap;
		    }
		    .wallet-spend-amounts { font-variant-numeric: tabular-nums; }
		    .wallet-spend-amounts .amt {
		      font-weight: 600; color: #0f172a;
		    }
		    .wallet-spend-amounts .target { color: #047857; }
		    .wallet-spend-check {
		      color: #047857; font-weight: 600;
		      font-variant-numeric: tabular-nums;
		    }
		    .wallet-spend-empty {
		      color: #94a3b8; font-style: italic; font-size: 10.5px;
		    }
		    .wallet-spend-edit-btn {
		      margin-left: auto;
		      width: 24px; height: 24px;
		      border: 1px solid #e5e7eb;
		      border-radius: 6px;
		      background: #fff;
		      cursor: pointer;
		      color: #64748b;
		      display: inline-flex; align-items: center; justify-content: center;
		      font-size: 11px; flex: 0 0 auto;
		      font-family: inherit;
		    }
		    .wallet-spend-edit-btn:hover { background: #f3f4f6; color: #0f172a; }
		    .wallet-spend-edit-btn:disabled,
		    .wallet-spend-edit-btn[data-pro-locked="1"] { opacity: 0.5; cursor: not-allowed; }
		    .wallet-spend-bar {
		      height: 6px;
		      background: #f1f5f9;
		      border-radius: 3px;
		      overflow: hidden;
		      position: relative;
		    }
		    .wallet-spend-bar.empty {
		      background: #f8fafc;
		      border: 1px dashed #cbd5e1;
		    }
		    .wallet-spend-bar-fill {
		      height: 100%;
		      background: linear-gradient(90deg, #fbbf24 0%, #f59e0b 100%);
		      border-radius: 3px;
		      transition: width 0.3s ease;
		    }
		    .wallet-spend-bar.done .wallet-spend-bar-fill {
		      background: linear-gradient(90deg, #10b981 0%, #059669 100%);
		    }
		    .wallet-spend-meta {
		      display: flex;
		      justify-content: space-between;
		      margin-top: 3px;
		      font-size: 10px;
		      color: #94a3b8;
		      font-variant-numeric: tabular-nums;
		    }
		    .wallet-spend-meta .pct.done { color: #047857; font-weight: 600; }
		    /* PR-B: 录入消费券 CTA 按钮（沿用 .pct.done 绿色 + 可点击 hover 强调） */
		    .wallet-spend-add-cert {
		      display: inline;
		      font-size: inherit;
		      font-weight: 600;
		      color: #047857;
		      background: transparent;
		      border: none;
		      cursor: pointer;
		      padding: 0;
		      font-family: inherit;
		      font-variant-numeric: tabular-nums;
		      transition: color 0.15s, background 0.15s;
		    }
		    .wallet-spend-add-cert:hover {
		      color: #065f46;
		      text-decoration: underline;
		    }

		    /* Inline edit form */
		    .wallet-spend-edit-form {
		      display: flex; align-items: center; gap: 6px;
		      flex-wrap: wrap;
		    }
		    .wallet-spend-edit-form .prefix {
		      color: #64748b; font-weight: 600; font-size: 12px;
		    }
		    .wallet-spend-edit-form input[data-spend-input] {
		      flex: 1 1 auto; min-width: 120px;
		      padding: 5px 8px;
		      font-size: 12px; font-weight: 700;
		      font-family: inherit; font-variant-numeric: tabular-nums;
		      border: 1px solid #d4af37; border-radius: 6px;
		      outline: none; color: #0f172a;
		    }
		    .wallet-spend-edit-form input[data-spend-input]:focus {
		      border-color: #b45309;
		      box-shadow: 0 0 0 2px rgba(212,175,55,0.15);
		    }
		    .wallet-spend-save, .wallet-spend-cancel {
		      padding: 4px 10px; font-size: 11px; font-weight: 600;
		      border: 1px solid #e5e7eb; border-radius: 6px;
		      cursor: pointer; font-family: inherit;
		    }
		    .wallet-spend-save {
		      background: #16a34a; color: #fff; border-color: #16a34a;
		    }
		    .wallet-spend-save:hover { background: #15803d; }
		    .wallet-spend-save:disabled { opacity: 0.5; cursor: not-allowed; }
		    .wallet-spend-cancel { background: #fff; color: #64748b; }
		    .wallet-spend-cancel:hover { background: #f3f4f6; color: #0f172a; }
		    .wallet-spend-error {
		      margin-top: 6px;
		      padding: 4px 8px;
		      background: #fef2f2; color: #991b1b;
		      border: 1px solid #fecaca;
		      border-radius: 6px;
		      font-size: 11px;
		    }

		    /* ===== Toast undo (固定底部) ===== */
		    .wallet-toast {
		      position: fixed;
		      bottom: 24px; left: 50%;
		      transform: translateX(-50%) translateY(20px);
		      background: #1f2937; color: #fff;
		      padding: 10px 12px 10px 16px;
		      border-radius: 10px;
		      display: none;
		      align-items: center; gap: 14px;
		      font-size: 13px;
		      box-shadow: 0 8px 32px rgba(0,0,0,0.25);
		      z-index: 10000;
		      opacity: 0;
		      transition: opacity 0.2s, transform 0.2s;
		      min-width: 280px;
		      max-width: 90vw;
		      overflow: hidden;
		    }
		    .wallet-toast.show {
		      display: flex;
		      opacity: 1;
		      transform: translateX(-50%) translateY(0);
		    }
		    .wallet-toast-text { flex: 1 1 auto; }
		    .wallet-toast-undo {
		      background: transparent;
		      border: none;
		      color: #fbbf24;
		      font-weight: 700;
		      cursor: pointer;
		      padding: 4px 10px;
		      border-radius: 6px;
		      font-size: 13px;
		      font-family: inherit;
		    }
		    .wallet-toast-undo:hover { background: rgba(255,255,255,0.1); }
		    .wallet-toast-progress {
		      position: absolute;
		      bottom: 0; left: 0;
		      height: 2px;
		      background: #fbbf24;
		      width: 100%;
		    }

		    @media (max-width: 720px) {
		      body { padding: 8px 10px 16px; }

		      /* --- Filter Bar 移动端：扁平化三行布局 --- */
		      /* display:contents 让子元素成为 .filters 直接 flex 子项 */
		      .filters {
		        flex-wrap: wrap;
		        padding: 8px;
		        gap: 6px;
		        justify-content: space-between;
		      }
		      .filters-left { display: contents; }
		      .filters-right { display: contents; }

		      /* Row 1: 搜索框（满行） */
		      .search-wrap {
		        flex: 1 1 100%;
		        width: auto;
		        min-width: 0;
		        max-width: none;
		        order: 1;
		      }
		      .search-wrap input#search { width: 100% !important; }
		      .suggest { width: 100%; max-width: 100%; }

		      /* Row 2: 日期 / 国家 / 城市（三等分同行） */
		      .date-wrapper { flex: 1 1 calc(33% - 4px); min-width: 0; order: 2; height: 34px; }
		      .date-wrapper #date { width: 100%; flex: 1 1 0; height: 34px; font-size: 11px; }
		      .date-wrapper .clear-btn { height: 34px; }
		      .country-wrap {
		        flex: 1 1 calc(33% - 4px);
		        min-width: 0;
		        order: 3;
		        height: 34px;
		      }
		      #country {
		        width: 100%;
		        min-width: 0;
		        max-width: none;
		        height: 34px;
		        font-size: 11px;
		      }
		      .city-combo {
		        flex: 1 1 calc(33% - 4px);
		        min-width: 0;
		        max-width: none;
		        order: 4;
		      }
		      .city-combo-trigger { min-width: 0; width: 100%; height: 34px; font-size: 12px; }
		      .city-combo-panel { width: calc(100vw - 40px); left: auto; right: 0; }

		      /* Row 3: 工具栏（强制占满整行，space-between 对齐 mockup） */
		      .view-toggle { order: 5; flex: 0 0 auto; }
		      .data-filter-wrapper { order: 6; flex: 0 0 auto; }
		      .cpp-rank-btn { order: 7; flex: 0 0 auto; }
		      .alerts-btn { order: 8; flex: 0 0 auto; }
		      .wallet-btn { order: 9; flex: 0 0 auto; }

		      /* 工具栏尺寸（对齐 mockup 34px） */
		      .view-toggle { height: 34px; border-radius: 8px; }
		      .view-toggle .view-btn,
		      .view-toggle .cal-btn,
		      .view-toggle .map-btn { width: 34px; height: 34px; }
		      .data-filter-group { height: 34px; border-radius: 8px; }
		      .data-filter-btn { height: 34px; padding: 0 5px; font-size: 11px; font-weight: 500; gap: 1px; }
		      .data-filter-btn .df-icon { font-size: 12px; line-height: 1; }
		      .cpp-rank-btn,
		      .alerts-btn { height: 34px; min-width: auto; padding: 0 8px; border-radius: 8px; }
		      /* Wallet 按钮：金色高亮强调 */
		      .wallet-btn {
		        height: 34px; min-width: auto; padding: 0 8px; border-radius: 8px;
		        border-color: #f59e0b;
		        background: linear-gradient(135deg, #fffbeb, #fef3c7);
		        box-shadow: 0 0 8px rgba(245, 158, 11, 0.35);
		      }
		      .wallet-btn-icon { width: 20px; height: 20px; }

		      /* --- Brand Tabs 移动端：等宽 segment --- */
		      .brand-row { margin-bottom: 8px; }
		      body.view-map .brand-row {
		        flex-direction: column;
		        align-items: stretch;
		        gap: 6px;
		        flex-wrap: nowrap;
		      }
		      .brand-tabs {
		        gap: 0;
		        flex-wrap: nowrap;
		        border: 1px solid #e5e7eb;
		        border-radius: 10px;
		        overflow: hidden;
		        background: #fff;
		      }
		      .brand-tab {
		        flex: 1 1 0;
		        text-align: center;
		        padding: 6px 2px;
		        font-size: 11px;
		        justify-content: center;
		        display: flex;
		        flex-direction: column;
		        align-items: center;
		        line-height: 1.3;
		        border: none;
		        border-radius: 0;
		        border-right: 1px solid #e5e7eb;
		      }
		      .brand-tab:last-of-type { border-right: none; }
		      .brand-tab .count { display: block; margin-left: 0; }
		      body.view-map .brand-tabs { width: 100%; }
		      body.view-map .overview-scope-ctl {
		        align-self: flex-start;
		        margin-left: 0;
		        max-width: 100%;
		        height: 32px;
		        border-radius: 10px;
		        overflow: hidden;
		      }
		      body.view-map .overview-scope-btn {
		        height: 32px;
		        min-width: 60px;
		        padding: 0 12px;
		        font-size: 11px;
		      }
		      body.view-map .overview-scope-btn .scope-label-full {
		        display: none;
		      }
		      body.view-map .overview-scope-btn .scope-label-short {
		        display: inline;
		      }
		      body.view-map .sub-brand-collapse-btn {
		        flex: 0 0 28px;
		        align-self: stretch;
		        width: 28px;
		        height: auto;
		        border-left: 1px solid #e5e7eb;
		        border-radius: 0;
		      }
		      .sub-brand-collapse-btn { margin-left: 0; height: 28px; width: 24px; padding: 0; font-size: 11px; border-radius: 6px; border: none; background: #fffbeb; box-shadow: none; color: #b45309; }
		      .sub-brand-collapse-btn.collapsed { border: none; background: #fffbeb; box-shadow: none; }
		      body.view-map .sub-brand-collapse-btn.collapsed {
		        border-left: 1px solid #e5e7eb;
		        border-radius: 0;
		      }
		      .sub-brand-collapse-btn span { display: none; }
		      .sub-brand-collapse-btn svg { width: 14px; height: 14px; }

		      /* --- Summary Bar 移动端：横排、隐藏酒店名、紧凑间距 --- */
		      .summary-bar {
		        flex-direction: row;
		        flex-wrap: wrap;
		        gap: 2px 8px;
		        padding: 6px 10px;
		        font-size: 11px;
		      }
		      .summary-item { gap: 3px; }
		      .summary-hotel { display: none; }

		      /* --- Stats 移动端：隐藏当前页/品牌分布，filtered/all data 分行 --- */
		      .stats { padding: 6px 10px; font-size: 11px; }
		      .stats-page-detail { display: none; }
		      .stats-row { display: block; }
		      .stats-row span { margin-right: 6px; }
		      .stats-days { display: none; }
		      .stats-latest { display: none; }

		      /* --- Table 移动端：隐藏次要列 + 水平滚动 --- */
		      .results-panel { overflow-x: auto; -webkit-overflow-scrolling: touch; }
		      table { min-width: 480px; }
		      th, td { padding: 8px 6px; font-size: 12px; white-space: nowrap; }
		      /* 隐藏 sub-brand、city、date 列 */
		      th:nth-child(3),
		      td:nth-child(3),
		      th:nth-child(4),
		      td:nth-child(4),
		      th:nth-child(8),
		      td:nth-child(8) { display: none; }
		      /* 酒店名列截断 */
		      td:first-child {
		        white-space: nowrap;
		        max-width: 150px;
		        overflow: hidden;
		        text-overflow: ellipsis;
		      }

		      /* 移动端隐藏分页，使用无限滚动 */
		      .pagination { display: none; }

		      /* 无限滚动哨兵 */
		      .scroll-sentinel {
		        text-align: center;
		        padding: 12px;
		        font-size: 12px;
		        color: #9ca3af;
		      }

		      /* city-combo 窄屏适配 */
		      .city-combo-trigger { font-size: 12px; min-width: 0; }
		      .city-combo-panel { width: calc(100vw - 40px); left: auto; right: 0; }
		    }