/* Official v0.3.2 increment merged with this server visual rules; GPL-3.0-or-later. */
.brief__bg {
  position: absolute;
  inset: 0px;
  z-index: 0;
  pointer-events: none;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.02) 0px, rgba(255, 255, 255, 0.02) 1px, transparent 1px, transparent 4px), radial-gradient(60% 50% at 8% 6%, rgba(160, 166, 170, 0.12), transparent 70%), radial-gradient(40% 30% at 96% 4%, rgba(63, 230, 180, 0.16), transparent 70%), radial-gradient(70% 60% at 90% 100%, rgba(120, 128, 132, 0.08), transparent 70%), linear-gradient(rgb(12, 14, 14), rgb(9, 10, 10));
}

.stephead {
  position: relative;
  z-index: 3;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.3rem;
  height: 1.3rem;
  padding: 0px 0.5rem 0px 0.38rem;
  background: linear-gradient(rgba(5, 7, 7, 0.92), rgba(5, 7, 7, 0));
}

.stephead__left {
  display: flex;
  align-items: center;
  gap: 0.26rem;
  min-width: 0px;
}

.stephead__exit {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.03rem;
  flex: 0 0 auto;
}

.stephead__exit .btn--danger {
  --sq: .66rem;
  height: 0.66rem;
  --btn-bg: #d9dcdc;
  --btn-bg-hover: #f1f3f3;
  --btn-fg: #1a1d1e;
  --btn-bd: #f4f6f6;
  --btn-bd-hover: #fff;
  --btn-glow: rgba(255, 255, 255, .3);
  --bk-c: #fff;
  background-image: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 60%);
  box-shadow: rgba(0, 0, 0, 0.6) 0px 0.04rem 0.1rem;
}

.stephead__exit .ping {
  font-size: calc(.15 * var(--t));
}

.stephead__exit .ping__icon {
  display: none;
}

.stephead__mode {
  display: flex;
  align-items: center;
  gap: 0.14rem;
  flex: 0 0 auto;
}

.stephead__mode .dtag {
  font-size: calc(.26 * var(--t));
  gap: 0.08rem;
}

.stephead__mode .dtag__icon {
  width: 0.34rem;
  height: 0.34rem;
}

.stephead__mode.has-extra {
  height: 0.52rem;
  padding: 0px 0.1rem 0px 0.16rem;
  border-radius: 0.26rem;
  background: rgba(60, 64, 66, 0.55);
  box-shadow: rgba(255, 255, 255, 0.06) 0px 0px 0px 1px inset;
}

.stephead__info {
  display: inline-flex;
  align-items: center;
  gap: 0.05rem;
  height: 0.4rem;
  padding: 0px 0.12rem;
  border-radius: 0.2rem;
  font-size: calc(.2 * var(--t));
  font-weight: 700;
  color: var(--text-hi);
  transition: background var(--t-fast);
}

.stephead__info:hover {
  background: rgba(255, 255, 255, 0.1);
}

.stephead__info .icon {
  width: 0.26rem;
  height: 0.26rem;
}

.stephead__sep {
  flex: 0 0 auto;
  width: 1px;
  height: 0.5rem;
  background: linear-gradient(transparent, rgba(255, 255, 255, 0.28), transparent);
}

.stephead__title {
  display: flex;
  align-items: baseline;
  gap: 0.02rem;
  margin: 0px;
  font-size: calc(.32 * var(--t));
  font-weight: 900;
  letter-spacing: 0.06em;
  white-space: nowrap;
}

.stephead__title b {
  font-size: calc(.54 * var(--t));
  line-height: 1;
  color: var(--mint-400);
  text-shadow: rgba(23, 249, 183, 0.35) 0px 0px 0.16rem;
}

.stephead__of {
  font-size: calc(.34 * var(--t));
  color: var(--text-lo);
  margin-right: 0.16rem;
}

.stephead__micro {
  align-self: flex-end;
  margin-bottom: 0.22rem;
  opacity: 0.35;
  white-space: nowrap;
  overflow: hidden;
}

.draft .stephead__micro {
  display: none;
}

.stephead__right {
  display: flex;
  align-items: center;
  gap: 0.24rem;
  min-width: 0px;
}

.stephead__right .countdown {
  --cd-h: .74rem;
}

.stephead__status {
  min-width: 0px;
}

