:root{
  --m-card-bg:#ffffff;
  --m-card-border:rgba(0,0,0,.06);
  --m-shadow:0 12px 30px rgba(0,0,0,.08);
  --m-radius:16px;
}

.modern-card{
  background:var(--m-card-bg);
  border:1px solid var(--m-card-border);
  border-radius:var(--m-radius);
  box-shadow:var(--m-shadow);
  padding:18px;
}

.modern-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  font-weight:600;
  font-size:12px;
  border:1px solid var(--m-card-border);
  background:rgba(0,0,0,.02);
}

.modern-kv{
  display:flex;
  flex-wrap:wrap;
  gap:10px 18px;
  margin-top:10px;
}
.modern-kv .item{display:flex;gap:8px;align-items:baseline;}
.modern-kv .k{color:rgba(0,0,0,.55);font-size:12px;font-weight:600;}
.modern-kv .v{font-weight:700;}

.modern-list{
  margin:0;
  padding:0;
  list-style:none;
}

.modern-list li{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:12px 0;
  border-bottom:1px dashed rgba(0,0,0,.12);
}
.modern-list li:last-child{border-bottom:none;}

.copy-btn{
  border:none;
  border-radius:10px;
  padding:8px 10px;
  font-weight:700;
  cursor:pointer;
}

.copy-btn:active{transform:scale(.99);}

.modern-mono{
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 13px;
  white-space: pre-wrap;
  word-break: break-word;
}