/* Mana symbol font CSS (mana-font project), trimmed 2026-07 to the classes
 * the site's mana renderers (public/scripts/mana.js and
 * src/lib/decklist-prerender.mjs) can emit, plus the ms / ms-cost
 * machinery: w u b r g c, 0-20, 100, x y z, tap, untap, e (energy),
 * s (snow), p (Phyrexian), chaos, infinity, half, the ten hybrid pairs,
 * 2-brids (2w..2g), colorless hybrids (cw..cg) and color Phyrexian
 * (wp..gp). The dead MPlantin @font-face (its files never shipped) and
 * the unused symbol sets (loyalty, saga, defense, level, abilities,
 * watermarks, guilds, ci, dfc, split, duo, size and shadow modifiers)
 * are removed. /fonts/mana.woff2 and mana.woff are subset to the same
 * codepoints; the full originals live at /fonts/mana-full.woff2/.woff. */

@font-face {
  font-family: "Mana";
  src: url("/fonts/mana.woff2") format("woff2"),
       url("/fonts/mana.woff") format("woff");
  font-weight: normal; font-style: normal; font-display: swap;
}

.ms {
  display: inline-block;
  font: normal normal normal 14px Mana;
  font-size: inherit;
  line-height: 1em;
  text-rendering: auto;
  transform: translate(0, 0);
  speak: none;
  text-transform: none;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  --ms-mana-b: #a7999e;
  --ms-mana-c: #d0c6bb;
  --ms-mana-g: #9fcba6;
  --ms-mana-r: #f19b79;
  --ms-mana-u: #bcdaf7;
  --ms-mana-w: #fdfbce;
}

.ms-w::before {
  content: "\e600";
}

.ms-u::before {
  content: "\e601";
}

.ms-b::before {
  content: "\e602";
}

.ms-r::before {
  content: "\e603";
}

.ms-g::before {
  content: "\e604";
}

.ms-0::before {
  content: "\e605";
}

.ms-1::before {
  content: "\e606";
}

.ms-2 {
  margin-left: inherit !important;
}

.ms-2::before {
  content: "\e607";
}

.ms-3::before {
  content: "\e608";
}

.ms-4::before {
  content: "\e609";
}

.ms-5::before {
  content: "\e60a";
}

.ms-6::before {
  content: "\e60b";
}

.ms-7::before {
  content: "\e60c";
}

.ms-8::before {
  content: "\e60d";
}

.ms-9::before {
  content: "\e60e";
}

.ms-10::before {
  content: "\e60f";
}

.ms-11::before {
  content: "\e610";
}

.ms-12::before {
  content: "\e611";
}

.ms-13::before {
  content: "\e612";
}

.ms-14::before {
  content: "\e613";
}

.ms-15::before {
  content: "\e614";
}

.ms-16::before {
  content: "\e62a";
}

.ms-17::before {
  content: "\e62b";
}

.ms-18::before {
  content: "\e62c";
}

.ms-19::before {
  content: "\e62d";
}

.ms-20::before {
  content: "\e62e";
}

.ms-x::before {
  content: "\e615";
}

.ms-y::before {
  content: "\e616";
}

.ms-z::before {
  content: "\e617";
}

.ms-s::before {
  content: "\e619";
}

.ms-c::before {
  content: "\e904";
}

.ms-e::before {
  content: "\e907";
}

.ms-infinity::before {
  content: "\e903";
}

.ms-p::before {
  content: "\e618";
}

.ms-tap::before {
  content: "\e61a";
}

.ms-untap::before {
  content: "\e61b";
}

.ms-chaos::before {
  content: "\e61d";
}

.ms-wu::before, .ms-wb::before, .ms-rw::after, .ms-gw::after, .ms-2w::after, .ms-cw::after {
  content: "\e600";
}

.ms-ub::before, .ms-ur::before, .ms-wu::after, .ms-gu::after, .ms-2u::after, .ms-cu::after {
  content: "\e601";
}

.ms-br::before, .ms-bg::before, .ms-wb::after, .ms-ub::after, .ms-2b::after, .ms-cb::after {
  content: "\e602";
}

.ms-rw::before, .ms-rg::before, .ms-ur::after, .ms-br::after, .ms-2r::after, .ms-cr::after {
  content: "\e603";
}

.ms-gw::before, .ms-gu::before, .ms-bg::after, .ms-rg::after, .ms-2g::after, .ms-cg::after {
  content: "\e604";
}

.ms-2w::before, .ms-2u::before, .ms-2b::before, .ms-2r::before, .ms-2g::before {
  content: "\e607";
}