.brief-h {
  display: flex;
  align-items: baseline;
  gap: 0.12rem;
  font-size: calc(.21 * var(--t));
  font-weight: 700;
  letter-spacing: 0.1em;
  margin-bottom: 0.12rem;
}

.brief-h::before {
  content: "";
  width: 0.06rem;
  height: 0.2rem;
  background: var(--mint-500);
  align-self: center;
}

.brief__modmark {
  position: relative;
  z-index: 2;
  align-self: flex-start;
  margin: 0.06rem 0.5rem 0px;
}

.brief-bonds {
  padding: 0.16rem 0.2rem 0.2rem;
  background: rgba(12, 15, 14, 0.8);
  border: 1px solid var(--line);
}

.brief-bonds__row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.16rem 0.1rem;
}

.brief-bond {
  position: relative;
  min-width: 1rem;
  width: max-content;
  max-width: 100%;
  display: flex;
  justify-content: center;
}

.brief-bond .bond {
  --disc: .66rem;
  max-width: 100%;
}

.brief-bond .bond__name {
  font-size: calc(.16 * var(--t));
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: center;
}

.brief-bond__ban {
  position: absolute;
  top: -0.04rem;
  right: 0.08rem;
  display: inline-flex;
  align-items: center;
  gap: 0.01rem;
  font-size: calc(.12 * var(--t));
  font-weight: 700;
  padding: 0px 0.05rem;
  background: var(--red);
  color: rgb(255, 255, 255);
  line-height: 1.5;
  box-shadow: rgb(0, 0, 0) 0px 0px 0px 1px;
}

.brief-bond__ban .icon {
  width: 0.12rem;
  height: 0.12rem;
}

.brief-bond.is-partial .bond__core {
  box-shadow: rgba(255, 84, 84, 0.5) 0px 0px 0px 2px;
}

.brief-bantip {
  display: flex;
  flex-direction: column;
  gap: 0.06rem;
}

.brief-bantip__h {
  font-size: calc(.12 * var(--t));
  font-weight: 700;
  letter-spacing: 0.06em;
  color: var(--red);
}

.brief-bantip__op {
  display: flex;
  align-items: center;
  gap: 0.08rem;
}

.brief-bantip__op .uthumb {
  flex: 0 0 auto;
}

.brief-bantip__txt {
  display: flex;
  flex-direction: column;
  min-width: 0px;
  line-height: 1.3;
}

.brief-bantip__txt b {
  font-size: calc(.14 * var(--t));
  color: var(--text-hi);
}

.brief-bantip__txt > span {
  font-size: calc(.12 * var(--t));
  color: var(--text-lo);
}

.brief-bantip__txt .is-this {
  color: var(--mint-400);
}

.brief-legend {
  display: flex;
  align-items: center;
  gap: 0.08rem;
  flex-wrap: wrap;
  font-size: calc(.14 * var(--t));
  color: var(--text-dim);
  margin-top: -0.06rem;
}

.brief-legend__off {
  width: 0.16rem;
  height: 0.16rem;
  border-radius: 50%;
  background: rgb(58, 64, 61);
  border: 2px solid rgb(85, 85, 85);
}

.brief-legend__ban {
  display: inline-grid;
  place-items: center;
  width: 0.2rem;
  height: 0.18rem;
  background: var(--red);
  color: rgb(255, 255, 255);
}

.brief-legend__ban .icon {
  width: 0.12rem;
  height: 0.12rem;
}

.brief-banned {
  padding: 0.16rem 0.2rem 0.2rem;
  background: rgba(12, 15, 14, 0.8);
  border: 1px solid var(--line);
}

.brief-banned__n {
  margin-left: auto;
  font-size: calc(.22 * var(--t));
  color: var(--red-premium);
}

.brief-banned__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(0.6rem, 1fr));
  gap: 0.08rem;
}

.brief-banned__grid .uthumb {
  --ut: .6rem;
}

.brief-banned__diy {
  margin: 0.1rem 0px 0px;
  font-size: calc(.14 * var(--t));
  line-height: 1.5;
  color: var(--text-dim, #b8c2bf);
}

.diybanned__tag {
  display: inline-block;
  margin-right: 0.06rem;
  padding: 0.01rem 0.06rem;
  font-size: calc(.12 * var(--t));
  font-weight: 700;
  letter-spacing: 0.08em;
  background: var(--mint-500);
  color: var(--text-on-mint);
  vertical-align: 0.01rem;
}

.brief__main {
  position: relative;
  z-index: 1;
  flex: 1 1 0%;
  min-height: 0px;
  overflow: auto;
  overscroll-behavior: contain;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  padding: 0.06rem 0.5rem 1.5rem 0.56rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.28) transparent;
}

