/* Reborn Atelier R3 — visible progression, ordered unlock lanes, single-tone gradients */
.design-modern-command-center .identity-community-status,
.design-modern-command-center .identity-premium-status {
  min-height: 74px;
}

.design-modern-command-center .identity-community-status > b,
.design-modern-command-center .identity-premium-status > b {
  margin-top: 3px;
  color: #9fb3bd;
  font-size: 9px;
  font-weight: 800;
  line-height: 1;
}

.design-modern-command-center .identity-mini-progress {
  display: block;
  width: 100%;
  height: 4px;
  margin-top: 5px;
  overflow: hidden;
  border-radius: 10px;
  background: rgba(94, 134, 153, .2);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .32);
}

.design-modern-command-center .identity-mini-progress > i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #36b9d2, #76e6cb);
  box-shadow: 0 0 8px rgba(81, 220, 215, .32);
}

.design-modern-command-center .identity-mini-progress.vip > i {
  background: linear-gradient(90deg, #9d6bea, #df94f2);
  box-shadow: 0 0 8px rgba(178, 103, 235, .34);
}

.design-modern-command-center .identity-progress-guide {
  padding: 12px;
  border: 1px solid rgba(102, 169, 193, .22);
  border-radius: 10px;
  background:
    radial-gradient(circle at 15% 0, rgba(37, 172, 207, .1), transparent 38%),
    linear-gradient(110deg, rgba(6, 27, 39, .92), rgba(5, 18, 28, .84));
}

.design-modern-command-center .identity-progress-guide > header {
  display: flex;
  gap: 10px;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 10px;
}

.design-modern-command-center .identity-progress-guide > header span {
  color: #e8f1f4;
  font-size: 14px;
  font-weight: 900;
}

.design-modern-command-center .identity-progress-guide > header small {
  color: #8da2ad;
  font-size: 10px;
}

.design-modern-command-center .identity-progress-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
}

.design-modern-command-center .identity-progress-columns > article {
  min-width: 0;
  padding: 10px 11px;
  border: 1px solid rgba(95, 156, 181, .16);
  border-radius: 8px;
  background: rgba(2, 14, 22, .58);
}

.design-modern-command-center .identity-progress-columns > article.vip {
  border-color: rgba(171, 108, 224, .2);
  background: linear-gradient(135deg, rgba(69, 40, 108, .18), rgba(2, 14, 22, .58));
}

.design-modern-command-center .identity-progress-heading {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}

.design-modern-command-center .identity-progress-heading span {
  color: #76d7e8;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.design-modern-command-center .identity-progress-heading strong {
  color: #e4edf0;
  font-size: 12px;
}

.design-modern-command-center .identity-progress-row {
  display: grid;
  grid-template-columns: 100px minmax(70px, 1fr) 86px;
  gap: 8px;
  align-items: center;
  min-height: 22px;
}

.design-modern-command-center .identity-progress-row > span,
.design-modern-command-center .identity-progress-row > b {
  color: #9eb1ba;
  font-size: 10px;
}

.design-modern-command-center .identity-progress-row > b {
  color: #d8e4e8;
  font-weight: 800;
  text-align: right;
  white-space: nowrap;
}

.design-modern-command-center .identity-progress-row > i {
  display: block;
  height: 5px;
  overflow: hidden;
  border-radius: 10px;
  background: rgba(94, 135, 154, .2);
}

.design-modern-command-center .identity-progress-row > i > i {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #31afca, #63d9d0);
}

