.cct-collection {
  --cct-bg: #050915;
  --cct-panel: rgba(11, 17, 32, 0.92);
  --cct-panel-soft: rgba(16, 24, 42, 0.84);
  --cct-line: rgba(168, 92, 255, 0.48);
  --cct-line-soft: rgba(185, 196, 219, 0.18);
  --cct-text: #f7f8ff;
  --cct-muted: #aeb8cf;
  --cct-purple: #b665ff;
  --cct-purple-strong: #8d3cff;
  --cct-blue: #2a7cff;
  color: var(--cct-text);
  background:
    radial-gradient(circle at 18% 10%, rgba(122, 67, 255, 0.26), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(42, 124, 255, 0.16), transparent 28%),
    linear-gradient(180deg, #070b15 0%, #050915 42%, #040711 100%);
  border-radius: 0;
  box-sizing: border-box;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  margin: 0 auto;
  max-width: 1500px;
  min-height: 100vh;
  overflow: hidden;
  padding: 0 34px 54px;
}

.cct-collection *,
.cct-collection *::before,
.cct-collection *::after {
  box-sizing: border-box;
}

.cct-app-header {
  align-items: center;
  border-bottom: 1px solid rgba(185, 196, 219, 0.12);
  display: grid;
  gap: 22px;
  grid-template-columns: 190px 1fr 44px;
  min-height: 98px;
}

.cct-brand {
  display: inline-grid;
  justify-items: start;
  line-height: 0.9;
  text-transform: uppercase;
}

.cct-brand__top {
  font-size: 12px;
  font-style: italic;
  font-weight: 800;
  letter-spacing: 0;
}

.cct-brand__name {
  font-size: 31px;
  font-weight: 900;
  letter-spacing: 0;
}

.cct-brand__season {
  color: var(--cct-purple);
  font-size: 15px;
  font-weight: 800;
  justify-self: center;
  letter-spacing: 0;
}

.cct-main-nav {
  align-items: stretch;
  display: flex;
  gap: 34px;
  justify-content: flex-end;
  min-height: 98px;
}

.cct-main-nav a {
  align-items: center;
  color: #f6f7fb;
  display: inline-flex;
  font-size: 15px;
  font-weight: 700;
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
}

.cct-main-nav a.is-active::after,
.cct-main-nav a:hover::after,
.cct-main-nav a:focus::after {
  background: var(--cct-purple);
  bottom: 0;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  right: 0;
}

.cct-profile-mark {
  background:
    radial-gradient(circle at 50% 36%, #bc84ff 0 20%, transparent 21%),
    radial-gradient(circle at 50% 78%, #8f56e8 0 34%, transparent 35%),
    linear-gradient(135deg, #331b61, #7b45d6);
  border: 1px solid rgba(194, 132, 255, 0.72);
  border-radius: 999px;
  height: 44px;
  width: 44px;
}

.cct-collection__header {
  margin: 38px 0 26px;
}

.cct-collection__header h2 {
  color: var(--cct-text);
  font-size: 44px;
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1.05;
  margin: 0 0 14px;
}

.cct-collection__header p {
  color: var(--cct-muted);
  font-size: 20px;
  margin: 0;
}

.cct-toolbar {
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(260px, 1fr) auto;
  margin-bottom: 14px;
}

.cct-search {
  display: block;
  position: relative;
}

.cct-search span {
  clip: rect(0 0 0 0);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.cct-search::before {
  border: 2px solid var(--cct-muted);
  border-radius: 999px;
  content: "";
  height: 19px;
  left: 27px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 19px;
  z-index: 1;
}

.cct-search::after {
  background: var(--cct-muted);
  content: "";
  height: 7px;
  left: 42px;
  position: absolute;
  top: 50%;
  transform: translateY(5px) rotate(45deg);
  width: 2px;
  z-index: 1;
}

.cct-search__input {
  background: rgba(7, 12, 24, 0.78);
  border: 1px solid var(--cct-line);
  border-radius: 8px;
  color: var(--cct-text);
  font-size: 19px;
  min-height: 72px;
  outline: none;
  padding: 0 22px 0 72px;
  width: 100%;
}

.cct-search__input:focus {
  border-color: rgba(194, 132, 255, 0.9);
  box-shadow: 0 0 0 3px rgba(182, 101, 255, 0.18);
}

.cct-search__input::placeholder,
.cct-pack-entry__input::placeholder {
  color: #aeb8cf;
}

.cct-login-required,
.cct-auth-panel {
  background: rgba(11, 17, 32, 0.88);
  border: 1px solid rgba(168, 92, 255, 0.48);
  border-radius: 8px;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.22);
  color: var(--cct-text);
  margin: 36px 0;
  max-width: 620px;
  padding: 24px;
}

.cct-login-required p,
.cct-auth-panel p {
  color: var(--cct-muted);
  font-size: 17px;
  line-height: 1.45;
  margin: 0;
}

.cct-login-required p + p,
.cct-auth-panel p + p {
  margin-top: 8px;
}

.cct-login-required a,
.cct-auth-panel a {
  color: #d8b3ff;
  font-weight: 800;
  text-decoration: none;
}

.cct-login-required a:hover,
.cct-login-required a:focus,
.cct-auth-panel a:hover,
.cct-auth-panel a:focus {
  color: #fff;
  text-decoration: underline;
}

.cct-auth-panel h2 {
  color: var(--cct-text);
  font-size: 32px;
  line-height: 1.1;
  margin: 0 0 10px;
}

.cct-auth-form {
  display: grid;
  gap: 14px;
  margin-top: 22px;
}

.cct-auth-form label {
  display: grid;
  gap: 7px;
}

.cct-auth-form span {
  color: #c8d5f2;
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.cct-auth-form input {
  background: rgba(7, 12, 24, 0.9);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 8px;
  color: var(--cct-text);
  font: inherit;
  min-height: 48px;
  outline: none;
  padding: 0 14px;
}

.cct-auth-form input:focus {
  border-color: rgba(194, 132, 255, 0.9);
  box-shadow: 0 0 0 3px rgba(182, 101, 255, 0.18);
}

.cct-auth-button {
  align-items: center;
  background: linear-gradient(180deg, rgba(182, 101, 255, 0.95), rgba(116, 64, 227, 0.9));
  border: 1px solid rgba(216, 179, 255, 0.7);
  border-radius: 8px;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-weight: 900;
  justify-content: center;
  min-height: 48px;
  padding: 0 18px;
  text-decoration: none;
}

.cct-auth-button:hover,
.cct-auth-button:focus {
  filter: brightness(1.08);
  text-decoration: none;
}

.cct-auth-error,
.cct-auth-success {
  background: rgba(255, 74, 113, 0.14);
  border: 1px solid rgba(255, 120, 150, 0.42);
  border-radius: 8px;
  color: #ffd7df;
  font-weight: 800;
  margin-top: 18px;
  padding: 12px 14px;
}

.cct-auth-success {
  background: rgba(40, 210, 149, 0.14);
  border-color: rgba(85, 230, 177, 0.42);
  color: #ceffec;
}

.cct-auth-alt {
  margin-top: 18px;
}

.cct-filter {
  align-self: stretch;
  background: rgba(7, 12, 24, 0.78);
  border: 1px solid var(--cct-line);
  border-radius: 8px;
  display: inline-flex;
  overflow: hidden;
}

.cct-filter__button {
  background: transparent;
  border: 0;
  border-right: 1px solid rgba(185, 196, 219, 0.16);
  color: var(--cct-muted);
  cursor: pointer;
  font-weight: 800;
  min-height: 72px;
  padding: 0 16px;
  text-transform: uppercase;
}

.cct-filter__button:last-child {
  border-right: 0;
}

.cct-filter__button.is-active {
  background: linear-gradient(180deg, rgba(182, 101, 255, 0.28), rgba(96, 49, 190, 0.24));
  color: #fff;
}

.cct-export,
.cct-actions,
.cct-section-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.cct-export {
  margin: 0 0 12px;
}

.cct-export a,
.cct-section-nav a,
.cct-action-button {
  background: rgba(12, 19, 36, 0.86);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 8px;
  color: var(--cct-text);
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  min-height: 38px;
  padding: 9px 12px;
  text-decoration: none;
}

.cct-export a:hover,
.cct-export a:focus,
.cct-section-nav a:hover,
.cct-section-nav a:focus,
.cct-action-button:hover,
.cct-action-button:focus {
  border-color: var(--cct-purple);
}

.cct-quick-entry {
  background: rgba(10, 16, 30, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  display: grid;
  gap: 10px;
  margin: 0 0 16px;
  padding: 12px;
}

.cct-pack-station {
  background:
    linear-gradient(180deg, rgba(10, 16, 30, 0.82), rgba(5, 9, 18, 0.92)),
    radial-gradient(circle at 18% 0%, rgba(182, 101, 255, 0.2), transparent 28%);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 8px;
  display: grid;
  gap: 14px;
  padding: 18px;
}

.cct-pack-entry {
  color: var(--cct-muted);
  display: grid;
  font-size: 13px;
  font-weight: 700;
  gap: 6px;
}

.cct-pack-entry__input {
  background: rgba(7, 12, 24, 0.86);
  border: 1px solid rgba(185, 196, 219, 0.2);
  border-radius: 8px;
  color: var(--cct-text);
  min-height: 62px;
  padding: 10px 12px;
  resize: vertical;
  width: 100%;
}

.cct-pack-entry--large .cct-pack-entry__input {
  font-size: 18px;
  line-height: 1.45;
  min-height: 230px;
}

.cct-action-button--primary {
  background: linear-gradient(135deg, rgba(147, 83, 255, 0.95), rgba(74, 119, 255, 0.86));
  border-color: rgba(226, 207, 255, 0.42);
  color: #ffffff;
  font-weight: 900;
  min-width: 150px;
}

.cct-action-status {
  color: var(--cct-muted);
  font-size: 13px;
  min-height: 20px;
}

.cct-add-results {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

.cct-add-results__header {
  align-items: end;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.cct-add-results__header h3 {
  color: var(--cct-text);
  font-size: 24px;
  line-height: 1;
  margin: 0;
}

.cct-add-results__header span {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 800;
}

.cct-add-results__list {
  display: grid;
  gap: 8px;
}

.cct-add-result {
  align-items: center;
  background: rgba(12, 19, 34, 0.92);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(64px, 90px) minmax(180px, 1fr) minmax(180px, auto);
  padding: 13px 15px;
}

.cct-add-result--new {
  border-color: rgba(91, 219, 179, 0.34);
}

.cct-add-result--duplicate {
  border-color: rgba(255, 214, 102, 0.32);
}

.cct-add-result--missing {
  border-color: rgba(255, 111, 111, 0.36);
}

.cct-add-result__number {
  color: #ffffff;
  font-weight: 900;
}

.cct-add-result__main {
  display: grid;
  gap: 4px;
}

.cct-add-result__main strong {
  color: var(--cct-text);
  font-weight: 900;
}

.cct-add-result__main span {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 700;
}

.cct-add-result__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  justify-content: flex-end;
}

.cct-add-result__tags span {
  background: rgba(247, 248, 255, 0.07);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 999px;
  color: #dbe2f2;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  padding: 7px 9px;
  text-transform: uppercase;
}

.cct-dashboard {
  display: grid;
  gap: 22px;
}

.cct-dashboard-grid {
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
}

.cct-dashboard-stat {
  background:
    linear-gradient(180deg, rgba(12, 19, 34, 0.94), rgba(7, 11, 22, 0.96)),
    radial-gradient(circle at 88% 0%, rgba(182, 101, 255, 0.16), transparent 34%);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 8px;
  color: var(--cct-text);
  display: grid;
  gap: 8px;
  min-height: 130px;
  padding: 16px;
  text-decoration: none;
}

.cct-dashboard-stat:hover,
.cct-dashboard-stat:focus {
  border-color: rgba(194, 132, 255, 0.92);
  outline: none;
}

.cct-dashboard-stat__label,
.cct-dashboard-stat__caption {
  color: var(--cct-muted);
  font-size: 12px;
  font-weight: 800;
  text-transform: uppercase;
}

.cct-dashboard-stat strong {
  align-self: end;
  color: #ffffff;
  font-size: 34px;
  font-weight: 900;
  line-height: 1;
}

.cct-dashboard-stat small {
  color: var(--cct-muted);
  font-size: 17px;
  margin-left: 3px;
}

.cct-dashboard-panels {
  align-items: start;
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.cct-dashboard-panel {
  align-self: start;
  background: rgba(10, 16, 30, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  display: grid;
  gap: 14px;
  padding: 16px;
}

.cct-dashboard-maintenance {
  align-items: center;
  background: rgba(10, 16, 30, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 16px;
}

.cct-dashboard-maintenance h2 {
  color: var(--cct-text);
  font-size: 20px;
  line-height: 1;
  margin: 0 0 7px;
}

.cct-dashboard-maintenance p {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 700;
  margin: 0;
}

.cct-dashboard-panel__header {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.cct-dashboard-panel__header h2 {
  color: var(--cct-text);
  font-size: 24px;
  line-height: 1;
  margin: 0;
}

.cct-dashboard-panel__header a {
  color: var(--cct-purple);
  font-size: 13px;
  font-weight: 900;
  text-decoration: none;
}

.cct-dashboard-panel__actions {
  align-items: center;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: flex-end;
}

.cct-dashboard-panel__actions form {
  margin: 0;
}

.cct-danger-button {
  background: rgba(255, 97, 116, 0.1);
  border: 1px solid rgba(255, 97, 116, 0.42);
  border-radius: 8px;
  color: #ff9aa8;
  cursor: pointer;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  min-height: 34px;
  padding: 0 12px;
}

.cct-danger-button:hover,
.cct-danger-button:focus {
  background: rgba(255, 97, 116, 0.16);
  border-color: rgba(255, 97, 116, 0.78);
  outline: none;
}

.cct-success-note {
  background: rgba(91, 219, 179, 0.1);
  border: 1px solid rgba(91, 219, 179, 0.28);
  border-radius: 8px;
  color: #72e7c5;
  font-size: 13px;
  font-weight: 800;
  margin: 12px 0 0;
  padding: 10px 12px;
}

.cct-progress-list {
  display: grid;
  gap: 9px;
}

.cct-progress-row {
  background: rgba(7, 12, 24, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.12);
  border-radius: 8px;
  color: var(--cct-text);
  display: grid;
  gap: 8px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding: 11px 12px;
  text-decoration: none;
}

.cct-progress-row:hover,
.cct-progress-row:focus {
  border-color: rgba(194, 132, 255, 0.7);
  outline: none;
}

.cct-progress-row__label,
.cct-progress-row__count {
  font-size: 13px;
  font-weight: 900;
}

.cct-progress-row__count {
  color: var(--cct-muted);
}

.cct-progress-row__bar {
  background: rgba(185, 196, 219, 0.12);
  border-radius: 999px;
  grid-column: 1 / -1;
  height: 8px;
  overflow: hidden;
}

.cct-progress-row__bar span {
  background: linear-gradient(90deg, #72e7c5, #a967ff);
  border-radius: inherit;
  display: block;
  height: 100%;
}

.cct-trade-list {
  display: grid;
  gap: 18px;
}

.cct-trade-list__toolbar {
  align-items: center;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(0, 1fr) auto;
}

.cct-trade-list__summary {
  align-items: baseline;
  background:
    linear-gradient(180deg, rgba(12, 19, 34, 0.94), rgba(7, 11, 22, 0.96)),
    radial-gradient(circle at 88% 0%, rgba(91, 219, 179, 0.15), transparent 34%);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 8px;
  color: var(--cct-muted);
  display: flex;
  gap: 10px;
  padding: 16px;
}

.cct-trade-list__summary strong {
  color: #ffffff;
  font-size: 34px;
  font-weight: 900;
  line-height: 1;
}

.cct-trade-list__summary span {
  font-size: 15px;
  font-weight: 800;
}

.cct-empty-state {
  background: rgba(10, 16, 30, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  padding: 24px;
}

.cct-empty-state h2 {
  color: var(--cct-text);
  font-size: 24px;
  line-height: 1;
  margin: 0 0 8px;
}

.cct-empty-state p {
  color: var(--cct-muted);
  font-size: 15px;
  margin: 0;
}

.cct-trade-groups {
  display: grid;
  gap: 16px;
}

.cct-trade-group {
  background: rgba(10, 16, 30, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  overflow: hidden;
}

.cct-trade-group__header {
  align-items: center;
  border-bottom: 1px solid rgba(185, 196, 219, 0.14);
  display: flex;
  gap: 12px;
  justify-content: space-between;
  padding: 14px 16px;
}

.cct-trade-group__header h2 {
  color: var(--cct-text);
  font-size: 22px;
  line-height: 1;
  margin: 0;
}

.cct-trade-group__header span {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 900;
}

.cct-trade-items {
  display: grid;
}

.cct-trade-item {
  align-items: center;
  color: var(--cct-text);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(64px, 90px) minmax(180px, 1fr) minmax(170px, 260px) 56px;
  padding: 13px 16px;
}

.cct-wishlist-item {
  align-items: center;
  color: var(--cct-text);
  display: grid;
  gap: 14px;
  grid-template-columns: minmax(64px, 90px) minmax(180px, 1fr) minmax(170px, 260px) 120px;
  padding: 13px 16px;
}

.cct-trade-item + .cct-trade-item {
  border-top: 1px solid rgba(185, 196, 219, 0.1);
}

.cct-wishlist-item + .cct-wishlist-item {
  border-top: 1px solid rgba(185, 196, 219, 0.1);
}

.cct-trade-item__number {
  color: #ffffff;
  font-weight: 900;
}

.cct-trade-item__main {
  display: grid;
  gap: 4px;
}

.cct-trade-item__main strong {
  font-weight: 900;
}

.cct-trade-item__main span,
.cct-trade-item__variant {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 800;
}

.cct-trade-item__qty {
  background: rgba(91, 219, 179, 0.12);
  border: 1px solid rgba(91, 219, 179, 0.36);
  border-radius: 999px;
  color: #72e7c5;
  font-size: 13px;
  font-weight: 900;
  justify-self: end;
  line-height: 1;
  padding: 8px 10px;
}

.cct-wishlist-status {
  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;
  justify-self: end;
  line-height: 1;
  padding: 8px 10px;
  text-transform: uppercase;
}

.cct-wishlist-status.is-needed {
  background: rgba(255, 214, 102, 0.1);
  border: 1px solid rgba(255, 214, 102, 0.34);
  color: #ffd666;
}

.cct-wishlist-status.is-owned {
  background: rgba(91, 219, 179, 0.12);
  border: 1px solid rgba(91, 219, 179, 0.36);
  color: #72e7c5;
}

.cct-trade-centre {
  display: grid;
  gap: 22px;
}

.cct-trade-picker,
.cct-trade-builder {
  display: grid;
  gap: 18px;
}

.cct-trade-picker {
  background: rgba(10, 16, 30, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  padding: 16px;
}

.cct-pack-entry {
  display: grid;
  gap: 8px;
}

.cct-pack-entry span {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 900;
  text-transform: uppercase;
}

.cct-pack-entry select {
  appearance: none;
  background: rgba(4, 8, 16, 0.78);
  border: 1px solid rgba(185, 196, 219, 0.22);
  border-radius: 8px;
  color: var(--cct-text);
  font: inherit;
  font-weight: 800;
  min-height: 48px;
  padding: 0 14px;
}

.cct-pack-entry select:focus {
  border-color: rgba(194, 132, 255, 0.92);
  outline: none;
}

.cct-search__input {
  background: rgba(4, 8, 16, 0.78);
  border: 1px solid rgba(185, 196, 219, 0.22);
  border-radius: 8px;
  color: var(--cct-text);
  font: inherit;
  font-weight: 800;
  min-height: 46px;
  padding: 0 14px 0 72px;
  width: 100%;
}

.cct-search__input::placeholder {
  color: rgba(185, 196, 219, 0.76);
}

.cct-search__input:focus {
  border-color: rgba(194, 132, 255, 0.92);
  outline: none;
}

.cct-muted-note {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 700;
  margin: 0;
}

.cct-empty-state--compact {
  padding: 14px;
}

.cct-trade-filters {
  background: rgba(10, 16, 30, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  grid-template-columns: minmax(220px, 1fr) repeat(3, minmax(140px, 190px));
  padding: 16px;
}

.cct-trade-filters label {
  display: grid;
  gap: 8px;
}

.cct-trade-filters label > span {
  color: var(--cct-muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.cct-trade-filters select {
  appearance: none;
  background: rgba(4, 8, 16, 0.78);
  border: 1px solid rgba(185, 196, 219, 0.22);
  border-radius: 8px;
  color: var(--cct-text);
  font: inherit;
  font-size: 14px;
  font-weight: 800;
  min-height: 46px;
  padding: 0 12px;
}

.cct-trade-filters select:focus {
  border-color: rgba(194, 132, 255, 0.92);
  outline: none;
}

.cct-trade-match-list,
.cct-trade-deals {
  display: grid;
  gap: 8px;
}

.cct-trade-match {
  align-items: center;
  background: rgba(7, 12, 24, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.12);
  border-radius: 8px;
  color: var(--cct-text);
  display: grid;
  gap: 14px;
  grid-template-columns: 26px minmax(58px, 82px) minmax(180px, 1fr) minmax(160px, 240px) 56px;
  padding: 13px 16px;
}

.cct-trade-match:hover,
.cct-trade-match:focus-within,
.cct-trade-match.is-selected {
  border-color: rgba(194, 132, 255, 0.7);
}

.cct-trade-match.is-selected {
  background:
    linear-gradient(180deg, rgba(18, 26, 46, 0.9), rgba(9, 14, 27, 0.88)),
    radial-gradient(circle at 90% 10%, rgba(182, 101, 255, 0.18), transparent 34%);
}

.cct-trade-match input {
  accent-color: #b665ff;
  height: 18px;
  width: 18px;
}

.cct-trade-item__variant small {
  color: rgba(185, 196, 219, 0.68);
  display: block;
  font-size: 11px;
  font-weight: 900;
  margin-top: 4px;
  text-transform: uppercase;
}

.cct-trade-submit {
  display: flex;
  justify-content: flex-end;
}

.cct-trade-proposal-summary {
  align-items: center;
  background:
    linear-gradient(180deg, rgba(12, 19, 34, 0.92), rgba(7, 11, 22, 0.96)),
    radial-gradient(circle at 92% 0%, rgba(91, 219, 179, 0.13), transparent 32%);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  color: var(--cct-muted);
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: space-between;
  padding: 14px 16px;
}

.cct-trade-proposal-summary.is-balanced {
  border-color: rgba(91, 219, 179, 0.36);
}

.cct-trade-proposal-summary.is-you-overpay {
  border-color: rgba(255, 214, 102, 0.38);
}

.cct-trade-proposal-summary.is-they-overpay {
  border-color: rgba(182, 101, 255, 0.42);
}

.cct-trade-proposal-summary.is-mixed {
  border-color: rgba(106, 170, 255, 0.34);
}

.cct-trade-proposal-summary span {
  align-items: baseline;
  display: inline-flex;
  font-size: 13px;
  font-weight: 900;
  gap: 7px;
  text-transform: uppercase;
}

.cct-trade-proposal-summary strong {
  color: #ffffff;
  font-size: 26px;
  line-height: 1;
}

.cct-trade-proposal-summary em {
  color: var(--cct-muted);
  font-size: 13px;
  font-style: normal;
  font-weight: 800;
}

.cct-action-button:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.cct-trade-status-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.cct-trade-status-filter__button {
  align-items: center;
  background: rgba(7, 12, 24, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 999px;
  color: var(--cct-muted);
  cursor: pointer;
  display: inline-flex;
  font: inherit;
  font-size: 12px;
  font-weight: 900;
  gap: 7px;
  padding: 8px 10px;
  text-transform: uppercase;
}

.cct-trade-status-filter__button span {
  background: rgba(185, 196, 219, 0.12);
  border-radius: 999px;
  color: var(--cct-text);
  min-width: 22px;
  padding: 3px 6px;
  text-align: center;
}

.cct-trade-status-filter__button:hover,
.cct-trade-status-filter__button:focus,
.cct-trade-status-filter__button.is-active {
  border-color: rgba(194, 132, 255, 0.78);
  color: var(--cct-text);
  outline: none;
}

.cct-trade-deal {
  background: rgba(7, 12, 24, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.14);
  border-radius: 8px;
  display: grid;
  gap: 12px;
  padding: 14px;
}

.cct-trade-deal__header {
  align-items: center;
  display: flex;
  gap: 12px;
  justify-content: space-between;
}

.cct-trade-deal__header strong {
  color: var(--cct-text);
  display: grid;
  gap: 4px;
  font-weight: 900;
}

.cct-trade-deal__header strong small {
  color: var(--cct-muted);
  font-size: 12px;
  font-weight: 800;
}

.cct-trade-deal__header span {
  border-radius: 999px;
  color: var(--cct-muted);
  font-size: 12px;
  font-weight: 900;
  padding: 7px 10px;
  text-transform: uppercase;
}

.cct-trade-status--needs-you {
  background: rgba(255, 214, 102, 0.1);
  border: 1px solid rgba(255, 214, 102, 0.34);
  color: #ffd666 !important;
}

.cct-trade-status--waiting {
  background: rgba(182, 101, 255, 0.1);
  border: 1px solid rgba(182, 101, 255, 0.34);
  color: #cfa3ff !important;
}

.cct-trade-status--completed {
  background: rgba(91, 219, 179, 0.12);
  border: 1px solid rgba(91, 219, 179, 0.36);
  color: #72e7c5 !important;
}

.cct-trade-status--declined,
.cct-trade-status--failed {
  background: rgba(255, 112, 112, 0.1);
  border: 1px solid rgba(255, 112, 112, 0.34);
  color: #ff9c9c !important;
}

.cct-trade-deal__items {
  display: grid;
  gap: 8px;
}

.cct-trade-deal__item {
  align-items: center;
  background: rgba(4, 8, 16, 0.62);
  border: 1px solid rgba(185, 196, 219, 0.1);
  border-radius: 8px;
  color: var(--cct-text);
  display: grid;
  gap: 10px;
  grid-template-columns: 100px minmax(0, 1fr) auto;
  padding: 11px 12px;
}

.cct-trade-deal__item span {
  color: var(--cct-muted);
  font-size: 12px;
  font-weight: 900;
  text-transform: uppercase;
}

.cct-trade-deal__item em {
  color: var(--cct-muted);
  font-style: normal;
  font-weight: 800;
}

.cct-trade-deal__actions {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}

.cct-trade-receipt {
  background: rgba(4, 8, 16, 0.46);
  border: 1px solid rgba(185, 196, 219, 0.1);
  border-radius: 8px;
  overflow: hidden;
}

.cct-trade-receipt summary {
  color: var(--cct-purple);
  cursor: pointer;
  font-size: 13px;
  font-weight: 900;
  padding: 11px 12px;
}

.cct-trade-receipt__meta {
  border-top: 1px solid rgba(185, 196, 219, 0.1);
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  padding: 12px;
}

.cct-trade-receipt__meta span {
  background: rgba(7, 12, 24, 0.72);
  border: 1px solid rgba(185, 196, 219, 0.1);
  border-radius: 8px;
  color: var(--cct-muted);
  display: grid;
  font-size: 12px;
  font-weight: 800;
  gap: 4px;
  padding: 10px;
}

.cct-trade-receipt__meta strong {
  color: var(--cct-text);
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
}

.cct-trade-receipt__grid {
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  padding: 0 12px 12px;
}

.cct-trade-receipt__column {
  background: rgba(7, 12, 24, 0.62);
  border: 1px solid rgba(185, 196, 219, 0.1);
  border-radius: 8px;
  display: grid;
  gap: 8px;
  padding: 12px;
}

.cct-trade-receipt__column h3 {
  color: var(--cct-text);
  font-size: 15px;
  line-height: 1;
  margin: 0;
}

.cct-trade-receipt__column p {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 800;
  margin: 0;
}

.cct-trade-receipt__card {
  border-top: 1px solid rgba(185, 196, 219, 0.1);
  color: var(--cct-text);
  display: grid;
  gap: 4px;
  padding-top: 8px;
}

.cct-trade-receipt__card span {
  color: #ffffff;
  font-size: 13px;
  font-weight: 900;
}

.cct-trade-receipt__card strong {
  font-size: 14px;
  font-weight: 900;
}

.cct-trade-receipt__card em {
  color: var(--cct-muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  line-height: 1.45;
}

.cct-section-nav {
  margin: 12px 0 28px;
  overflow-x: auto;
  padding-bottom: 2px;
}

.cct-section-nav a {
  flex: 0 0 auto;
}

.cct-set-grid {
  display: grid;
  gap: 22px;
  grid-template-columns: repeat(auto-fill, minmax(205px, 1fr));
}

.cct-set {
  background: var(--cct-panel);
  border: 1px solid var(--cct-line);
  border-radius: 8px;
  box-shadow: 0 22px 52px rgba(0, 0, 0, 0.34);
  min-height: 0;
  overflow: hidden;
}

.cct-set-link {
  color: inherit;
  display: block;
  text-decoration: none;
}

.cct-set-link:hover,
.cct-set-link:focus {
  border-color: rgba(194, 132, 255, 0.92);
  box-shadow: 0 26px 60px rgba(77, 32, 149, 0.38);
  outline: none;
}

.cct-set__summary {
  background:
    linear-gradient(180deg, rgba(3, 7, 16, 0.08), rgba(3, 7, 16, 0.88)),
    radial-gradient(circle at 72% 20%, rgba(182, 101, 255, 0.34), transparent 28%),
    linear-gradient(135deg, rgba(79, 42, 155, 0.92), rgba(8, 14, 28, 0.94));
  cursor: pointer;
  display: grid;
  min-height: 365px;
  padding: 22px 22px 24px;
  position: relative;
}

.cct-set__summary::marker,
.cct-team__summary::marker,
.cct-card summary::marker {
  color: var(--cct-purple);
}

.cct-set__summary::before {
  background:
    linear-gradient(180deg, rgba(2, 5, 12, 0.08) 0%, rgba(2, 5, 12, 0.35) 42%, rgba(2, 5, 12, 0.92) 100%),
    linear-gradient(135deg, transparent 0 44%, rgba(255, 255, 255, 0.13) 45% 46%, transparent 47%);
  content: "";
  inset: 0;
  opacity: 0.95;
  position: absolute;
}

.cct-set__art {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  inset: 0;
  opacity: 0.94;
  position: absolute;
}

.cct-set__art--all {
  background-image: url("../images/set-art/all-sets-fallback.png");
}

.cct-set__art--base {
  background-image: url("../images/set-art/base.svg");
}

.cct-set__art--pixel {
  background-image: url("../images/set-art/pixel.svg");
  image-rendering: pixelated;
}

.cct-set__art--8-bit-ballers {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/blt90b22202db3facad/6a60d7e89e4a6b7d3af52d49/26PRML_8BIT_BALLERS_CRF_2508.jpg");
}

.cct-set__art--flying-the-flag {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/blt6d9cb874b191eef3/6a60d8187bf5f64b8143132c/26PRML_FLYING_THE_FLAG_CRF_2223.jpg");
}

.cct-set__art--black-edge {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/bltd2e167e461af1f62/6a7482b1b59102994deea26f/26PRML_BLACK_EDGE_CRF_4073.jpg");
}

.cct-set__art--future-stars {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/blt1a6086964ad0bdf8/6a60d7e8a66b92bc018134a1/26PRML_FUTURE_STARS_AUTO_CRF_8110.jpg");
}

.cct-set__art--retro-threads {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/blt3b617fe390575cb6/6a60d7e7b93259893cb2730c/26PRML_RETRO_THREADS_CRF_2653.jpg");
}

.cct-set__art--chrome-classics {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/bltcc65f499dff44ca3/6a60dfa60425806f510bf3e0/26PRML_CHROME_CLASSICS_CRF_2545_%281%29.jpg");
}

.cct-set__art--gold-lion {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/blt2cb4cfe07ed662c5/6a60dfb02608016bad86bb9b/26PRML_GOLD_LION_CRF_2600_%283%29.jpg");
}

.cct-set__art--diamond-rookies {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/blt9ab661c6fc5ae2e1/6a60dfab8a87c80b7c5e83e8/26PRML_DIAMOND_ROOKIES_CRF_4262_%282%29.jpg");
}

.cct-set__art--all-kings {
  background-image: url("https://images.topps.com/v3/assets/bltc7206971cb4b2bfc/bltf08fa73d0f16a975/6a60dfb53bf82541b1fc3b48/26PRML_ALL_KINGS_CRF_4218_%281%29.jpg");
}

.cct-set__art--gold {
  background-image: url("../images/set-art/gold.svg");
}

.cct-set__art--chrome {
  background-image: url("../images/set-art/chrome.svg");
}

.cct-set__art--beast {
  background-image: url("../images/set-art/beast.svg");
}

.cct-set__art--energy {
  background-image: url("../images/set-art/energy.svg");
}

.cct-set__art--flag {
  background-image: url("../images/set-art/flag.svg");
}

.cct-set__art--autograph {
  background-image: url("../images/set-art/autograph.svg");
}

.cct-set__art--relic {
  background-image: url("../images/set-art/relic.svg");
}

.cct-set__art--insert {
  background-image: url("../images/set-art/insert.svg");
}

.cct-set__eyebrow,
.cct-set__name,
.cct-set__subname,
.cct-set__meta {
  position: relative;
  z-index: 1;
}

.cct-set__eyebrow {
  align-self: start;
  color: rgba(247, 248, 255, 0.72);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.cct-set__name {
  align-self: end;
  color: var(--cct-text);
  font-size: clamp(27px, 2.2vw, 36px);
  font-weight: 900;
  letter-spacing: 0;
  line-height: 1;
  margin-top: auto;
}

.cct-set__subname {
  color: var(--cct-purple);
  font-size: 18px;
  font-weight: 700;
  margin-top: 10px;
}

.cct-set__meta {
  color: #dbe2f2;
  font-size: 13px;
  font-weight: 800;
  margin-top: 14px;
}

.cct-set--all .cct-set__summary {
  background:
    linear-gradient(180deg, rgba(3, 7, 16, 0.04), rgba(3, 7, 16, 0.9)),
    radial-gradient(circle at 35% 20%, rgba(182, 101, 255, 0.36), transparent 28%),
    radial-gradient(circle at 78% 30%, rgba(42, 124, 255, 0.18), transparent 22%),
    linear-gradient(135deg, rgba(53, 29, 105, 0.96), rgba(8, 14, 28, 0.96));
}

.cct-set--base .cct-set__summary {
  background:
    linear-gradient(180deg, rgba(3, 7, 16, 0.04), rgba(3, 7, 16, 0.9)),
    radial-gradient(circle at 68% 26%, rgba(92, 148, 255, 0.34), transparent 26%),
    linear-gradient(135deg, rgba(28, 62, 120, 0.96), rgba(8, 14, 28, 0.96));
}

.cct-set--8-bit-ballers .cct-set__summary {
  background:
    linear-gradient(180deg, rgba(3, 7, 16, 0.05), rgba(3, 7, 16, 0.92)),
    repeating-linear-gradient(90deg, rgba(174, 92, 255, 0.22) 0 8px, transparent 8px 18px),
    linear-gradient(135deg, rgba(46, 23, 96, 0.98), rgba(10, 12, 34, 0.98));
}

.cct-set--future-stars .cct-set__summary,
.cct-set--beast-mode .cct-set__summary,
.cct-set--ultra-beast-mode .cct-set__summary {
  background:
    linear-gradient(180deg, rgba(3, 7, 16, 0.04), rgba(3, 7, 16, 0.9)),
    radial-gradient(circle at 75% 16%, rgba(255, 222, 94, 0.24), transparent 24%),
    linear-gradient(135deg, rgba(92, 37, 133, 0.98), rgba(19, 14, 36, 0.98));
}

.cct-team-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fill, minmax(175px, 1fr));
  margin-top: 22px;
}

.cct-team-tile {
  align-items: center;
  aspect-ratio: 1 / 1.08;
  background:
    linear-gradient(180deg, rgba(8, 14, 29, 0.84), rgba(6, 10, 20, 0.98)),
    radial-gradient(circle at 50% 22%, rgba(182, 101, 255, 0.22), transparent 34%);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 8px;
  box-shadow: 0 20px 46px rgba(0, 0, 0, 0.28);
  color: var(--cct-text);
  display: grid;
  gap: 10px;
  justify-items: center;
  min-height: 190px;
  padding: 22px 16px;
  position: relative;
  text-align: center;
  text-decoration: none;
  overflow: hidden;
}

.cct-team-tile::before {
  background:
    linear-gradient(135deg, transparent 0 46%, rgba(255, 255, 255, 0.1) 47% 48%, transparent 49%),
    radial-gradient(circle at 50% 22%, rgba(255, 255, 255, 0.12), transparent 26%);
  content: "";
  inset: 0;
  position: absolute;
}

.cct-team-tile:hover,
.cct-team-tile:focus {
  border-color: rgba(194, 132, 255, 0.92);
  box-shadow: 0 26px 60px rgba(77, 32, 149, 0.34);
  outline: none;
}

.cct-team-tile__crest,
.cct-team-tile__name,
.cct-team-tile__meta {
  position: relative;
  z-index: 1;
}

.cct-team-tile__crest {
  align-items: center;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.92), rgba(181, 194, 221, 0.7)),
    radial-gradient(circle at 50% 30%, rgba(182, 101, 255, 0.28), transparent 44%);
  border: 2px solid rgba(255, 255, 255, 0.7);
  border-radius: 999px;
  box-shadow: inset 0 0 0 5px rgba(3, 7, 16, 0.28), 0 14px 36px rgba(0, 0, 0, 0.38);
  color: #07101f;
  display: inline-flex;
  font-size: 24px;
  font-weight: 900;
  height: 86px;
  justify-content: center;
  letter-spacing: 0;
  width: 86px;
}

.cct-team-tile__crest img {
  height: 62px;
  max-width: 66px;
  object-fit: contain;
  position: absolute;
  width: auto;
}

.cct-team-tile__crest img:not([hidden]) ~ .cct-team-tile__initials {
  display: none;
}

.cct-team-tile__name {
  font-size: 17px;
  font-weight: 900;
  line-height: 1.14;
}

.cct-team-tile__meta {
  color: var(--cct-muted);
  font-size: 13px;
  font-weight: 800;
}

.cct-back-link {
  margin: 24px 0 0;
}

.cct-back-link a {
  background: rgba(12, 19, 36, 0.86);
  border: 1px solid rgba(185, 196, 219, 0.18);
  border-radius: 8px;
  color: var(--cct-text);
  display: inline-flex;
  font-weight: 800;
  padding: 9px 12px;
  text-decoration: none;
}

.cct-back-link a:hover,
.cct-back-link a:focus {
  border-color: var(--cct-purple);
}

.cct-set[open] {
  grid-column: 1 / -1;
}

.cct-set[open] .cct-set__summary {
  min-height: 220px;
}

.cct-set__cards {
  background: rgba(6, 10, 20, 0.96);
  border-top: 1px solid rgba(185, 196, 219, 0.16);
  display: grid;
  gap: 12px;
  padding: 16px;
}

.cct-team,
.cct-card {
  background: rgba(12, 19, 34, 0.92);
  border: 1px solid rgba(185, 196, 219, 0.16);
  border-radius: 8px;
  overflow: hidden;
}

.cct-team__summary {
  align-items: center;
  color: var(--cct-text);
  cursor: pointer;
  display: flex;
  gap: 12px;
  padding: 13px 15px;
}

.cct-card summary {
  align-items: center;
  color: var(--cct-text);
  cursor: pointer;
  display: grid;
  gap: 14px;
  grid-template-columns: 34px minmax(58px, 82px) minmax(180px, 1fr) minmax(160px, 220px) 70px;
  padding: 13px 15px;
}

.cct-team__name,
.cct-card__subject {
  font-weight: 800;
}

.cct-team__meta {
  color: var(--cct-muted);
  font-weight: 700;
  margin-left: auto;
}

.cct-card__team,
.cct-card__progress {
  color: var(--cct-muted);
  font-weight: 700;
}

.cct-card__progress {
  justify-self: end;
}

.cct-team__cards,
.cct-variants {
  background: rgba(4, 8, 16, 0.72);
  border-top: 1px solid rgba(185, 196, 219, 0.14);
  display: grid;
}

.cct-team__cards {
  gap: 8px;
  padding: 10px;
}

.cct-card__number {
  color: #ffffff;
  font-weight: 900;
}

.cct-wishlist-button {
  align-items: center;
  background: rgba(247, 248, 255, 0.06);
  border: 1px solid rgba(185, 196, 219, 0.24);
  border-radius: 999px;
  color: rgba(185, 196, 219, 0.78);
  cursor: pointer;
  display: inline-flex;
  font-size: 16px;
  height: 28px;
  justify-content: center;
  line-height: 1;
  width: 28px;
}

.cct-wishlist-button:hover,
.cct-wishlist-button:focus,
.cct-wishlist-button.is-active {
  border-color: rgba(255, 214, 102, 0.78);
  color: #ffd666;
  outline: none;
}

.cct-wishlist-button--variant {
  font-size: 13px;
  height: 24px;
  margin-right: 8px;
  vertical-align: middle;
  width: 24px;
}

.cct-variant {
  align-items: center;
  color: var(--cct-text);
  display: flex;
  gap: 16px;
  padding: 11px 15px;
}

.cct-variant__name {
  flex: 1 1 auto;
}

.cct-trade-badge {
  background: rgba(91, 219, 179, 0.12);
  border: 1px solid rgba(91, 219, 179, 0.36);
  border-radius: 999px;
  color: #72e7c5;
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  padding: 7px 10px;
  text-transform: uppercase;
}

.cct-variant + .cct-variant {
  border-top: 1px solid rgba(185, 196, 219, 0.1);
}

.cct-variant.is-updating {
  opacity: 0.65;
}

.cct-qty {
  align-items: center;
  display: inline-flex;
  gap: 9px;
}

.cct-qty__button {
  background: rgba(247, 248, 255, 0.06);
  border: 1px solid rgba(185, 196, 219, 0.42);
  border-radius: 6px;
  color: var(--cct-text);
  cursor: pointer;
  height: 32px;
  line-height: 1;
  width: 32px;
}

.cct-qty__button:hover,
.cct-qty__button:focus {
  border-color: var(--cct-purple);
}

.cct-qty__value {
  color: #fff;
  font-weight: 900;
  min-width: 28px;
  text-align: center;
}

[data-progress] {
  white-space: nowrap;
}

.cct-is-hidden {
  display: none !important;
}

@media (max-width: 1100px) {
  .cct-set-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .cct-app-header {
    grid-template-columns: 170px 1fr;
  }

  .cct-profile-mark {
    display: none;
  }
}

@media (max-width: 760px) {
  .cct-collection {
    padding: 0 16px 42px;
  }

  .cct-app-header,
  .cct-toolbar {
    grid-template-columns: 1fr;
  }

  .cct-main-nav {
    gap: 18px;
    justify-content: flex-start;
    min-height: auto;
    overflow-x: auto;
    padding-bottom: 14px;
  }

  .cct-filter,
  .cct-set-grid,
  .cct-team-grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .cct-add-result {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .cct-add-result__tags {
    justify-content: flex-start;
  }

  .cct-dashboard-panels {
    grid-template-columns: 1fr;
  }

  .cct-dashboard-maintenance {
    align-items: flex-start;
    grid-template-columns: 1fr;
  }

  .cct-trade-list__toolbar,
  .cct-trade-filters,
  .cct-trade-item,
  .cct-wishlist-item,
  .cct-trade-match,
  .cct-trade-deal__item,
  .cct-trade-receipt__meta,
  .cct-trade-receipt__grid {
    grid-template-columns: 1fr;
  }

  .cct-trade-item__qty,
  .cct-wishlist-status,
  .cct-trade-item__qty {
    justify-self: start;
  }

  .cct-trade-submit,
  .cct-trade-deal__actions {
    flex-wrap: wrap;
    justify-content: flex-start;
  }

  .cct-filter__button {
    border-right: 0;
    border-bottom: 1px solid rgba(185, 196, 219, 0.16);
  }

  .cct-filter__button:last-child {
    border-bottom: 0;
  }

  .cct-collection__header h2 {
    font-size: 36px;
  }

  .cct-set__summary {
    min-height: 350px;
  }

  .cct-team__summary,
  .cct-variant {
    align-items: flex-start;
    flex-direction: column;
  }

  .cct-card summary {
    align-items: flex-start;
    grid-template-columns: 34px 1fr;
  }

  .cct-card__subject,
  .cct-card__team,
  .cct-card__progress {
    grid-column: 2;
  }

  .cct-card__progress {
    justify-self: start;
  }

  .cct-team__meta {
    margin-left: 0;
  }
}