.brief-sec {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  background: linear-gradient(rgba(30, 33, 34, 0.55), rgba(14, 16, 16, 0.35));
}

.brief-sec > .brief-bonds, .brief-sec > .brief-banned {
  padding: 0px;
  background: none;
  border: 0px;
}

.brief .brief-h {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.14rem;
  margin: 0px;
  height: 0.66rem;
  padding: 0px 0.3rem 0px 0.22rem;
  font-size: calc(.32 * var(--t));
  font-weight: 700;
  letter-spacing: 0.06em;
  color: rgb(242, 244, 244);
  background: linear-gradient(90deg, rgba(122, 126, 128, 0.5), rgba(92, 96, 98, 0.42) 60%, rgba(80, 84, 86, 0.36));
  min-height: 0.66rem;
}

.brief .brief-h::before {
  content: "";
  flex: 0 0 auto;
  width: 0.44rem;
  height: 0.44rem;
  background: rgb(233, 236, 236);
  align-self: center;
  mask: var(--sec-icon) center / contain no-repeat;
}

.brief .brief-h .micro {
  margin-left: auto;
  padding-left: 0.5rem;
  opacity: 0.4;
  letter-spacing: 0.14em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.brief .brief-h .micro::before {
  content: "";
  display: inline-block;
  width: 0.2rem;
  height: 0.2rem;
  margin-right: 0.08rem;
  vertical-align: -0.04rem;
  border: 2px solid;
  box-shadow: transparent 0.3rem 0px 0px 0px;
}

.brief .brief-banned__n {
  margin-left: 0.2rem;
  font-size: calc(.3 * var(--t));
}

.brief-sec--enemy {
  --sec-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11 1h2v3.2l3-1.7 1 1.7-3 1.8 4.6 2.7-1 1.7-4.6-2.6v2.4h3V22H8V10.2h3V7.8L6.4 10.4l-1-1.7L10 6 7 4.2l1-1.7 3 1.7z'/%3E%3C/svg%3E");
}

.brief-sec--core {
  --sec-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1l1.6 7.2L19.8 4l-4.2 6.2L23 12l-7.4 1.8 4.2 6.2-6.2-4.2L12 23l-1.6-7.2L4.2 20l4.2-6.2L1 12l7.4-1.8L4.2 4l6.2 4.2z'/%3E%3C/svg%3E");
}

.brief-sec--addon {
  --sec-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M1 6l22-3-7 18-4-7-5 4 1-6zm6 3.6 6.3 2.8L19.5 5.6z'/%3E%3C/svg%3E");
}

.brief-sec--banned {
  --sec-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 2a3.2 3.2 0 1 1 0 6.4A3.2 3.2 0 0 1 9 2zM3 22v-6a6 6 0 0 1 10.4-4.1L12 13.3A4 4 0 0 0 5 16v6zm11.1-6.3 1.4-1.4 2.5 2.5 2.5-2.5 1.4 1.4-2.5 2.5 2.5 2.5-1.4 1.4-2.5-2.5-2.5 2.5-1.4-1.4 2.5-2.5z'/%3E%3C/svg%3E");
}

.brief-enemy {
  display: grid;
  grid-template-columns: auto minmax(0px, 1fr) auto;
  align-items: center;
  gap: 0.3rem 0.4rem;
  padding: 0.3rem 0.4rem 0.34rem 0.6rem;
}

.brief-boss {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.brief-boss__art {
  position: relative;
  width: 2.3rem;
  height: 2.3rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: radial-gradient(circle at 50% 40%, rgb(107, 52, 32), rgb(42, 18, 11) 75%);
  box-shadow: rgb(74, 78, 80) 0px 0px 0px 0.04rem, rgb(26, 28, 29) 0px 0px 0px 0.06rem, rgba(0, 0, 0, 0.6) 0px 0.06rem 0.2rem;
}

.brief-boss__art::before, .brief-boss__art::after {
  content: "";
  position: absolute;
  width: 0.5rem;
  height: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.25);
  pointer-events: none;
}

.brief-boss__art::before {
  left: -0.26rem;
  top: -0.26rem;
  border-width: 0px 1px 1px 0px;
}

.brief-boss__art::after {
  right: -0.26rem;
  bottom: -0.26rem;
  border-width: 1px 0px 0px 1px;
}

.brief-boss__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.brief-boss__q {
  font-size: 1rem;
  font-weight: 900;
  color: rgba(255, 140, 70, 0.6);
}

.brief-boss__tag {
  margin-top: -0.02rem;
  width: 2.05rem;
  padding: 0.03rem 0px;
  text-align: center;
  font-size: calc(.2 * var(--t));
  font-weight: 700;
  letter-spacing: 0.14em;
  color: rgb(255, 207, 74);
  background: linear-gradient(rgb(90, 66, 16), rgb(58, 42, 8));
  box-shadow: rgba(255, 207, 74, 0.25) 0px 0px 0px 1px inset;
}

.brief-boss__text {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  min-width: 0px;
}

.brief-boss__name {
  margin: 0px;
  font-size: calc(.36 * var(--t));
  font-weight: 900;
  letter-spacing: 0.04em;
  line-height: 1.25;
}

.brief-boss__when {
  font-size: calc(.17 * var(--t));
  color: var(--orange-hi);
}

.brief-boss__abil {
  margin: 0.02rem 0px 0px;
  padding-left: 0.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.04rem;
  font-size: calc(.18 * var(--t));
  line-height: 1.55;
  color: rgb(169, 174, 176);
}

.brief-stage {
  display: inline-flex;
  align-items: center;
  gap: 0.08rem;
  margin-top: 0.04rem;
  font-size: calc(.16 * var(--t));
  color: var(--text-lo);
}

.brief-stage .icon {
  width: 0.2rem;
  height: 0.2rem;
  color: var(--mint-500);
}

.brief-stage b {
  color: var(--text-hi);
}

.brief-stage__pool {
  color: var(--text-dim);
}

.brief-factions {
  display: flex;
  align-items: flex-start;
  gap: 0.3rem;
  padding-right: 0.3rem;
}

.brief-faction {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.14rem;
  width: 1.9rem;
  outline: none;
}

.brief-faction__icon {
  width: 1.12rem;
  height: 1.12rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 45%, rgb(42, 58, 56), rgb(18, 24, 23) 70%);
  box-shadow: rgba(140, 255, 225, 0.14) 0px 0px 0.22rem, rgba(0, 0, 0, 0.7) 0px 0px 0.16rem inset;
}

