@layer states {

  .tile:hover { border-color: var(--wd-accent); color: var(--text); }
  .tile[data-pay]:hover { border-color: #27d086; color: #0a7a4d; }
  .tile:active { transform: scale(.97); }

  .tile[aria-selected="true"] {
    background: var(--wd-accent);
    border-color: var(--wd-accent);
    color: #2d1200;
  }
  .tile[aria-selected="true"] svg { opacity: 1; color: #2d1200; stroke: currentColor; }
  .searchbox:focus-within { border-color: var(--wd-accent); }
  .searchbox input:focus,
  .searchbox input:focus-visible { outline: none; }
  .acrow:hover,
  .acrow:focus-visible { background: var(--row); }
  .search-go:hover {
    background: #f0602a;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .26), 0 4px 14px -3px rgba(226, 82, 28, .6);
  }

  .rail-fly:hover { filter: brightness(1.06); }
  .tools-btn:hover { background: rgba(255, 107, 53, .13); color: var(--wd-accent); }
  .subchip:not(.on):hover { background: rgba(255, 107, 53, .08); }
  .dd-row:hover { border-color: var(--wd-accent); }
  .cal .c-d:not(.off):not(.mut):hover { background: var(--row2); }
  .cal .c-q:hover { border-color: var(--wd-accent); color: var(--text); }
  .msg .go:hover { filter: brightness(1.06); }
  .msg .wd-shb:hover { background: var(--wd-accent); color: #2d1200; }
  .msg .fav-toggle:hover { color: var(--gold); }
  .msg .vbtn:hover { border-color: var(--wd-accent); }
  .catcard-supbtn:hover, .supm-best:hover { filter: brightness(1.05); }
  .msg .wd-fp92 a:hover img { filter: brightness(1.05); }
  #backTop:hover, #nextDeal:hover { transform: translateY(-2px); box-shadow: 0 10px 26px rgba(58, 123, 213, .6); }
  #backTop:active, #nextDeal:active { transform: scale(.93); }
  .tabbar button:hover { color: var(--text); }
  .tabbar button[aria-selected="true"]:hover { color: var(--wd-accent); }
  .transparency:hover { border-color: var(--wd-accent); }
  .fk-chip:not([aria-pressed="true"]):hover { border-color: var(--wd-accent); }
  .fk-go:hover b { color: var(--wd-accent); }
}