:root{
  --tf-navy:#0D1B2A;
  --tf-orange:#E56F2D;
  --tf-brand:var(--tf-orange);
  --tf-brand-hover:#cc5d21;
  --tf-brand-soft:#FFF3EC;
  --tf-clay-status:#FFE8D9;
  --tf-neutral:#F2F4F7;
  --tf-neutral-border:#A7B0BC;
  --tf-danger:#A63D40;
  --tf-danger-hover:#873134;
  --tf-danger-soft:#FBEDEE;
  --tf-success:#6F9665;
  --tf-success-soft:#F0F5EE;
  --tf-ink:var(--tf-navy);
  --tf-focus:rgba(229,111,45,.24);
  --navy:var(--tf-navy);
  --yellow:var(--tf-clay-status);
  --red:var(--tf-danger-soft);
}

button.primary,
button:not(.ghost):not(.danger):not(.ticker-btn)[type="submit"]{
  background:var(--tf-brand);
  border-color:var(--tf-brand);
}
button.primary:hover,
button:not(.ghost):not(.danger):not(.ticker-btn)[type="submit"]:hover{
  background:var(--tf-brand-hover);
  border-color:var(--tf-brand-hover);
}
button.danger{
  background:var(--tf-danger);
  border-color:var(--tf-danger);
  color:#fff;
}
button.danger:hover{
  background:var(--tf-danger-hover);
  border-color:var(--tf-danger-hover);
  color:#fff;
}
button.primary:focus-visible,
button.ghost:focus-visible,
button.danger:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible{
  outline:3px solid var(--tf-focus);
  outline-offset:2px;
}
button[data-cid].primary,
[aria-current="true"].primary{
  box-shadow:0 0 0 1px rgba(229,111,45,.08);
}

.badge.player{
  background:var(--tf-clay-status);
  color:var(--tf-navy);
}
.badge.reject{
  background:var(--tf-danger-soft);
  color:var(--tf-danger);
}
.badge.official{
  border-color:rgba(13,27,42,.18);
}
.notice{
  background:var(--tf-brand-soft);
  border-color:#F1C4A9;
  color:var(--tf-navy);
}
.error{
  background:var(--tf-danger-soft);
  border-color:#D9A1A3;
  color:var(--tf-danger);
}
.success{
  background:var(--tf-success-soft);
  border-color:#BCD0B7;
  color:#486A40;
}
.queue-match{
  background:var(--tf-brand-soft);
  border-color:#F1C4A9;
}
.queue-match.selected{
  outline-color:var(--tf-orange);
  background:var(--tf-clay-status);
}

.tf-brand-icon{
  width:1.35em;
  height:1.35em;
  margin-right:.38em;
  vertical-align:-.28em;
  border-radius:.18em;
}
::selection{background:var(--tf-brand-soft);color:var(--tf-ink)}