.brief-faction__icon img {
  width: 78%;
  height: 78%;
  object-fit: contain;
  filter: grayscale(1) brightness(1.6) drop-shadow(rgba(160, 255, 230, 0.6) 0px 0px 0.06rem);
}

.brief-faction__name {
  font-size: calc(.22 * var(--t));
  font-weight: 700;
  color: rgb(230, 234, 234);
  text-align: center;
  white-space: nowrap;
}

.brief-faction:focus-visible .brief-faction__icon {
  box-shadow: 0 0 0 2px var(--mint-400);
}

.brief .brief-bonds__row {
  gap: 0.24rem 0.3rem;
  padding: 0.32rem 0.4rem 0.3rem 0.78rem;
}

.brief .brief-bond {
  min-width: 1.3rem;
}

.brief .brief-bond .bond {
  --disc: 1.1rem;
}

.brief .brief-bond .bond__name {
  font-size: calc(.22 * var(--t));
  color: rgb(214, 218, 218);
}

.brief .brief-bond__ban {
  font-size: calc(.14 * var(--t));
  right: 0.1rem;
}

.brief .brief-legend {
  margin: -0.1rem 0.4rem 0.22rem 0.78rem;
  font-size: calc(.16 * var(--t));
}

.brief .brief-banned__grid {
  grid-template-columns: repeat(auto-fill, minmax(1.2rem, 1fr));
  gap: 0.14rem;
  padding: 0.28rem 0.4rem 0.3rem 0.78rem;
}

.brief .brief-banned__grid .uthumb {
  --ut: 1.2rem;
}

.brief .brief-banned > .t-dim, .brief .brief-banned__diy {
  margin: 0.2rem 0.4rem 0.26rem 0.78rem;
}

.brief__foot {
  position: absolute;
  z-index: 2;
  right: 0px;
  bottom: 0px;
  left: 0px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.36rem;
  padding: 0.3rem 0.4rem 0.26rem;
  pointer-events: none;
  background: linear-gradient(transparent, rgba(6, 8, 8, 0.78) 45%, rgba(6, 8, 8, 0.92));
}