.design-modern-command-center .identity-progress-row.exp > i > i {
  background: linear-gradient(90deg, #46c59a, #7ee9bd);
}

.design-modern-command-center .identity-progress-row.vip > i > i {
  background: linear-gradient(90deg, #9562de, #df8be9);
}

.design-modern-command-center .identity-progress-requirement {
  margin-top: 5px;
  color: #9fb1ba;
  font-size: 10px;
  font-weight: 700;
  text-align: right;
}

.design-modern-command-center .identity-progress-requirement.ready { color: #78ddb2; }
.design-modern-command-center .identity-progress-requirement.waiting { color: #d2aa69; }
.design-modern-command-center .identity-progress-columns article > p { margin: 5px 0 0; color: #a8bbc3; font-size: 11px; }

.design-modern-command-center .identity-collection-tabs {
  grid-template-columns: repeat(3, minmax(112px, 1fr));
  max-width: 520px;
}

.design-modern-command-center .identity-unlock-list {
  display: grid;
  gap: 10px;
}

.design-modern-command-center .identity-unlock-level {
  padding: 10px;
  border: 1px solid rgba(104, 151, 173, .14);
  border-radius: 8px;
  background: rgba(2, 14, 22, .44);
}

.design-modern-command-center .identity-unlock-level.unlocked {
  border-color: rgba(72, 190, 169, .22);
  background: linear-gradient(100deg, rgba(23, 91, 82, .09), rgba(2, 14, 22, .44) 42%);
}

.design-modern-command-center .identity-unlock-level > header {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  padding-bottom: 7px;
  border-bottom: 1px solid rgba(105, 153, 175, .12);
}

.design-modern-command-center .identity-unlock-level > header span {
  display: flex;
  gap: 8px;
  align-items: center;
  color: #d7e4e8;
  font-size: 12px;
  font-weight: 800;
}

.design-modern-command-center .identity-unlock-level > header b {
  padding: 3px 7px;
  border: 1px solid rgba(91, 184, 206, .27);
  border-radius: 20px;
  color: #79d7e9;
  background: rgba(16, 61, 76, .36);
  font-size: 10px;
  white-space: nowrap;
}

.design-modern-command-center .identity-unlock-level.unlocked > header b {
  border-color: rgba(75, 210, 161, .3);
  color: #83e3ba;
  background: rgba(26, 91, 70, .3);
}

.design-modern-command-center .identity-unlock-level > header small {
  color: #8298a3;
  font-size: 10px;
  text-align: right;
}

.design-modern-command-center .identity-shop-body-v2 .identity-product-card {
  grid-template-columns: minmax(105px, .8fr) minmax(125px, 1fr) minmax(72px, auto);
}

.design-modern-command-center .identity-shop-body-v2 .identity-product-state {
  max-width: none;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

.design-modern-command-center .identity-shop-body-v2 .identity-detail-status strong {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
  overflow-wrap: anywhere;
}

.design-modern-command-center .identity-shop-body-v2 .identity-product-detail {
  grid-template-columns: minmax(190px, 1fr) minmax(135px, auto) 78px minmax(170px, auto);
}

.design-modern-command-center [class*="identity-name-mark-tone-"] {
  display: inline-block;
  color: #f1f4f6;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-shadow: 0 0 10px rgba(132, 175, 206, .16);
}

.design-modern-command-center .identity-name-mark-tone-amethyst { background-image: linear-gradient(90deg, #8c70db, #b28cf0, #d1aff4); }
.design-modern-command-center .identity-name-mark-tone-amber { background-image: linear-gradient(90deg, #d7833d, #eea555, #ffd08a); }
.design-modern-command-center .identity-name-mark-tone-jade { background-image: linear-gradient(90deg, #43a47f, #67c79f, #a0e3bd); }
.design-modern-command-center .identity-name-mark-tone-blossom { background-image: linear-gradient(90deg, #cb6d9f, #e38ab7, #f6b7d0); }
.design-modern-command-center .identity-name-mark-tone-ocean { background-image: linear-gradient(90deg, #4c7fca, #5ca8e0, #80d1e5); }
.design-modern-command-center .identity-name-mark-tone-ruby { background-image: linear-gradient(90deg, #bd4c62, #df687b, #f39aa8); }
.design-modern-command-center .identity-name-mark-tone-midnight { background-image: linear-gradient(90deg, #5a69b9, #737bd4, #9c94e5); }

@media (max-width: 900px) {
  .design-modern-command-center .identity-progress-columns { grid-template-columns: 1fr; }
  .design-modern-command-center .identity-collection-tabs { max-width: none; }
  .design-modern-command-center .identity-shop-body-v2 .identity-product-detail { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 620px) {
  .design-modern-command-center .identity-community-status,
  .design-modern-command-center .identity-premium-status { min-height: 64px; }
  .design-modern-command-center .identity-community-status > span,
  .design-modern-command-center .identity-premium-status > span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .design-modern-command-center .identity-community-status > b,
  .design-modern-command-center .identity-premium-status > b { display: block; }
  .design-modern-command-center .identity-progress-guide > header { align-items: flex-start; flex-direction: column; gap: 2px; }
  .design-modern-command-center .identity-progress-row { grid-template-columns: 88px minmax(52px, 1fr) 76px; gap: 6px; }
  .design-modern-command-center .identity-progress-row > span,
  .design-modern-command-center .identity-progress-row > b { font-size: 9px; }
  .design-modern-command-center .identity-collection-tabs { grid-template-columns: 1fr; }
  .design-modern-command-center .identity-collection-tabs button { min-height: 40px; }
  .design-modern-command-center .identity-collection-group > header,
  .design-modern-command-center .identity-unlock-level > header { align-items: flex-start; flex-direction: column; gap: 4px; }
  .design-modern-command-center .identity-unlock-level > header small { text-align: left; }
  .design-modern-command-center .identity-shop-body-v2 .identity-product-card { grid-template-columns: minmax(76px, .7fr) minmax(100px, 1fr) auto; }
  .design-modern-command-center .identity-shop-body-v2 .identity-product-state { max-width: none; overflow: visible; font-size: 10px; text-overflow: clip; }
}

@media (max-width: 390px) {
  .design-modern-command-center .identity-progress-row { grid-template-columns: 1fr 72px; }
  .design-modern-command-center .identity-progress-row > i { grid-column: 1 / -1; grid-row: 2; }
  .design-modern-command-center .identity-progress-row > b { grid-column: 2; grid-row: 1; }
  .design-modern-command-center .identity-shop-body-v2 .identity-product-card { grid-template-columns: minmax(0, 1fr) auto; }
  .design-modern-command-center .identity-shop-body-v2 .identity-color-swatch { grid-column: 1; }
  .design-modern-command-center .identity-shop-body-v2 .identity-product-copy { grid-column: 1; }
  .design-modern-command-center .identity-shop-body-v2 .identity-product-state { grid-column: 2; grid-row: 1 / span 2; }
}

@media (forced-colors: active) {
  .design-modern-command-center [class*="identity-name-mark-tone-"] {
    color: CanvasText !important;
    background: none !important;
    -webkit-text-fill-color: CanvasText !important;
  }
  .design-modern-command-center .identity-mini-progress,
  .design-modern-command-center .identity-progress-row > i { border: 1px solid CanvasText; }
}

