/*
 * Play cards are technical plates: dense, flat, precise and reproducible.
 * No faux paper stack, rounded product tile, or decorative title breaking.
 */

html[data-design-system="halde"] .breadth-mint-slot{
  min-width:0;
  overflow:hidden;
  background:color-mix(in srgb,var(--bg-page) 82%,transparent);
}

html[data-design-system="halde"] .breadth-mint-card{
  width:min(100%,310px);
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  transform:none;
}

html[data-design-system="halde"] .breadth-mint-card .play-cover{
  position:relative;
  isolation:isolate;
  display:grid;
  grid-template-areas:
    "top"
    "title"
    "activity"
    "foot";
  grid-template-rows:auto minmax(68px,1fr) auto auto;
  width:100%;
  min-height:250px;
  aspect-ratio:auto;
  box-sizing:border-box;
  padding:14px 16px;
  overflow:hidden;
  color:var(--artifact-text);
  border:1px solid var(--artifact-rule);
  border-radius:4px!important;
  background-color:var(--artifact-bg);
  background-image:
    radial-gradient(circle at 2px 2px,color-mix(in srgb,var(--artifact-text) 7%,transparent) 0 .38px,transparent .6px),
    linear-gradient(145deg,color-mix(in srgb,var(--artifact-text) 4%,transparent),transparent 48%);
  background-size:23px 23px,100% 100%;
  box-shadow:none!important;
}

html[data-design-system="halde"] .breadth-mint-card .play-cover::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  border:0;
  border-radius:4px!important;
  background:linear-gradient(var(--accent),var(--accent)) calc(100% - 12px) 12px / 3px 23px no-repeat;
  box-shadow:none;
}

html[data-design-system="halde"] .breadth-mint-card .play-cover::after{
  content:"+";
  position:absolute;
  inset:auto 14px auto auto;
  top:42%;
  display:block;
  z-index:0;
  color:var(--artifact-muted);
  font:400 16px/1 var(--font-editorial);
  opacity:1;
  mix-blend-mode:normal;
  transform:none;
}

html[data-design-system="halde"] .breadth-mint-card .play-cover > *{
  position:relative;
  z-index:1;
}