.brief__foot > * {
  pointer-events: auto;
}

.brief-ready {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.06rem;
}

.brief-ready__txt {
  display: flex;
  align-items: baseline;
  gap: 0.06rem;
  font-size: calc(.24 * var(--t));
  color: rgb(230, 234, 234);
}

.brief-ready__txt b {
  margin-left: 0.08rem;
  font-size: calc(.5 * var(--t));
  line-height: 1;
  color: var(--mint-400);
  text-shadow: rgba(23, 249, 183, 0.4) 0px 0px 0.12rem;
}

.brief-ready__txt span {
  font-size: calc(.34 * var(--t));
  color: rgb(214, 218, 218);
}

.brief-ready__pips {
  position: relative;
  display: flex;
  gap: 0.04rem;
  padding: 0px 0.1rem;
}

.brief-ready__pips::before, .brief-ready__pips::after {
  content: "";
  position: absolute;
  top: -0.02rem;
  bottom: -0.02rem;
  width: 0.07rem;
  border: 2px solid rgba(255, 255, 255, 0.3);
}

.brief-ready__pips::before {
  left: 0px;
  border-right: 0px;
}

.brief-ready__pips::after {
  right: 0px;
  border-left: 0px;
}

.brief-ready__pips i {
  width: 0.34rem;
  height: 0.4rem;
  display: grid;
  place-items: center;
  color: rgb(76, 81, 82);
  transition: color var(--t-med), filter var(--t-med);
}

.brief-ready__pips i .icon {
  width: 100%;
  height: 100%;
}

.brief-ready__pips i.on {
  color: var(--mint-400);
  filter: drop-shadow(rgba(23, 249, 183, 0.6) 0px 0px 0.06rem);
  animation: brief-pip .5s var(--tr-ease, ease-out);
}

@keyframes brief-pip {
  0% {
    transform: translateY(-0.08rem) scale(1.3);
    filter: brightness(2.2);
  }
}

.brief-go.btn--xl {
  height: 0.98rem;
  min-width: 3.9rem;
  padding: 0px 0.5rem 0px 0.3rem;
  justify-content: flex-start;
  font-size: calc(.38 * var(--t));
  letter-spacing: 0.08em;
  --btn-bg: #33d6a5;
  --btn-bg-hover: #4ee6b8;
  box-shadow: rgba(255, 255, 255, 0.85) 0px 0px 0px 0.03rem, rgba(0, 0, 0, 0.55) 0px 0.06rem 0.2rem;
}

.brief-go .btn__icon {
  width: 0.44rem;
  height: 0.44rem;
}

.brief-go.is-active, .brief-go:disabled {
  --btn-bg: #3f4344;
  --btn-fg: #f2f4f4;
  --btn-bd: #6b7071;
  box-shadow: rgba(255, 255, 255, 0.55) 0px 0px 0px 0.03rem;
  opacity: 1;
}

.brief-go.is-loading {
  --btn-bg: var(--mint-700);
}

.brief-reroll {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.2rem;
  margin: 0.1rem 0.5rem 1.4rem;
  padding: 0.14rem 0.2rem;
  background: rgba(12, 15, 14, 0.9);
  border: 1px solid var(--mint-700);
}

.brief-reroll__text {
  display: flex;
  flex-direction: column;
  gap: 0.05rem;
  min-width: 0px;
  font-size: calc(.16 * var(--t));
}

.brief-reroll__text strong {
  font-size: calc(.2 * var(--t));
  color: var(--mint-400);
}

.brief-reroll__text > span {
  color: var(--text-lo);
}

.brief-reroll__players {
  display: flex;
  flex-wrap: wrap;
  gap: 0.08rem 0.2rem;
  color: var(--text-dim);
}

.brief-reroll__players .is-agreed {
  color: var(--mint-400);
}

.brief-reroll__players .is-rejected {
  color: var(--red);
}

.brief-reroll__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.1rem;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .brief-reroll {
    margin-inline: 0.3rem;
    gap: 0.1rem;
    padding: 0.1rem 0.14rem;
  }

  .brief-reroll__actions {
    flex-shrink: 1;
  }

  .brief-reroll__actions .btn {
    min-height: 0.44rem;
    padding-inline: 0.12rem;
  }
}

.brief .stephead, .draft .stephead {
  animation: tr-fade 360ms var(--tr-ease) backwards;
}