.ms-cw::before, .ms-cu::before, .ms-cb::before, .ms-cr::before, .ms-cg::before {
  content: "\e904";
}

.ms-wp::before, .ms-up::before, .ms-bp::before, .ms-rp::before, .ms-gp::before {
  content: "\e618";
}

.ms-100::before {
  content: "\e900";
}

.ms-cost {
  background-color: #beb9b2;
  border-radius: 1em;
  color: #111;
  font-size: 0.95em;
  width: 1.3em;
  height: 1.3em;
  line-height: 1.35em;
  text-align: center;
}

.ms-cost.ms-w, .ms-cost.ms-wp {
  background-color: #f0f2c0;
}

.ms-cost.ms-u, .ms-cost.ms-up {
  background-color: #b5cde3;
}

.ms-cost.ms-b, .ms-cost.ms-bp {
  background-color: #aca29a;
}

.ms-cost.ms-r, .ms-cost.ms-rp {
  background-color: #db8664;
}

.ms-cost.ms-g, .ms-cost.ms-gp {
  background-color: #93b483;
}

.ms-cost.ms-wu, .ms-cost.ms-wb, .ms-cost.ms-ub, .ms-cost.ms-ur, .ms-cost.ms-br, .ms-cost.ms-bg, .ms-cost.ms-rw, .ms-cost.ms-rg, .ms-cost.ms-gw, .ms-cost.ms-gu, .ms-cost.ms-2w, .ms-cost.ms-2u, .ms-cost.ms-2b, .ms-cost.ms-2r, .ms-cost.ms-2g, .ms-cost.ms-cw, .ms-cost.ms-cu, .ms-cost.ms-cb, .ms-cost.ms-cr, .ms-cost.ms-cg {
  --ms-split-top: var(--ms-mana-c);
  --ms-split-bottom: var(--ms-mana-u);
  background: var(--ms-split-top);
  background: -moz-linear-gradient(135deg, var(--ms-split-top) 0%, var(--ms-split-top) 50%, var(--ms-split-bottom) 50%, var(--ms-split-bottom) 100%);
  background: -webkit-linear-gradient(135deg, var(--ms-split-top) 0%, var(--ms-split-top) 50%, var(--ms-split-bottom) 50%, var(--ms-split-bottom) 100%);
  background: linear-gradient(135deg, var(--ms-split-top) 0%, var(--ms-split-top) 50%, var(--ms-split-bottom) 50%, var(--ms-split-bottom) 100%);
  position: relative;
  width: 1.3em;
  height: 1.3em;
}

.ms-cost.ms-wu::before, .ms-cost.ms-wu::after, .ms-cost.ms-wb::before, .ms-cost.ms-wb::after, .ms-cost.ms-ub::before, .ms-cost.ms-ub::after, .ms-cost.ms-ur::before, .ms-cost.ms-ur::after, .ms-cost.ms-br::before, .ms-cost.ms-br::after, .ms-cost.ms-bg::before, .ms-cost.ms-bg::after, .ms-cost.ms-rw::before, .ms-cost.ms-rw::after, .ms-cost.ms-rg::before, .ms-cost.ms-rg::after, .ms-cost.ms-gw::before, .ms-cost.ms-gw::after, .ms-cost.ms-gu::before, .ms-cost.ms-gu::after, .ms-cost.ms-2w::before, .ms-cost.ms-2w::after, .ms-cost.ms-2u::before, .ms-cost.ms-2u::after, .ms-cost.ms-2b::before, .ms-cost.ms-2b::after, .ms-cost.ms-2r::before, .ms-cost.ms-2r::after, .ms-cost.ms-2g::before, .ms-cost.ms-2g::after, .ms-cost.ms-cw::before, .ms-cost.ms-cw::after, .ms-cost.ms-cu::before, .ms-cost.ms-cu::after, .ms-cost.ms-cb::before, .ms-cost.ms-cb::after, .ms-cost.ms-cr::before, .ms-cost.ms-cr::after, .ms-cost.ms-cg::before, .ms-cost.ms-cg::after {
  font-size: 0.55em !important;
  position: absolute;
}

.ms-cost.ms-wu::before, .ms-cost.ms-wb::before, .ms-cost.ms-ub::before, .ms-cost.ms-ur::before, .ms-cost.ms-br::before, .ms-cost.ms-bg::before, .ms-cost.ms-rw::before, .ms-cost.ms-rg::before, .ms-cost.ms-gw::before, .ms-cost.ms-gu::before, .ms-cost.ms-2w::before, .ms-cost.ms-2u::before, .ms-cost.ms-2b::before, .ms-cost.ms-2r::before, .ms-cost.ms-2g::before, .ms-cost.ms-cw::before, .ms-cost.ms-cu::before, .ms-cost.ms-cb::before, .ms-cost.ms-cr::before, .ms-cost.ms-cg::before {
  top: -0.38em;
  left: 0.28em;
}