html[data-design-system="halde"] .breadth-mint-card .cover-top{
  grid-area:top;
  align-items:flex-start;
  gap:12px;
  padding:0 18px 8px 0;
  border-bottom:1px solid var(--artifact-rule);
  color:var(--artifact-text);
  font:560 6.5px/1.15 var(--font-technical);
  letter-spacing:.045em;
  opacity:1;
  text-shadow:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-top span:first-child{
  padding:0;
  color:var(--artifact-text);
  background:transparent;
  box-shadow:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-top span:last-child{
  max-width:14ch;
  margin-left:auto;
  text-align:right;
}

html[data-design-system="halde"] .breadth-mint-card .cover-title{
  grid-area:title;
  align-self:end;
  max-width:none;
  display:grid;
  gap:5px;
  margin:0;
  padding:14px 0 10px;
  color:var(--artifact-text);
  text-shadow:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-title small{
  color:var(--artifact-muted);
  font:650 6px/1 var(--font-technical);
  letter-spacing:.09em;
  text-transform:uppercase;
}

html[data-design-system="halde"] .breadth-mint-card .cover-title strong{
  display:block;
  max-width:13ch;
  font-family:var(--font-editorial);
  font-size:clamp(20px,6.7vw,31px);
  font-variation-settings:"wght" 570;
  font-weight:570;
  letter-spacing:-.055em;
  line-height:.88;
  text-transform:uppercase;
  text-wrap:balance;
  overflow-wrap:normal;
  word-break:normal;
  hyphens:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-title p{
  max-width:28ch;
  margin:0;
  color:var(--artifact-muted);
  font:540 7px/1.3 var(--font-technical);
  letter-spacing:.025em;
  text-transform:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity{
  grid-area:activity;
  min-height:46px;
  height:auto;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:end;
  margin:0 0 8px;
  padding:9px 0 4px;
  gap:8px;
  border-top:1px solid color-mix(in srgb,var(--artifact-text) 44%,transparent);
  border-bottom:0;
  border-radius:0!important;
  background:transparent;
  box-shadow:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity i{
  min-width:0;
  height:auto;
  display:grid;
  gap:3px;
  align-content:end;
  aspect-ratio:auto;
  border:0;
  border-radius:0!important;
  color:var(--artifact-text);
  background:transparent;
  box-shadow:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity i b{
  width:100%;
  height:3px;
  display:block;
  background:var(--artifact-text);
  opacity:.34;
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity i em{
  overflow:hidden;
  font:620 6px/1 var(--font-technical);
  font-style:normal;
  letter-spacing:.04em;
  text-overflow:ellipsis;
  white-space:nowrap;
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity i small{
  overflow:hidden;
  color:var(--artifact-muted);
  font:560 5px/1 var(--font-technical);
  letter-spacing:.055em;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-1{
  height:5px;
  background:color-mix(in srgb,var(--artifact-text) 22%,transparent);
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-2{
  height:12px;
  background:color-mix(in srgb,var(--artifact-text) 42%,transparent);
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-3{
  height:21px;
  background:color-mix(in srgb,var(--artifact-text) 68%,transparent);
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-4{
  height:31px;
  background:var(--artifact-text);
}

html[data-design-system="halde"] .breadth-mint-card .cover-activity i:nth-child(23),
html[data-design-system="halde"] .breadth-mint-card .cover-activity i:nth-child(61){
  background:var(--accent);
}

html[data-design-system="halde"] .breadth-mint-card .cover-foot{
  grid-area:foot;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:end;
  gap:8px;
  margin:0;
  padding-top:7px;
  border-top:1px solid var(--artifact-rule);
  color:var(--artifact-text);
  font:560 6px/1.1 var(--font-technical);
  letter-spacing:.055em;
  opacity:1;
  box-shadow:none;
  text-shadow:none;
}

html[data-design-system="halde"] .breadth-mint-card .cover-foot span:nth-child(2){text-align:center}
html[data-design-system="halde"] .breadth-mint-card .cover-foot span:last-child{text-align:right}

html[data-design-system="halde"] .breadth-mint-card .cover-foot b{
  padding:0;
  border:0;
  background:transparent;
  font-size:1em;
  letter-spacing:.08em;
}

html[data-design-system="halde"] .breadth-mint-slot.is-minted .breadth-mint-card{
  transform:translateY(-2px);
  filter:none;
}

@media (min-width:961px) and (max-height:800px){
  html[data-design-system="halde"] .breadth-mint-card{
    width:min(100%,210px);
  }

  html[data-design-system="halde"] .breadth-mint-card .play-cover{
    grid-template-rows:auto minmax(43px,1fr) auto auto;
    min-height:190px;
    padding:11px;
  }

  html[data-design-system="halde"] .breadth-mint-card .cover-top{
    padding-bottom:7px;
    font-size:5px;
  }

  html[data-design-system="halde"] .breadth-mint-card .cover-title{
    padding:8px 0 6px;
  }

  html[data-design-system="halde"] .breadth-mint-card .cover-title strong{font-size:18px}
  html[data-design-system="halde"] .breadth-mint-card .cover-title p{font-size:5.5px}

  html[data-design-system="halde"] .breadth-mint-card .cover-activity{
    height:32px;
    margin-bottom:6px;
    padding:5px 0;
    gap:1px;
  }

  html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-1{height:3px}
  html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-2{height:7px}
  html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-3{height:13px}
  html[data-design-system="halde"] .breadth-mint-card .cover-activity .run-level-4{height:21px}

  html[data-design-system="halde"] .breadth-mint-card .cover-foot{
    padding-top:6px;
    font-size:4.5px;
  }
}

@media (max-width:600px){
  html[data-design-system="halde"] .breadth-mint-card{
    width:min(100%,280px);
    max-width:100%;
  }

  html[data-design-system="halde"] .breadth-mint-card .play-cover{
    padding:13px 14px;
  }

  html[data-design-system="halde"] .breadth-mint-card .cover-title strong{
    font-size:clamp(21px,7.2vw,28px);
  }
}