.stephead__title {
  animation: tr-right 420ms var(--tr-ease) 120ms backwards;
}

.brief-sec {
  animation-delay: calc(160ms + var(--i, 0) * 80ms);
}

.brief-sec .brief-bonds__row > *, .brief-sec .brief-banned__grid > * {
  animation-delay: calc(360ms + var(--i, 0) * 80ms);
}

.brief__foot .brief-ready, .brief__foot .brief-loadout {
  animation: tr-rise 420ms var(--tr-ease) 420ms backwards;
}

.brief-go {
  animation: brief-go-in 520ms var(--tr-ease) 480ms backwards;
  transform-origin: left center;
}

@keyframes brief-go-in {
  0% {
    opacity: 0;
    clip-path: inset(0px 100% 0px 0px);
    filter: brightness(2.2);
    transform: scaleX(0.08);
  }

  60% {
    opacity: 1;
    clip-path: inset(0px);
    filter: brightness(1.5);
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .brief .stephead, .draft .stephead, .stephead__title, .brief-sec, .brief-sec .brief-bonds__row > *, .brief-sec .brief-banned__grid > *, .brief__foot .brief-ready, .brief__foot .brief-loadout, .brief-go, .brief-ready__pips i.on {
    animation: auto ease 0s 1 normal none running none;
  }
}

.brief .brief-enemy {
  display: grid;
  grid-template-columns: auto minmax(0px, 1fr) auto;
  align-items: center;
  gap: 0.3rem 0.4rem;
  padding: 0.3rem 0.4rem 0.34rem 0.6rem;
}

.brief .brief-boss {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.brief .brief-boss__art {
  position: relative;
  width: 2.3rem;
  height: 2.3rem;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: radial-gradient(circle at 50% 40%, rgb(107, 52, 32), rgb(42, 18, 11) 75%);
  box-shadow: rgb(74, 78, 80) 0px 0px 0px 0.04rem, rgb(26, 28, 29) 0px 0px 0px 0.06rem, rgba(0, 0, 0, 0.6) 0px 0.06rem 0.2rem;
}

.brief .brief-boss__art::before, .brief .brief-boss__art::after {
  content: "";
  position: absolute;
  width: 0.5rem;
  height: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.25);
  pointer-events: none;
}

.brief .brief-boss__art::before {
  left: -0.26rem;
  top: -0.26rem;
  border-width: 0px 1px 1px 0px;
}

.brief .brief-boss__art::after {
  right: -0.26rem;
  bottom: -0.26rem;
  border-width: 1px 0px 0px 1px;
}

.brief .brief-boss__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.brief .brief-boss__q {
  font-size: calc(1 * var(--t));
  font-weight: 900;
  color: rgba(255, 140, 70, 0.6);
}

.brief .brief-boss__tag {
  position: relative;
  z-index: 1;
  margin-top: -0.02rem;
  width: 2.05rem;
  padding: 0.03rem 0px;
  text-align: center;
  font-size: calc(.2 * var(--t));
  font-weight: 700;
  letter-spacing: 0.14em;
  color: rgb(255, 207, 74);
  background: linear-gradient(rgb(90, 66, 16), rgb(58, 42, 8));
  box-shadow: rgba(255, 207, 74, 0.25) 0px 0px 0px 1px inset;
}

.brief .brief-boss__text {
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
  min-width: 0px;
}

.brief .brief-boss__name {
  margin: 0px;
  font-size: calc(.36 * var(--t));
  font-weight: 900;
  letter-spacing: 0.04em;
  line-height: 1.25;
}

.brief .brief-boss__when {
  font-size: calc(.17 * var(--t));
  color: var(--orange-hi);
}

.brief .brief-boss__abil {
  margin: 0.02rem 0px 0px;
  padding-left: 0.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.04rem;
  font-size: calc(.18 * var(--t));
  line-height: 1.55;
  color: rgb(169, 174, 176);
}

.brief .brief-stage {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.08rem;
  margin-top: 0.04rem;
  font-size: calc(.16 * var(--t));
  color: var(--text-lo);
}

.brief .brief-stage .icon {
  width: 0.2rem;
  height: 0.2rem;
  color: var(--mint-500);
}

.brief .brief-stage__name {
  color: var(--text-hi);
}

.brief .brief-stage__pool {
  color: var(--text-dim);
}

.brief .brief-factions {
  display: flex;
  align-items: flex-start;
  gap: 0.3rem;
  padding-right: 0.3rem;
}

.brief .brief-faction {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.14rem;
  width: 1.9rem;
  cursor: help;
}

.brief .brief-faction__icon {
  width: 1.12rem;
  height: 1.12rem;
  display: grid;
  place-items: center;
  border-radius: 50%;
  outline: none;
  transition: box-shadow var(--t-fast);
  background: radial-gradient(circle at 50% 45%, rgb(42, 58, 56), rgb(18, 24, 23) 70%);
  box-shadow: rgba(140, 255, 225, 0.14) 0px 0px 0.22rem, rgba(0, 0, 0, 0.7) 0px 0px 0.16rem inset;
}

.brief .brief-faction__icon img {
  width: 78%;
  height: 78%;
  object-fit: contain;
  filter: grayscale(1) brightness(1.6) drop-shadow(rgba(160, 255, 230, 0.6) 0px 0px 0.06rem);
}

.brief .brief-faction:hover .brief-faction__icon {
  box-shadow: rgba(140, 255, 225, 0.32) 0px 0px 0.26rem, rgba(0, 0, 0, 0.7) 0px 0px 0.16rem inset;
}

.brief .brief-faction__icon:focus-visible {
  box-shadow: 0 0 0 .03rem var(--mint-400), 0 0 .26rem rgba(140, 255, 225, .32), inset 0 0 .16rem rgba(0, 0, 0, .7);
}

.brief .brief-faction__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.04rem;
  min-width: 0px;
  max-width: 100%;
  text-align: center;
  overflow-wrap: anywhere;
}