.ms-cost.ms-wu::after, .ms-cost.ms-wb::after, .ms-cost.ms-ub::after, .ms-cost.ms-ur::after, .ms-cost.ms-br::after, .ms-cost.ms-bg::after, .ms-cost.ms-rw::after, .ms-cost.ms-rg::after, .ms-cost.ms-gw::after, .ms-cost.ms-gu::after, .ms-cost.ms-2w::after, .ms-cost.ms-2u::after, .ms-cost.ms-2b::after, .ms-cost.ms-2r::after, .ms-cost.ms-2g::after, .ms-cost.ms-cw::after, .ms-cost.ms-cu::after, .ms-cost.ms-cb::after, .ms-cost.ms-cr::after, .ms-cost.ms-cg::after {
  top: 0.5em;
  left: 1em;
}

.ms-cost.ms-wu {
  --ms-split-top: var(--ms-mana-w);
}

.ms-cost.ms-wb {
  --ms-split-top: var(--ms-mana-w);
  --ms-split-bottom: var(--ms-mana-b);
}

.ms-cost.ms-ub {
  --ms-split-top: var(--ms-mana-u);
  --ms-split-bottom: var(--ms-mana-b);
}

.ms-cost.ms-ur {
  --ms-split-top: var(--ms-mana-u);
  --ms-split-bottom: var(--ms-mana-r);
}

.ms-cost.ms-br {
  --ms-split-top: var(--ms-mana-b);
  --ms-split-bottom: var(--ms-mana-r);
}

.ms-cost.ms-bg {
  --ms-split-top: var(--ms-mana-b);
  --ms-split-bottom: var(--ms-mana-g);
}

.ms-cost.ms-rw {
  --ms-split-top: var(--ms-mana-r);
  --ms-split-bottom: var(--ms-mana-w);
}

.ms-cost.ms-rg {
  --ms-split-top: var(--ms-mana-r);
  --ms-split-bottom: var(--ms-mana-g);
}

.ms-cost.ms-gw {
  --ms-split-top: var(--ms-mana-g);
  --ms-split-bottom: var(--ms-mana-w);
}

.ms-cost.ms-gu {
  --ms-split-top: var(--ms-mana-g);
}

.ms-cost.ms-2w, .ms-cost.ms-cw {
  --ms-split-bottom: var(--ms-mana-w);
}

.ms-cost.ms-2b, .ms-cost.ms-cb {
  --ms-split-bottom: var(--ms-mana-b);
}

.ms-cost.ms-2r, .ms-cost.ms-cr {
  --ms-split-bottom: var(--ms-mana-r);
}

.ms-cost.ms-2g, .ms-cost.ms-cg {
  --ms-split-bottom: var(--ms-mana-g);
}

.ms-cost.ms-p::before {
  display: inline-block;
  -moz-transform: scale(1.2, 1.2);
  -webkit-transform: scale(1.2, 1.2);
  transform: scale(1.2, 1.2);
}

.ms-cost.ms-wp::before, .ms-cost.ms-up::before, .ms-cost.ms-bp::before, .ms-cost.ms-rp::before, .ms-cost.ms-gp::before, .ms-cost.ms-cw::before, .ms-cost.ms-cu::before, .ms-cost.ms-cb::before, .ms-cost.ms-cr::before, .ms-cost.ms-cg::before {
  display: inline-block;
  transform: scale(1.2) translateX(0.01rem) translateY(-0.03rem);
}

.ms-cost.ms-s::before {
  color: #fff;
  -webkit-text-stroke: 2px #fff;
  font-size: 0.85em;
  top: -0.05em;
  position: relative;
  display: inline-block;
}

.ms-cost.ms-s::after {
  content: "\e619";
  position: absolute;
  color: #333;
  margin-left: -0.9em;
  font-size: 1.1em;
}

.ms-cost.ms-untap {
  background-color: #111;
  color: #fff;
}

span.ms-half {
  width: 0.675em;
  overflow: hidden;
  display: inline-block;
  margin-left: 0.675em;
}

span.ms-half > .ms-cost {
  margin-left: -0.675em;
}

.ms-half {
  width: 0.675em;
  margin-left: 0.675em;
  overflow: hidden;
  border-radius: 0 1em 1em 0;
}

.ms-half::before {
  margin-left: -0.65em;
}

.ms-100 {
  width: 2.4em;
}