.brief .brief-faction__text b {
  font-size: calc(.22 * var(--t));
  font-weight: 700;
  color: rgb(230, 234, 234);
}

.brief .brief-faction__text:lang(ko) {
  word-break: keep-all;
}

.tooltip.brief-faction__tip {
  max-width: max(3.8rem, min(calc(240px * var(--sp-ui, 1)), calc(100vw - 16px)));
  font-size: max(calc(.15 * var(--t)), 10px);
}

@media (max-height: 520px) {
  .stephead__micro {
    display: none;
  }

  .stephead__guide .btn__label {
    display: none;
  }

  .brief .stephead {
    height: auto;
    min-height: 1.3rem;
  }

  .brief .stephead__left, .brief .stephead__title {
    min-width: 0px;
  }

  .brief .stephead__name {
    min-width: 0px;
    white-space: normal;
    text-wrap-style: balance;
    line-height: 1.1;
  }

  .brief .stephead__name:lang(ko) {
    word-break: keep-all;
    overflow-wrap: break-word;
  }

  .brief .stephead__name:lang(ja) {
    line-break: strict;
  }
}

@media (max-height: 640px) {
  :root[data-text="lg"] .stephead__micro, :root[data-text="xl"] .stephead__micro {
    display: none;
  }

  :root[data-text="lg"] .stephead__guide .btn__label, :root[data-text="xl"] .stephead__guide .btn__label {
    display: none;
  }
}

.brief, .draft {
  --pg-ease: cubic-bezier(.16, .84, .3, 1);
}

@keyframes pg-fade {
  0% {
    opacity: 0;
  }
}

@keyframes pg-out {
  100% {
    opacity: 0;
  }
}

@keyframes pg-right {
  0% {
    opacity: 0;
    transform: translateX(0.36rem);
  }
}

@keyframes pg-left {
  0% {
    opacity: 0;
    transform: translateX(-0.36rem);
  }
}

@keyframes pg-rise {
  0% {
    opacity: 0;
    transform: translateY(0.22rem);
  }
}

@keyframes pg-pop {
  0% {
    opacity: 0;
    transform: scale(0.4);
  }
}

@keyframes pg-card {
  0% {
    opacity: 0;
    transform: translateY(0.16rem) scale(1.03);
  }
}

@keyframes pg-glow {
  20% {
    box-shadow: rgba(120, 255, 215, 0.9) 0px 0px 0.5rem, rgb(185, 255, 233) 0px 0px 0.12rem;
    border-color: rgb(185, 255, 233);
  }
}

@keyframes pg-dots {
  100% {
    width: 1.1em;
  }
}

.brief__vertag {
  position: relative;
  z-index: 2;
  align-self: flex-start;
  margin: 0.06rem 0.5rem 0px;
}
